• DOM 요소를 CRUD하고 적절한 이벤트를 등록/해제 할 수 있습니다.
• 배열과 객체의 메서드 사용에 능숙하며 필요한 데이터를 가공하여 사용 할 수 있습니다.
• 비동기 처리로 HTTP response를 처리하고 데이터를 추출해 웹페이지에 적용 할 수 있습니다.
• 클래스와 프로토타입의 차이를 이해하고 사용 할 수 있습니다.

• 시멘틱태그를 사용하고 웹표준을 준수하려 노력합니다.
• canvas와 SVG 요소를 활용할 수 있으며, 라이브러리 없이 transition이나 Keyframe animation 작업을 할 수 있습니다. (슬라이드 캐러셀, 패럴랙스 스크롤)
• CSS3의 Media Queries, 상대단위 사용, 태그의 srcset 속성을 숙지하고 있으며 반응형 UI를 만들 수 있습니다.
• Flexbox, Grid Layout를 사용해 요소의 배치 및 정렬할 수 있습니다.
• Transitions 및 Animations으로 요소의 상태 변화를 부드럽게 처리하고 애니메이션을 만들 수 있습니다.
• Custom Properties (Variables)로 사용자 정의 변수를 사용하여 CSS에서 값을 재사용하고 관리합니다.

• Hydration을 이해하고 SSR과 SSG를 구현 할 수 있습니다.
• 세그먼트 단위의 URL Path 구조를 이해하고 동적으로 세그먼트 값을 사용하여 라우팅을 할 수 있습니다.

• React hooks을 사용 할 수 있으며 custom hook으로 무한 스크롤 기능을 모듈화해 사용한 경험이 있습니다.
• Redux, Recoil을 이용한 전역 상태를 관리 할 수 있습니다.
• 함수형 컴포넌트에 능숙합니다.

각 프로젝트의 제목을 클릭해 해당 프로젝트의 Readme를 확인 할 수 있습니다 :D

• 비동기 처리로 서버에서 응답 받은 JSON 데이터를 가공
• Intersection Observer API로 무한 스크롤링
• 이미지 로딩 시 스켈레톤 로더 구현
• 뷰포트 너비에 따라 적응형 UI 구현

틴더라이크 이미지 스와이프 프로젝트

lorem picsum와 API 통신하며, 사진이 담긴 카드를 넘기며 좋고 싫음을 나타낼 수 있는 프로젝트입니다.

문서 관계 시각화 프로젝트

개발 학습을 위해 블로깅하는 문서를 네트워크 그래프로 시각화하여 개념을 정리하고 다른 내용과의 연관성을 쉽게 확인 할 수 있는 프로젝트입니다.

웹 개발 중 학습한 내용을 회고하는 내용을 담고 있습니다.

• 각 스니펫 별로 readme.md에 회고를 작성했습니다.
• 단순 코드 업로드가 아닌 학습하고 내 것으로 만드는 것에 중점을 두고 있습니다. :)

• 코어 자바스크립트 도서
• MDN web Docs
• 자바스크립트 기본