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

2024년 5월 11일 프론트엔드 챌린지 강의 요약 타입스크립트타입스크립트 비율은 높아짐을 넘어 이제는 기본이 되었다.우리는 왜 타입스크립트를 사용해야 할까? 안전자바스크립트는 동적 타입 언어! 즉, 런타임에 실제 코드 값이 평가 될 시점에서야 변수가 들어올 값과 타입을 알 수 있다.function multiply(num1, num2) { let result = num1 * num2; return result;} 위 코드에서 런타임에 어떤 값이 들어올 지 알 수 없다. 변수 이름만으로 추측해야할 뿐이다. 반면, 정적 타입 언어들은 컴파일 타임에 변수 타입 결정! 코드를 실행해보지 않아도 변수 값이 무슨 타입인지 빌드 타임에 미리 확인이 가능하다. 이는 개발자가 변수 타입이 무엇인지 코드 레벨에..

2024년 5월 7일 프론트엔드 강의 요약 정리 취업/이직을 하기 위해서 해야하는 일이력서 수정? 프로젝트 구현? 강의 학습? 교육기관에서 코스 교육 수료?→ X. 신입/주니어는 '계속 자문하며, 문제를 풀어나가는 능력'을 기르기 취업 전략을 요구하는 시장계속 자문하기문제를 풀어나가는 능력 개발자는 '기술적 문제를 해결하는 사람이고, 그 노동의 댓가로 가치가 생기는 직군'다만, '기술적인' 문제를 해결하는 것이며, '기술로만' 문제를 해결하는 것이 아니다. 세 단계의 입문 ~ 주니어기초적 프로그래밍 개념(변수, 함수, 조건문, 반복문 등)과 프레임워크를 익히는 단계프로젝트의 특정 기능을 구현할 수 있는 단계제품을 실제 운영 환경에서 사용자에게 제공하고 대처하며 운영해나갈 수 있는 단계 2 ~ 3 사이의 ..

2024년 4월 13일 프론트엔드 요약정리 UI/UXUI(User Interface): 사용자가 서비스를 이용할 때 마주하는 디자인 요소 (아이콘, 폰트, 간격 등)UX(User Experience): 디자인 요소를 바탕으로 만들어진 서비스를 사용할 때 사용자가 겪는 경험 및 감정 UI/UX가 중요한 이유경쟁력 강화사용자들은 시장의 다양한 옵션 중에서 가장 사용하기 쉽고 유용한 제품을 선택UI/UX 디자인을 통해 경쟁 서비스와의 차별화 + 더 많은 사용자를 유치브랜드 가시성 향상잘 디자인된 UI는 사용자에게 브랜드 정체성을 각인사용자 개선직관적인 인터페이스, 명확한 플로우, 효과적인 정보 구성 등을 통해 사용자들은 쉽게 서비스 이용비즈니스 성과 향상사용자들의 만족도와 충성도가 높아지면 매출 증가 및 고객..

2024년 4월 12일 디자인 요약정리 4DDiscoverDefineDevelopDeliver User Scenario(사용자 시나리오)'Scenario(시나리오)'는 어떤 사건에 대해 구체적인 과정을 이야기 형식으로 기술한 것 'User Scenario(사용자 시나리오)'는 사용자가 다양한 맥락 속 서비스를 경험하며 목적을 달성하는 과정을 이야기 형식으로 기술한 것 Process대상이 되는 사용자에 대한 정의 (Persona 활용)사용자가 서비스를 접하게 되는 계기(목적)와 상황에 대한 정의사용자가 목적 달성을 위해 서비스와 만나는 지점들을 나열각 접점에서 수행하는 (인터렉션, 소통하는) Task를 나열각 접점을 이어주는 줄거리를 이야기 형태로 작성서비스로부터 얻게되는 가치(결론)가 무엇인지 정의 예시..

2024년 4월 9일 프론트엔드 강의 요약 REST API(Representational State Transfer API)'REST'를 기반으로 만들어진 'API' API: 프로그램에서 사용할 수 있도록, 운영 체제나 프로그래밍 언어가 제공하는 기능을 제어할 수 있게 만든 인터페이스   클라이언트가 특정 기능을 이용하기 위해 어떤 주소로 요청을 보내면 서버가 응답해주는 체계Client --- 클라이언트 입장에서 요청의 종류는 크게 4가지(CRUD) → Server REST: 자원을 이름으로 구분하여 해당 자원의 상태를 주고 받는 모든 것을 의미HTTP URL(Uniform Resource Identifier)를 통해 자원(Resource)을 명시HTTP Method(POST, GET, PUT, DELE..

2024년 4월 9일, 원티드 디자인 프리온보딩 요약 정리 주소창 등 사용자가 이용할 수 있는 이벤트 영역은 손 쉬운 사용을 위해 '하단'에 위치버튼은 보통 우측 하단에 위치하는 경우가 많으나, 오른쪽 엄지 손가락을 고려하여 좌측을 사용하는 것이 더 편리 Touch Target안드로이드, IOS 표준 'px' 기준을 지칭지문 인식 - 57px프로필 이미지 - 48px검색 아이콘 - 48px(컨테이너) / 24px(아이콘)버튼 - 48px(여백) / 36px(버튼)Toolbar Title 및 Icon - 40pxSearch Bar - 36pxButton - 44px(IOS) / 48px(Andriod) 모바일은 다른 디바이스와 달리 시간과 공간의 제약이 적으며 디자인 시, 사용자의 'Context'을 고려..

2024년 4월 6일, 원티드 프론트엔드 챌린지 요약 정리 React HookHook 장점로직의 재사용 가능 및 쉬운 관리 → 함수 안에서 다른 함수를 호출하는 것으로 새로운 Hook 생성 가능로직을 한 곳에 모을 수 있음에 좋은 가독성 Hook 사용 규칙컴포넌트 최상위에서만 Hook 사용하기 → 반복문, 조건문 함수 안에서 사용 불가여러 번 사용 가능React 컴포넌트 안에서만 사용 가능 (자바스크립트 안에서 사용 불가)상태관리 Hook - useStateconst [state, setState] = useState(value); state: 상태(변수)setState: state를 변경하는 함수value: 초기값 'useState'는 구조분해할당(비구조화 할당)으로, '비구조화할당'은 배열이나 객체 ..

2024년 4월 4일 원티드 디자인 프리온보딩 요약 정리 "정성적인" 정량적인(수치)를 선택하는 이유는 "인지도를 정확하게 파악하기 위해", "평균 구매시간을 파악하기 위해"  행동의(사람들이 무엇을 하는가)UsabilityA/B Testing 고객조사 및 아이디어조사 목적 및 개요사용자 조사의 목적을 파악할 수 있도록 작성설문 구조 요약설문지를 어떻게 구조화 했는지 파악할 수 있도록 요약주요 결과 요약주요 결과를 파악할 수 있도록 핵심적인 사항만 기재인사이트 도출결과 해석을 통한 인사이트 도출UX 전략 및 디자인 연결성 사용자 이해정량 조사(Survey) → 보다 넓은 범위로 사용자를 이해정성 조사(Interview) → 보다 깊이 있게 사용자를 이해 5 Whys?Why? → Why? → Why? → ..