본문 바로가기
카테고리 없음

[클론코딩] business-card

by 찬찬2 2022. 8. 5.

작업 완료 후 오류 사항

1. 깃허브에 배포시 react-router 버전 충돌로 인해 BrowserRouter 안에 Route eleme={ 컴포넌트 } 가 그려지지 못하는 상황

이유1: 깃허브로 배포시 메인 도메인 주소는 "https://github.com/blackstarzck/business-card" 인데, "business-card" 리포지토리명이 뒤에 붙으면서 Route path="/" 와 매칭되지 못했기 때문이다.즉, Route의 path "/"는 메인 도메인 "https://github.com/blackstarzck"을 바라보고 있었기 때문이다.

해결: BrowserRouter의 속성으로 basename={ process.env.PUBLIC_URL } 넣는다.

 

2. 착각한 부분: 일반적인 html 파일을 깃허브에 배포하고 html, css, js 를 수정후 푸시한 경우 자동으로 반영되어 배포되었다. 하지만 react는 다르다. 아무래도 create-react-app이라는 boiler-plate를 사용했기 때문에 수정사항이 build되지 않은 상태였기 때문인 것 같다.

그러므로 create-react-app과 같이 소스를 bundling해주는 boiler-plate를 사용할 경우 반드시 실행명령어를 사용해야 한다. 그리고 깃허브에는 나의 작업물(컴포넌트, 이미지 등 뷰와 관련된 요소)을 저장시키는 것으로 간단하게만 이해하면 될 것 같다.

 

3. 파이어베이스 관련: 파이어베이스를 통해 간편 로그인을 구현하였다. 이때 Authentication 에 깃허브 도메인주소를 허용주소로써 등록해주어야 한다. 경로: Authentication → settings  도메인 

 

댓글