프로그래머스에서 진행되는 프론트엔드 개발자를 위한 자바스크립트 스터디 미션을 통해 배운 것들을 정리했습니다

1주차 미션

목표 : TodoList 함수 내에서 setState 함수 만들기

✅구현사항

• TodoList 컴포넌트 작성하기
• error 처리하기
• 한 페이지에서 TodoList 컴포넌트 여러개 만들어 보기
• Todo에 isCompleted 필드 추가하고 완료된 항목에 삭선 처리하기
• setState() 함수 만들고 상태변화 시 새로 렌더링하기

👋배운내용

• 컴포넌트의 역할과 구조 이해하기
• this
• 다양한 오류 발생 상황에 대한 error 처리
• 모든 상태 변화는 setState에서 진행

2주차 미션

목표 : TodoList 컴포넌트 데이터 추가 및 TodoList로 그려지는 할 일 목록 기능 추가

✅ 구현사항

• 할 일 추가, 삭제, 완료 기능 추가
• InputTodo 컴포넌트화
• TodoCount 컴포넌트 추가
• Event Delegate
• 커스텀 이벤트
• localStorage에 할 일 저장

👋 배운내용

• 이벤트 처리 및 커스텀이벤트 활용하기
• 로컬스토리지 에러 처리하기
• 각 파일별로 분류하고 컴포넌트화하기

3주차 미션

목표 : 이디어츠 API를 통해 이디어츠 공연 검색기 만들기

✅ 구현사항

• API를 이용하여 움짤 검색기 만들기
• async, await 사용하기
• 검색창에 debounce 적용
• 검색 히스토리(중복 X, 히스토리를 선택하여 검색)

👋배운내용

• 컴포넌트별로 폴더 구분하기
• async, await 제대로 이해하기
• 디바운스 알아보기
• find 메서드 사용하기

4주차 미션

목표 : 미니트렐로 만들기

✅ 구현사항

• Todo App API를 이용하여 TodoList 구현하기
• 할 일 목록 불러오기, 추가하기, 완료여부 토글, 삭제, 전체삭제
• 특정 사용자의 할 일 전체 삭제하기
• Users 컴포넌트를 만들고 선택된 사용자의 할 일 보여주기
• API가 느린 경우의 인터렉션 처리하기

👋배운내용

• 기존에 했던 내용들 복습
• Loading 상태 만들기
• 웹팩 설정하기