Potatizer를 DigitalOcean에 배포

이번 포스팅에서는 우리 작은 포타타이저를 온라인에서 볼 수 있는 마지막 단계를 알려드립니다 😍

DigitalOcean 앱 플랫폼에 배포

앱 플랫폼을 사용하면 프로젝트를 업로드하는 것이 식은 죽 먹기였습니다.
GitHub에 등록한 다음 App Platform에 연결한 후 두 번의 클릭으로 웹을 라이브로 만들었습니다!



우리가 고려해야 할 유일한 사항은 다음과 같습니다.

귀하의 웹사이트에 적합한 서비스와 렌더링 방법을 선택하십시오. 내 경우: 정적 사이트.

변경 시 자동 배포를 실행할 분기를 선택합니다(CD: 연속 배포).

프로젝트를 빌드할 명령을 선택합니다: yarn generate .

환경 변수가 있는 경우 키-값 쌍 입력에 수동으로 추가하십시오.

프로세스를 통과하면 배포를 누르고 잊어버릴 수 있습니다 💜

여기에서 라이브 결과를 볼 수 있습니다 - 🎇 Potatizer live demo deployed 🎇

배포 버튼(확장)

저를 DigitalOcean 🤯에 미치게 만든 한 가지는 다른 사람이 자신의 환경에 내 프로젝트를 배포할 수 있는 버튼을 구현한다는 아이디어였습니다!



다음 '사양'을 사용하여 내 프로젝트의 루트에 있는 .do라는 폴더에 deploy.template.yaml 파일을 추가하는 환상입니다.

spec:
  name: cd
  # Service type: Static sites
  static_sites:
    - environment_slug: html
      # Nuxt generate to build our project
      build_command: yarn generate
      git:
        # CD branch and url to the code
        branch: main
        repo_clone_url: https://github.com/Dawntraoz/potatizer.git
      name: potatizer

실행하려면 코드DigitalOcean provide를 사용하여 웹(html) 또는 readme(markdown)에 추가하면 됩니다.

[![Deploy to DigitalOcean](https://mp-assets1.sfo2.digitaloceanspaces.com/deploy-to-do/do-btn-blue.svg)](https://cloud.digitalocean.com/apps/new?repo=<repo_url>/tree/<branch>)

repo_url github repo 링크(제 경우에는 https://github.com/Dawntraoz/potatizer)이고 선택한 브랜치(main)입니다.

저장소

코드를 살펴보고 싶다면 여기 리포지토리가 있습니다.

돈트라오즈 / 포타타이저

센스 앱 없이 이것으로 랜덤으로 감자 기분을 만들어보세요 🥔

여행이 마음에 드셨기를 바라며 포테이터 몇 명이 함께 웃었기를 바랍니다 🥔

이 어리석은 아이디어를 저와 공유해 주셔서 감사합니다. 당신을 만나서 반가워요 🤗