ChatGPT 선생님과 성장하는 독학 개발자의 기록

우아한테크코스 6기 과정 중 프리코스 과정이 시작되었다. 첫 번째 미션으로 "숫자 야구" 미션을 진행하였다. 프리코스 과정은 마치 "Jest"를 알고 있는 것을 전재로 시작하는 기분이었다. 미션 실행을 Jest로 다루게 되어 있었다. 코드를 살펴보고 나서 느낀 것은 코드 내용은 알 수 없지만, 이름을 보고 대략적으로 "어떤 기능을 수행하겠구나" 싶었다. 테스트 코드를 대략적으로 이해는 하고 있어야 겠다는 생각이 들어 검색을 통해 기본적으로 필요한 내용만 찾아보았다. 대충 테스트 코드는 다음과 같았다. const mockQuestions = (inputs) => { MissionUtils.Console.readLineAsync = jest.fn(); MissionUtils.Console.readLineAs..

⤴ 문구 부분에서는 비교적 중요도가 낮은 글은 톤을 낮춰 불필요한 시선 처리에 기준을 잡아준다. 버튼 부분에서는 중요도에 따른 버튼은 컬러로 계층을 잡아준다. ⤴ 각각의 사이에 여백을 활용하여 코너 간 계층을 잡고 그룹핑을 한다. 중요도에 따른 버튼은 컬러로 계층을 잡아준다. ⤴ 영역이 넓어지지만 직관적인 버튼형으로 각각의 내용을 명확하게 디자인한다. ⤴ 사용자의 시선을 강제하지 않도록 BG 컬러를 약하게 처리하여 디자인한다. ⤴ 과감하게 컬러를 사용해 채팅창과 버튼을 명확하게 구분 지어 디자인한다.

2주 간 진행됐던 원티드 프리온보딩의 10월 프론트엔드 챌린지도 마무리되었다. 이번 챌린지는 이전과 달리 실습하는 시간이 굉장히 많이 주어졌다. 이전 챌린지들은 주로 이론으로 진행되거나, 실습도 시간이 주어지기 보다 프로젝트가 주어지고, 개인 시간을 활용하도록 진행됐다. 그러나, 이번 챌린지는 하루 3시간 강의 시간동안 약 1시간 30분이 실습 시간이었다. 강사님이 배달의 민족 소속이셔서 그런걸까? 진행 방식이 신선했다. 단순히 전달하는 방식이 아닌 직접 생각해보고, 고민해보고, 구현해보는 시간알 갖도록 해주셨다. 실습을 하게 되니 직접 코드도 작성해보고 학습도 더 잘 되는 기분이었다. 강사님의 진행은 모든 내용을 깊숙히 파고 드는 느낌보다 핵심만 짧고 빠르게 전달해주시는 느낌이었다. 개인적으로는 이 진..

2023년 10월, 원티드 프리온보딩 프론트엔드 챌린지 요약 로그인사용자가 시스템에 접근하거나 동작을 수행하는 것을 제어하고, 기록하기 위한 컴퓨터 보안 절차이다. 토큰 및 세션의 로그인 동작 과정은 이전 시간까지 계속 다루어왔기 때문에 여기서 따로 메모하지 않겠다. 권한에 따라 적절한 자원에 접근하기로그인 회원의 권한에 따라 유저 전용 페이지 및 데이터에 접근하거나 사장 전용 페이지 및 데이터에 접근하는 방법은 무엇일까? 유저 확인 & 권한 관리우선 서버와의 역할 분담에서 항상 지켜져야 하는 것을 알아야 한다.이 때, '서버 벨리베이션'은 필수적으로 구현해야 된다. 서버에서는 권한에 따라 본인의 자원에만 접근할 수 있도록 구현할 수 있다. 즉, 권한에 따라 동작을 제어하는 것이다. 그렇다면, 프론트엔드..

2023년 10월, 원티드 프리온보딩 프론트엔드 챌린지 요약 세션사용자의 로그인 이후 로그아웃 혹은 로그인 만료까지의 기간을 말한다. 세션은 쉽게 말해, 유저에게 사원증을 배부하는 것이라고 이해하면 된다. 사원증을 받고 반납하기 전까지는 그 회사의 직원으로 인식되는 것과 같다. 세션의 기술적 실체는 무엇일까?데이터 저장 방식? 통신 프로토콜? 인증 방법론? 암호화 방식? 세션 로그인사용자 로그인이 유효한 시간 동안 서버에 세션 아이디를 기록해두고 인증에 사용하는 방식이다. 클라이언트에서 서비스에 회원정보를 전달한다. (예. username: blue, password: 1234!@#$)그렇다면, 서비스에서는 전달 받은 값들을 확인하여 그에 맞는 회원정보를 확인하고 토큰을 전달한다.회원정보가 확인이 되고,..

2023년 10월, 원티드 프리온보딩 프론트엔드 챌린지 요약 토큰 토큰 기반 인증이란 사용자가 자신의 아이덴티티를 확인하고 고유한 액세스 토큰을 받을 수 있는 프로토콜이다.쉽게 말해, 기술적인 사용으로 "신원 증명"이다. 그렇다면, 로그인에 토큰을 사용하는 이유는 무엇일까?우리가 서비스를 이용할 때, 회원의 신원이 필요할 때가 있다. 예를 들면, 배달의 주문에서 배달을 주문한 회원이 배달 상황에 대해 문의를 하게 되면, 그 회원의 신원이 있어야 답을 줄 수 있을 것이다. 즉, 누구인지 알아야 문의에 대답을 해줄 수 있다는 것이다. 토큰 전체 흐름클라이언트 → 로그인 요청 → 서비스에서 토큰 발급 및 전달 → 토큰 보관 → 토큰을 사용해 서비스에 요청 실제 서비스에서는 어떤 기능이 필요할까?로그인 후 로그..

2023년 10월, 원티드 프리온보딩 프론트엔드 챌린지 요약 로그인은 무엇일까?로그인은 사용자가 시스템(컴퓨터 or 웹 사이트)에 액세스하기 위해 시스템에 식별자 정보를 입력하는 것이다. 이 때, 컴퓨터 보안 절차는 필수적인 부분이다. 해당 사용자는 시스템의 제한된 파일 및 프로그램 세트에만 액세스할 수 있다. 로그인은 액세스를 제한할 뿐만 아니라 시스템 로그 파일에 자동으로 입력되는 데이터 형식의 감사 추적도 제공한다. 즉, 쉽게 말해 "사용자가 시스템에 접근하거나 동작을 수행하는 것을 제어하고 기록하기 위한 컴퓨터 보안 절차"를 말한다.주문, 리뷰, 쿠폰, 기타 등 회원정보가 필요한 서비스에는 로그인이 필요하다.또한, 특정 서비스마다 접근 가능한 회원도 나눌 수 있다. 로그인 구현을 위한 개념 - 백..

2023년 9월, 원티드 프리온보딩 프론트엔드 챌린지 요약 이제는 데스크탑 기준으로 웹 사이트를 개발해본다고 해보자. 데스크탑 기준으로 다양한 브라우저가 존재하며, 현재 기준으로 크롬, 엣지, 웨일, 사파리, IE 순으로 점유율이 높다.모바일&태블릿 기준으로 본다면, 크롬, 사파리, 삼성인터넷, 웨일, 기타 순으로 점유율이 높다. 우리가 웹 사이트를 개발할 때, 고려해야 할 것은 바로 '브라우저 호환성'이다.보통 'WebKit'을 떠올릴 수 있는데, 이는 웹 브라우저를 만드는 데 기반을 제공하는 오픈 소스 응용 프로그램 프레임워크다.쉽게 말해, 브라우저마다 각기 다른 대응을 할 수 있다는 것이다. 우리가 브라우저의 호환성을 알아야 하며 중요하게 생각해야 할 필요가 있을까?당연히 있다. 이는 사이트 최적화..