이 프로젝트의 동기는 React, TypeScript, Next.js를 학습하고 커뮤니티 페이지를 구축하여 프론트엔드와 백엔드 개발 경험을 얻으려는 것이었습니다. AWS를 활용한 서버 배포 및 데이터베이스 사용법을 배우고, 전체적인 개발 과정과 다양한 기술을 습득하고자 했습니다. 프로젝트를 통해 웹 애플리케이션 개발과 배포, Express.js와 PostgreSQL을 이용한 백엔드 개발, Docker를 활용한 컨테이너화와 배포 등을 경험하며 문제 해결과 학습 능력을 향상시켰습니다.

React를 학습하고 실전 경험하기 위해 시작한 프로젝트입니다. 윈도우98의 고전적인 컨셉을 적용한 웹 페이지를 만들었고, 폴더를 클릭하면 내용이 열리는 이벤트와 페이지 라우팅을 구현했습니다. React의 기본 개념과 컴포넌트 기반 개발, Redux로 상태 관리, React Router로 페이지 라우팅을 배웠습니다. 사용자들에게 향수와 창의성을 자극하는 과거의 인터페이스를 제공하고, 직관적인 경험을 위해 폴더를 클릭하면 내용이 전체화면으로 열리도록 구현했습니다.

이 프로젝트의 동기는 React와 Firebase를 활용한 실시간 동기화 데이터베이스 구축에 대한 흥미와 학습 욕구였습니다. Firebase를 사용하여 실시간 데이터 동기화와 회원가입을 구현하고, React-Hook-Form으로 유효성 체크, Redux로 상태 업데이트, 부트스트랩으로 스타일링을 했습니다. 프로젝트에서는 아키텍처와 문제 해결 능력을 향상시켰습니다.

메이필드 호텔 홈페이지 클론코딩 프로젝트를 SCSS 학습과 반응형 웹 개발에 흥미를 느껴 시작했습니다. SCSS의 기능을 배우고 실전에서 적용해보기 위해 프로젝트를 진행했고, 반응형 웹 개발의 중요성을 이해하고 호텔 홈페이지의 문제를 개선하고자 했습니다. SCSS의 기본 문법과 활용 방법을 배우며 코드 구조화와 모듈화의 장점을 경험했습니다. 미디어 쿼리와 뷰포트 설정 등을 학습하여 다양한 디바이스에 맞는 UI와 레이아웃을 구현하는 방법을 익혔습니다. 프로젝트의 특징은 SCSS와 반응형 웹 개발을 적용한 점입니다.

영화추천 페이지 프로젝트는 yts 영화 API를 활용한 React 기반 반응형 페이지입니다. API 호출, 페이지 이동, 상태 관리, 스타일링 등 다양한 기술을 적용하여 실전 경험을 쌓았습니다. Axios로 API 호출, React Router로 페이지 이동, Redux와 Context로 상태 관리, 스타일 컴포넌트로 컴포넌트 스타일링을 구현했습니다. 특징은 동적으로 영화 목록을 가져오는 API 호출, Redux와 Context를 활용한 상태 관리, 반응형 웹 구현, 스타일 컴포넌트로 스타일링과 재사용성을 갖췄습니다.