Ana 2 platform paling populer saiki kanggo dadi tuan rumah situs web statis: Netlify lan Google App Engine (GAE)

Netlify entuk akeh popularitas bubar amarga menehi pengalaman terintegrasi karo mbangun lan nyebarake situs web statis âÃÂàkabeh ing platform sing padha

GAE luwih fleksibel ing syarat-syarat sing ndhukung situs web non-statis uga nanging mesthi ora nduweni tingkat integrasi sing diwenehake Netlify. Dadi kenapa aku isih nggunakake GAE ing akeh kasus? Jawabane prasaja âÃÂàkerep GAE nyedhiyakake opsi rega sing luwih apik. Ing wektu sing padha, ngidini sampeyan duwe kabeh fitur Netlify lan liya-liyane nggunakake sawetara alat sing prasaja (GitHub Actions lan Reliza Hub) sing bakal dakgambarake ing artikel iki.

 pricing
Ayo kula pisanan nutupi skenario rega nalika GAE + GitHub Actions combo luwih masuk akal. Titik utama yaiku mbangun menit. Tingkat gratis Netlify mung menehi 300 menit mbangun saben wulan, sing ora akeh kanggo akun apa wae. Yen sampeyan nggunakake aplikasi kaya node.js sing digawe statis lan mbangun sampeyan rata-rata 2-3 menit, sampeyan mung entuk udakara 100+ mbangun saben wulan ing Netlify, sing bisa uga ora cukup. Utamane yen sampeyan duwe luwih saka siji situs web

Yen sampeyan mbutuhake menit mbangun luwih akeh ing Netlify âÃÂàmbayar $7 saben 500 menit ekstra, utawa pindhah menyang tingkat sabanjure sing kalebu 1000 menit, nanging biaya $45/sasi. Ing tangan liyane, ing Tindakan GitHub sampeyan entuk 2000 menit mbangun gratis kanggo repositori pribadi lan menit mbangun tanpa watesan kanggo umum. Ngomong sampeyan nggawe situs web dokumentasi lan mutusake kanggo nggawe umum ing GitHub âÃÂàsampeyan entuk menit mbangun tanpa watesan ing GitHub Actions âÃÂàlan sing nggawe prabédan ageng

Wawasan sabanjure yaiku biaya lalu lintas. Netlify nyedhiyakake egress bandwidth 100GB saben wulan kalebu ing tingkat gratis, sing loman. Google nawakake 1GB egress saben dina gratis, sing ndadekake udakara 30GB saben wulan. Dadi yen egress sampeyan ana ing antarane 30GB lan 100GB, sampeyan bisa uga entuk tawaran sing luwih apik ing Netlify. Nanging, yen sampeyan wis ngluwihi 100GB, Netlify ngisi sampeyan $20 kanggo 100GB sabanjure wulan kasebut langsung. Google duwe kabijakan rega saben egress GB sing regane $0.12. Tegese sampeyan mbayar $12/100GB âÃÂàvs $20/100GB ing Netlify

Dadi gumantung saka lalu lintas, sampeyan bisa uga luwih apik ing Netlify utawa ing GAE saka calon egress. Nanging ing akeh kasus GAE uga bakal menehi nilai sing luwih apik ing kene
Tembung pungkasan babagan rega âÃÂàyen sampeyan nggunakake kaya GitHub Actions utawa CircleCI kanggo mbangun sampeyan, sampeyan isih bisa nggunakake Netlify âÃÂàsing ndadekake Sistem GitHub Actions luwih fleksibel

 Konfigurasi Google App Engine Project
Kita miwiti kanthi pindhah menyang httpsconsole.cloud.google.com/appengine lan nggawe proyek anyar. Yen sampeyan wis duwe âÃÂÃÂ, klik dhisik jeneng proyek sampeyan ing sisih ndhuwur banjur klik
**PROYEK ANYAR**

Ketik jeneng proyek, cathet ing kene ID proyek sing sampeyan entuk (sampeyan butuh mengko) âÃÂàing kasusku
*âÃÂÃÂevie-landing-tutorialâÃÂÃÂ* âÃÂàbanjur klik **CREATE Banjur pindhah menyang project iki saka pamilih project ing sisih ndhuwur kaca

