일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- multer-s3
- package.json
- touch event
- qoddi
- node.js
- aws-sdk
- npm-check-updates
- dependencies
- fly.io
- Next.js
- s3
- php
- 반응형
- 클린코드
- naver api
- dependabot
- Web Storage
- react18
- createRoot
- CSS
- bucket
- react
- .eslintrc
- hooks
- 배포
- gh-pages
- GitHub
- heroku
- AWS
- Github Pages
- Today
- Total
목록Github Pages (2)
Ann's log

😱 문제 GitHub Pages로 배포한 React 페이지에서 새로고침을 하면 404 에러가 뜬다는 것을 발견했다. Homepage에서는 새로고침해도 아무런 문제가 없는데, 서브 디렉토리로 이동하고 새로고침을 하면 문제가 발생한다.. 이유를 찾아보니 깃허브 페이지는 SPA(Single Page Applications)를 인식하지 못하는 문제가 있다고 한다! SPA는 일반적으로 웹 브라우저에서 액세스 할 수 있는 하나의 index.html 파일만 사용하기 때문에, Github Pages로 배포를 하게 되면 homepage url 하나만 인식하게 된다. 그래서 hompage url 뒤에 경로가 더 붙으면 그 경로에서 해당 페이지의 파일을 찾으려 하기 때문에 에러가 발생하게 된다. 😄 해결 방법 구글에 검색해..

React 프로젝트는 Github Pages로 배포할 때 추가적으로 해줘야 하는 것들이 있어서 그 과정을 기록해 두려고 한다. (내가 만든 React 프로젝트는 Create React App과 React Router를 사용하였다.) 이 글에서 정리하는 내용: 1. React 프로젝트 배포하기 전에 해야할 것 2. React 프로젝트 build 하고 배포하기 2-1) gh-pages 패키지를 사용하지 않는 방법 2-2) gh-pages 패키지를 사용하는 방법 3. 배포 확인하기 1. React 프로젝트 배포하기 전에 해야할 것 ① 배포하고자 하는 프로젝트 repository가 public으로 되어 있는지 확인 한다. ② 리액트 프로젝트 폴더 안의 package.json 파일에 다음을 추가 해줘야 한다. "..