Netlify 및 DigitalOcean을 사용하여 Rails API를 사용하여 React 사이트 배포에 대한 몇 가지 참고 사항

Flatiron School에서 시간을 마친 후, 저는 제가 만든 앱 중 일부를 배포하고 싶었고 결국 #devops와 앱 배포에 대한 어려운 교훈을 배웠습니다.

DigitalOcean을 사용하여 백엔드를 호스팅하면 한 서버에서 많은 개인 프로젝트를 호스팅할 수 있고 Heroku 스핀업 지연을 한 달에 5달러에 피할 수 있고 트래픽이 발생하기 시작하면 쉽게 확장할 수 있기 때문에 훌륭합니다. If you don't have an account, feel free to use my referral link and you'll get $100 in credit .

프론트엔드와 백엔드 서버를 분리하는 데에는 단점이 있습니다. 나에게 가장 큰 것은 localhost:3000 실제 URL을 사용하지 않고 사용하지 않기 때문에 로컬 개발에 약간의 불편이 있다는 것입니다. 결국, 그것은 그것을하는 최악의 방법이 아닙니다.

나는 당신이 이미 사용할 준비가 된 도메인을 소유하고 있다고 가정할 것입니다. Namecheap을 사용하고 싶지만 원하는 사이트를 사용할 수 있습니다.

리액트 시작하기

Netlify을 시작하는 것은 솔직히 매우 매끄럽습니다. 계정을 만들고 github을 연결하면 React 앱을 매우 빠르게 푸시할 수 있습니다. 메인 도메인 SSL 인증서도 관리합니다. 프론트 엔드를 배포할 때 2가지 작업이 필요하다는 것을 알았습니다. 부모 디렉터리에 netlify.toml 파일을 만들고 그 안에 다음을 넣어야 했습니다.

[build]
  command = "CI= npm run build"
  publish="build"

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

[build]는 React 경고가 표시되는 동안 코드가 푸시될 수 있도록 설정합니다(정말 이것이 앱에 좋은 아이디어인지 확인하십시오). [redirects]는 React Router를 사용하는 경우에 사용되는 것입니다. 계정에 도메인을 추가하고 도메인이 Netlify 네임서버를 가리키도록 하십시오. 도메인 패널 내부에서 백엔드를 가리키도록 하위 도메인을 추가로 설정할 수 있습니다.

레일즈로 이동

솔직히, 대부분this guide is almost perfect - 그리고 - 비디오가 있으므로 원하는 경우 따라할 수 있습니다. 그들은 당신의 물방울을 만들고 필요한 모든 것을 하는 과정을 안내합니다. 드롭릿에 미리 로드된 SSH 키를 사용하는 경우 ssh-copy-id 명령을 실행하기 전에 몇 가지 변경 작업을 수행해야 합니다.

이 명령으로 구성 파일을 편집하십시오.sudo nano /etc/ssh/sshd_config
이 줄을 'no'에서 'yes'로 변경한 다음 저장하고 종료합니다.PasswordAuthentication no
그런 다음 데몬을 다시 시작하고 ssh-copy-id 부분을 계속하십시오.sudo systemctl restart sshd그렇게 하면 다시 돌아와서 PasswordAuthentication를 no로 변경하고 싶을 것입니다.

레일스 API 변경 사항

Rails를 API 전용 앱으로 사용하는 경우 Capfile을 조정해야 합니다. 이 줄을 주석 처리하고 다른 2줄을 추가합니다.

# require 'capistrano/rails'

require 'capistrano/bundler'
require 'capistrano/rails/migrations'