Klik ing
** Gawe Aplikasi ** lan pilih wilayah sing dikarepake. Banjur kanggo aplikasi statis pilih lingkungan Python lan Standar (undakan gratis mung ditrapake kanggo lingkungan Standar). Ing wektu iki aplikasi sampeyan wis siyap kanggo langkah sabanjure

Kanggo ngarahake jeneng domain menyang aplikasi iki, navigasi menyang httpsconsole.cloud.google.com/appengine/settings/domains

lan klik
**Tambah domain khusus Tindakake pandhuan lan arahake DNS saka domain sampeyan menyang cathetan sing diwenehake Google. Yen wis rampung, Google bakal kanthi otomatis ngarahake domain sampeyan menyang aplikasi iki lan uga ngatur sertifikat SSL

Pungkasan, kita kudu nyiapake akun layanan sing bakal tanggung jawab kanggo panyebaran otomatis. Navigasi menyang httpsconsole.cloud.google.com/iam-admin/serviceaccounts?project=your_project_id (ganti
*your_project_id *ing link iki karo id project sampeyan sing asli, ing kasusku iki bakal dadi *evie-landing-tutorial Sampeyan bakal entuk kaca menu ing ngisor iki:
Klik ing lambang 3 titik ing kolom Tindakan cedhak akun layanan standar App Engine. Lan pilih
** Nggawe tombol ** pilihan saka menu gulung mudhun

Pilih JSON minangka jinis Kunci lan klik
** Nggawe Iki bakal ndownload file .json menyang mesin sampeyan. Babagan pungkasan sing kudu ditindakake ing kene yaiku ngodhe file iki ing format base64 âÃÂàkita bakal mbutuhake iki mengko nalika pindhah menyang Tindakan GitHub

Iki bisa ditindakake kanthi nggunakake baris perintah kaya ing ngisor iki:
base64 your_json_file.json >key.base64
Banjur file key.base64 bakal duwe kunci sing dienkode base64

** Cathetan keamanan ing kene file kunci json lan base64 iki ngidini sampeyan ngontrol proyek GAE sampeyan, mula sawise sampeyan nambahake menyang Tindakan GitHub (kaya sing bakal daktuduhake ing ngisor iki), disaranake nyuwek. mbusak file iki. Iki bisa ditindakake saka cli kaya ing ngisor iki:
shred key_file_name&& rm key_file_name
Sawise kunci dipikolehi, kita kudu ngaktifake API Google App Engine âÃÂàkanggo nglakoni, bukak kaca httpsconsole.developers.google.com/apis/api/appengine .googleapis.com/overview lan klik
**ANGGAP**

 Nyetel Repositori GitHub lan Tindakan GitHub
Pungkasan, wektune nyiyapake Repositori GitHub. Tutorial iki nyakup persiyapan tema Evie dening Undraw. (Iki minangka tema sing saiki digunakake kanggo kaca kebangkrutan Reliza Hub!) Tema Evie asli di-host ing kene, nanging aku bakal nggunakake garpu Reliza ing repositori iki.

Kaya sing wis dakcritakake ing artikel liyane, filosofi mbangunku saiki yaiku dockerize kabeh lan nggunakake
docker mbangun minangka lingkungan mbangun CI terpadu ing pirang-pirang platform. Mulane, aku nambahake Dockerfile, konfigurasi nginx lan uga nganyari versi npm relatif marang tema Evie asli kanggo nggawe dockerized.

Saiki yen kita nindakake
docker mbangun perintah ing isi repositori Evie Reliza, bakal mbangun gambar berbasis nginx sing nglayani tema Evie tanpa dokumentasi ing port 80

Saiki wayahe nyiapake skrip Tindakan GitHub. Kita bakal nggunakake actions-hub/gcloud@master action sing ndadekake kabeh proses dadi gampang

Kita miwiti kanthi nyetel 2 Rahasia Tindakan GitHub sing dibutuhake dening tumindak kasebut. Navigasi menyang Setelan ->Rahasia ing repositori GitHub lan klik
**Rahasia anyar** kanggo nyetel 2 rahasia ing ngisor iki:
- GCLOUD_PROJECT_ID âÃÂànyetel menyang id proyek sing dicathet nalika sampeyan nggawe proyek sampeyan: evie-landing-tutorial ing kasusku

- GOOGLE_APPLICATION_CREDENTIALS âÃÂànyetel menyang isi file json-kunci sing dienkode base64 sing dipikolehi kanggo akun layanan google ing ndhuwur

Saiki ing gudang aku nggawe .github direktori banjur workflows direktori nang. Lan nang aku nggawe gae_build.yml. Kita uga kudu nambah file app.yaml sing ngemot konfigurasi GAE lan bakal gampang banget kanggo kasus panggunaan aplikasi statis sing aku duwe.

Sawise sampeyan lan push kode iki, bakal micu GitHub Actions mbangun, sing bakal nggawe penyebaran menyang aplikasi GAE âÃÂàlan layanan sampeyan bakal urip! Saben push sakteruse menyang GitHub bakal kanthi otomatis micu mbangun Tindakan GitHub anyar lan nganyari aplikasi kanthi otomatis ing GAE

Saiki sampeyan duwe pipa CICD dhasar kanggo situs web statis sampeyan siap! Sampeyan bisa mandheg ing kene utawa sampeyan bisa nerusake maca carane sampeyan bisa nambah fungsi visibilitas persetujuan lan penyebaran nggunakake Reliza Hub

 BONUS: Nambahake Persetujuan lan Visibilitas Nggunakake Reliza Hub

Upaminipun, kita ora pengin saben bangunan anyar menyang produksi kanthi otomatis.Nanging, kita pengin supaya disebarake dhisik ing endi wae sing dudu produksi, banjur yen kita seneng karo dheweke, sampeyan utawa sing nyetujoni (kandhakake, Manajer Pemasaran sampeyan) butuh. kanggo ngeklik tombol lan promosi menyang produksiMangkene carane bisa digayuh karo Reliza Hub ing ndhuwur konfigurasi sing dakkandhakake nganti saiki1 à ¢ÃÂàMetadata Rilis Streaming menyang Reliza HubPisanan, navigasi menyang httpsapp.relizahub.com, otentikasi karo GitHub lan gawe organisasi sampeyan, yen aku bakal nggunakake*âÃÂÃÂEvie Landing TutorialâÃÂÃÂ* minangka jeneng organisasi.Klik ing item menu **VCS** banjur ing lambang plus-bunder kanggo nambah Repositori VCSTempel URI repositori GitHub ing input lan Reliza Hub bakal parse kanthi otomatisKlik**Kirim lan iki bakal nggawe gudang sampeyan.Nerusake menyang menu Projects banjur klik lambang plus-bunder kanggo nggawe proyek.Ketik jeneng proyek sampeyan (Aku bakal nggunakake *Skema versi Evie Landing Set menyang Komponen Tunggal (Major) âÃÂàamarga GAE nggunakake versi dhewe sing dumadi saka siji komponen âÃÂàsing bakal digunakake ing Reliza Hub kaya saiki.Pilih repositori VCS dadi sing wis digawe ing langkah sadurungeLan klik**Kirim Iki bakal nggawe proyek anyar.Banjur klik jeneng proyek sing mentas digawe iki banjur klik lambang kunci kanggo ngasilake kunci api proyekYen sampeyan ndeleng API ID lan API Key digawe kanggo proyek sampeyan, gawe 2 rahasia anyar ing GitHub Actions âÃÂàRELIZA_API_PROJECT_ID lan RELIZA_API_PROJECT_KEY kanthi nilai sing cocogSaiki , iki wektu kanggo nganyari script gae_build.yml kita kanggo stream rincian mbangun kanggo Reliza lan uga ngalih menyang mode ora promosi.Iki tegese ing saben git push, penyebaran bakal digawe ing GAE, nanging Google bakal ora ngalih lalu lintas menyang penyebaran anyar iki nganti sawetara langkah manual pungkasan rSkrip sing dianyari kalebu nglaporake pelacakan wektu mbangun menyang Reliza Hub lan uga bakal duwe URI saben panyebaran sing ora dipromosikan ing GAE.Sampeyan bisa nemokake katrangan saka macem-macem gendera sing digunakake ing repositori GitHub saka Reliza Go ClientSawise Tindakan GitHub mbukak ing push rampung, sampeyan bisa navigasi menyang kaca saka release sampeyan ing Reliza Hub lan deleng gambar ing ngisor iki:Elinga yen ngeklik link #**Test endpoint** bakal nggawa sampeyan menyang versi penyebaran nyata ing GAE sing cocog karo entri kode sumber iki âÃÂànanging durung dipromosekake kanggo nglayani lalu lintasSampeyan uga bisa nambah integrasi slack ngetutake pandhuan ing kene kanggo nampa kabar saben rilis anyar ing Reliza Hub2 âÃÂàNambahake PersetujuanPindhah menyang kaca Setelan Reliza Hub lan ing sisih ngisor konfigurasi matriks persetujuan sampeyan kanggo lingkungan PRODUKSI.Ing kasusku, aku mung mbutuhake persetujuan saka MARKETING kanggo rilis supaya bisa dipromosekake dadi produksi.Kaya ing ngisor iki:Klik**Simpen Matriks**Sabanjure aku nginstal aplikasi Reliza GitHub à¢ÃÂàhttpsgithub.com/apps/reliza-hub âÃÂàlan tindakake tutorial sing wis ditulis sadurunge ndhaptar proyek kasebutPungkasan, alur kerja GitHub Actions anyar sing bakal dipicu ing persetujuan saka Reliza Hub âÃÂàsampeyan bisa ndeleng ing kene.Intine, alur kerja iki takon Reliza Hub kanggo versi paling anyar sing disetujoni produksi banjur njaluk Google App Engine kanggo ngalih lalu lintas menyang versi kasebutSiji-sijine sing mbutuhake konfigurasi ing iki skrip yaiku variabel lingkungan RELIZA_PROJECT_ID âÃÂàsing kudu disetel kanggo proyek UUID sing dipikolehi ing kaca proyek ing Reliza Hub:Saiki, rilis proyek paling anyar karo persetujuan saka MARKETING bakal otomatis munggah pangkat ing sisih Google App EngineKanggo rincian, carane sampeyan bisa nambah approvers kanggo organisasi, nonton video tutorial babagan persetujuan   3 âÃÂàTambah Visibilitas kanggo Apa sing Dipasang Nalika Pungkasan, kita pengin nambah visibilitas ing Reliza Hub babagan rilis apa sing ditrapake lan kapan  Kanggo nindakake iki, pindhah menyang Instances ing Reliza Hub lan klik lambang plus-bunder kanggo nggawe conto anyar  Aku banjur ngetik URI saka conto lan pilih lingkungan dadi PRODUKSI âÃÂàamarga aku mung duwe lingkungan produksi ing situs web statis iki. Ngeklik **Kirim** nggawe conto anyarku  Sabanjure aku milih conto sing mentas digawe iki lan klik ing lambang kunci kanggo generate tombol api sawijining  Nalika ID API lan Kunci API digawe, gawe 2 rahasia anyar ing Tindakan GitHub âÃÂàRELIZA_API_INSTANCE_ID lan RELIZA_API_INSTANCE_KEY kanthi nilai sing cocog  Kanthi iki, aku nganyari skrip penyebaran sing disetujoni kanggo nambah bagean kanggo mriksa penyebaran ing GAE lan stream menyang Reliza Hub. Lan aku uga nambah alur kerja cron GitHub Actions kanggo verifikasi status aplikasi GAE  Sawise alur kerja iki mlaku, kita bakal entuk snapshot penyebaran aplikasi GAE ing Reliza Hub ing tampilan conto kaya ing ngisor iki:   Ringkesan Iki, saiki kita duwe pipeline CI CD tombol push lengkap karo Tindakan GitHub sing disebarake menyang GAE lan persetujuan lan visibilitas sing dikelola dening Reliza Hub. Kita uga bisa duwe kabar Slack lan manajer Pemasaran ndeleng owah-owahan lan meksa tombol kanggo promosi menyang produksi tanpa takon staf teknis. Carane kelangan iku?
Yen sampeyan pengin ngobrol karo aku lan ngrembug babagan iki utawa alur kerja liyane âÃÂàpesen telpon demo Reliza Hub 30 menit tanpa strings karo aku àlan aku bakal nyoba kanggo mbantu.