Heroku에 DApp 배포: 파트(4/4)

튜토리얼의 이 부분에서는 이전 섹션에서 빌드한 반응 앱을 배포할 것입니다.

This project is hosted here.
Link to Github Repo of the project here. This will serve as a reference for you, if at some point you are not able to follow the tutorial.

이 자습서에서는 github에 저장소가 있어야 합니다. 아직 수행하지 않은 경우 다음instructions을 수행하십시오.

Heroku에 가입하고 새 앱을 만듭니다.

Heroku로 이동하여 회원가입을 합니다.

새 앱 만들기

고유한 이름을 지정하고 지역을 선택합니다.

빌드팩 추가

빌드팩은 앱이 배포될 때 실행되는 스크립트입니다. 앱에 대한 종속성을 설치하고 환경을 구성하는 데 사용됩니다.

앱 설정으로 이동합니다.



여기서 우리는 두 개의 빌드팩을 추가해야 합니다. 하나는 우리가 호스트하려는 프로젝트frontend가 프로젝트의 하위 디렉토리이기 때문이고 두 번째는 heroku에 반응용 공식 빌드팩이 없기 때문입니다.

아래로 스크롤하여 빌드팩 추가를 클릭하고 추가하십시오.

https://github.com/timanovsky/subdir-heroku-buildpack.git

https://github.com/mars/create-react-app-buildpack.git

위와 같이 순서가 올바른지 확인하십시오.

구성 변수 설정

Config Vars 섹션으로 이동하여 PROJECT_PATH: frontend 및 REACT_APP_ALCHEMY_KEY: <YOUR_ALCHEMY_KEY> 두 변수를 설정합니다.

배포

이제 배포 탭으로 이동합니다. 여기에는 세 가지 배포 방법이 있습니다. 우리는 GitHub 방법을 사용할 것입니다. 그것을 클릭하면 github 계정에 연결하라는 메시지가 표시됩니다.



이제 github repo를 검색하고 연결을 클릭합니다.



브랜치 및 Enable Automatic Deploys를 선택하면 배포된 브랜치에 새 변경 사항을 푸시할 때 지속적 통합이 활성화됩니다.

그런 다음 Deploy Branch를 클릭하면 완료됩니다. 이제 프로젝트를 heroku에 성공적으로 배포했습니다. 프로젝트를 보려면 상단의 open app를 클릭하십시오.

이 튜토리얼 시리즈가 상황을 조금 더 잘 이해하는 데 도움이 되었기를 바라며 읽어 주셔서 감사합니다.