프로젝트
1.[TypeScript/Keupang] Vite를 이용한 React.ts E-Commerce 프로젝트 시작하기
✅Keupang Github E-Commerce 프로젝트를 선택하게 된 이유는 내가 적용하고 싶은 기술을 적용할 수 있는 주제이기 때문이다.앞으로 내가 다룰 기술들을 하나하나 포스팅할 생각이고, 이에 대한 이슈가 되는 부분 그리고 해결까지 업로드를 할 것이다.개발과정에
2.[TypeScript/Keupang] #2 Emotion의 ThemeProvider를 활용한 다크모드 구현
✅Keupang Github이번 포스팅은 Emotion을 이용한 다크모드 구현 및 구현을 위한 디자인 세팅 작업이 주가 될 예정이다. 폰트는 Noto-Sans와 Pretendard를 고민하다가 Pretendard로 선정했다.폰트 적용은 index.html에 폰트 관련
3.[TypeScript/Keupang] #3 MSW 라이브러리를 활용한 Mock API 구현
개요 ✅Keupang Github 이번 포스팅에선 Mock API, MSW가 무엇인지, 현재 프로젝트에선 어떤 Mock 방식이 어울리는지, Mock API를 사용하기 위한 MSW 세팅 과정에 대해 포스팅 하려 한다. &nbs
4.[TypeScript/Keupang] #4 공통 컴포넌트 Button 구현
✅Keupang Github이제 본격적인 컴포넌트 개발을 진행한다.포스팅은 Button 하나만 할 생각이지만, 여기서 다룬 생각들을 기반으로 여러 컴포넌트들을 구성할 생각이다. 개발을 진행하다보면 반복적으로 사용되는 컴포넌트들이 많다.이 외에도 여러 공통 컴포넌트
5.[TypeScript/Keupang] #5 Barrel File을 활용한 Router 생성하기
개요 ✅Keupang Github 이제 각 페이지로 이동하는 Router를 생성하고, 이 페이지 파일들을 관리할 Barrel File에 대해 알아보고 '이 기술을 현 프로젝트에 적용하는게 맞는가?' 에 대한 고민을 하려고 한다. 본격적인 페이지 개발 전, 마지막 세
6.[TypeScript/Keupang] #6 Header 컴포넌트 제작하기
✅Keupang Github이제 본격적으로 UI제작을 시작한다.일단 모든 페이지에서 보일 헤더 컴포넌트 제작을 하려고 한다.고려해야할 점은 다음과 같다.네비게이션바가 포함된다.카테고리와 마이페이지는 드랍다운이다.반응형이어야 한다.테마에 반응하여야 한다.각 카테고리 클릭
7.[TypeScript/Keupang] #7 AWS s3를 활용한 CI/CD 및 Github Actions를 통한 자동 배포 파이프라인/ Slack 연동으로 배포 상태 실시간 모니터링
개요 ✅Keupang Github ✅Keupang 배포 주소로 이동 배포주소 www.keupang.store로 배포에 성공했다. AWS의 S3를 활용하여 배포했고, SSL인증서 발급 후 https 까지 적용하는 것에 성공하였다. 나도 처음 해보는 작업이어서 성공
8.[TypeScript/Keupang] #8 회원가입 Form Component 제작
개요 ✅Keupang Github ✅Keupang 배포 주소로 이동 회원가입 페이지를 제작했다. 개발한 기능은 기본적인 회원가입 Form을 제외하면 아래와 같다. >1. 이메일 유효성을 검사하여 이메일이 확인될 시 "이메일 확인"버튼을 활성화 한다. MSW를 이