S32 aws S3, CloudFront, Route53 연동하기 자체 개발한 플랫폼을 실제 도메인과 서버와 연결하기 위해 S3를 처음 사용해 보았다. 대략적 흐름은 이렇다. - 로컬에서 파일 build (npm build / yarn build) - 생성된 build 폴더 안의 파일들을 S3에 업로드 -> cloudfront 연동 -> Route 53 연동 s3와 cloudFront Route 53에서 기본 설정값에서 변경사항 위주로 기록하였다. 1. S3 생성하기 ACL 활성화: 객체 라이터로 변경. 퍼블렉 엑세스 차단 비활성화. 이 버킷과 그 안에 포함된 객체가 퍼블릭 상태가 될 수 있음을 알고 있습니다 체크. 여기는 수정할게 없으니 버킷 만들기 클릭 로컬에서 build한 파일들을 드래그 앤 드롭 이제 할 일은 버킷에 퍼블릭 권한을 활성화 해주어야 한다. 모든 버.. 2023. 4. 5. 운영서버에 SEO 구현이 안되던 이슈 (react-snap) 1. 이슈 상황 작년 연말에 회사에서 소규모 웹사이트 하나를 만들었는데 CSR로 구현된 React 페이지에서 SEO를 적용하기 위해 react-snap 라이브러리를 사용했었다. 그런데 확인해보니 개발서버에서는 SSR 환경의 파일을 소스보기한 것처럼 동일하게 구현되지만 운영서버에서는 SEO를 구현하기 이전과 같이 아무것도 보이지 않는 이슈가 발생했다. production과 develop의 yml파일이나 package.json도 동일하게 구성되었는데 운영서버에만 나타나지 않았다. 확인 결과 S3에 올라간 build파일을 비교해보니 index.html의 크기가 달랐다. 개발서버의 index.html은 페이지별 내용이 생성되어있고, 운영서버의 index.html은 기존처럼 빈 파일이 올라가 있었던 것! 2. 발.. 2022. 4. 8. 이전 1 다음