sjindev 님의 블로그

- 문제 배경Vercel + React Router (CSR- Client Side Rendering) 환경에서 Vercel 로 배포한 "https://프로젝트명.vercel.app/" 배포주소에서 발생하는 오류가 하나 있다. 프로젝트를 하며 작성하는 Router.tsx 파일의 path가 localhost 에서는 잘 작동하지만 배포도메인에서는 맨 뒤에 path를 입력했을 때 404 not found 오류가 발생한다. - 문제 요약"https://프로젝트명.vercel.app/" : 해당 URL 접속은 잘 됨!"https://프로젝트명.vercel.app/signin" : 이처럼 서브 라우트로 직접 접근하면 404 Not Found 발생하는 문제.- 원인: CSR(클라이언트 사이드 라우팅)과 정적 호스팅의..

오늘은 vercel 로 배포및 CI/CD 파이프라인 구축을 통해 프론트엔드 개발환경을 세팅해볼 예정입니다. 위 블로그를 작성할때 기준 저의 프로젝트 개발환경 세팅은 pnpm + react + typescript + tailwind 입니다. 또한, 저의 경우 깃허브 레포지토리로 미리 위 세팅에 대해 template 레포지토리가 있기 때문에 레포는 미리 만들어두고 시작했습니다. 1. github에 있는 repository clone 1. vscode 로컬 환경에 워크스페이스 폴더를 등록합니다.2. 해당 워크스페이스 폴더로 터미널 경로를 맞춰줍니다.3. git clone [레포주소]4. pnpm install : 의존성 설치 작업 진행.(저는 기존 템플릿 레포지토리를 클론받은거라 의존성 설치를 해주었습니다..