Aplikasi modern ing OpenShift, bagean 3: OpenShift minangka lingkungan pangembangan lan OpenShift Pipelines

Hello everyone ing blog iki! Iki minangka kiriman kaping telu ing seri sing nuduhake cara masang aplikasi web modern ing Red Hat OpenShift.

Aplikasi modern ing OpenShift, bagean 3: OpenShift minangka lingkungan pangembangan lan OpenShift Pipelines

Ing rong kiriman sadurunge, kita nuduhake carane nyebarake aplikasi web modern mung sawetara langkah lan carane nggunakake gambar S2I anyar bebarengan karo gambar server HTTP sing ora ana ing rak, kayata NGINX, nggunakake bangunan sing dirantai kanggo ngatur penyebaran produksi. .

Dina iki kita bakal nuduhake carane mbukak server pangembangan kanggo aplikasi sampeyan ing platform OpenShift lan nyinkronake karo sistem file lokal, lan uga ngomong babagan apa OpenShift Pipelines lan carane bisa digunakake minangka alternatif kanggo majelis sing disambung.

OpenShift minangka lingkungan pangembangan

Alur kerja pangembangan

Kaya sing wis kasebut ing kirim pisanan, proses pangembangan khas kanggo aplikasi web modern mung sawetara jenis "server pangembangan" sing nglacak owah-owahan menyang file lokal. Nalika kedadeyan kasebut, mbangun aplikasi bakal dipicu banjur dianyari menyang browser.

Ing kerangka kerja modern, "server pangembangan" kasebut dibangun ing alat baris perintah sing cocog.

Tuladha lokal

Pisanan, ayo ndeleng cara kerjane nalika mbukak aplikasi sacara lokal. Ayo dadi conto aplikasi kasebut nanggepi saka artikel sadurunge, sanajan konsep alur kerja sing meh padha ditrapake ing kabeh kerangka modern liyane.
Dadi, kanggo miwiti "server dev" ing conto React, kita bakal ngetik perintah ing ngisor iki:

$ npm run start

Banjur ing jendhela terminal kita bakal weruh kaya iki:

Aplikasi modern ing OpenShift, bagean 3: OpenShift minangka lingkungan pangembangan lan OpenShift Pipelines

Lan aplikasi kita bakal mbukak ing browser gawan:

Aplikasi modern ing OpenShift, bagean 3: OpenShift minangka lingkungan pangembangan lan OpenShift Pipelines

Saiki, yen kita nggawe owahan ing file, aplikasi kudu nganyari ing browser.

OK, kabeh wis jelas karo pangembangan ing mode lokal, nanging kepiye carane entuk sing padha ing OpenShift?

Server pangembangan ing OpenShift

Yen sampeyan ngelingi, ing kirim sadurunge, kita katon ing supaya disebut-run phase saka gambar S2I lan weruh sing standar, modul ngawula tanggung jawab kanggo layanan aplikasi web kita.

Nanging, yen sampeyan ndeleng kanthi cetha mbukak script saka conto sing, ngandhut $ NPM_RUN variabel lingkungan, sing ngijini sampeyan kanggo nglakokaké printah Panjenengan.

Contone, kita bisa nggunakake modul nodeshift kanggo masang aplikasi kita:

$ npx nodeshift --deploy.env NPM_RUN="yarn start" --dockerImage=nodeshift/ubi8-s2i-web-app

Cathetan: Conto ing ndhuwur dicekak kanggo nggambarake gagasan umum.

Ing kene kita wis nambahake variabel lingkungan NPM_RUN menyang penyebaran kita, sing ngandhani runtime kanggo mbukak printah wiwitan benang, sing miwiti server pangembangan React ing pod OpenShift.

Yen sampeyan ndeleng log pod sing mlaku, bakal katon kaya iki:

Aplikasi modern ing OpenShift, bagean 3: OpenShift minangka lingkungan pangembangan lan OpenShift Pipelines

Mesthi wae, kabeh iki bakal dadi apa-apa nganti kita bisa nyinkronake kode lokal karo kode kasebut, sing uga dipantau kanggo owah-owahan, nanging urip ing server remot.

Sinkronisasi kode remot lan lokal

Begjanipun, nodeshift bisa gampang bantuan karo sinkronisasi, lan sampeyan bisa nggunakake printah watch kanggo trek owah-owahan.

Dadi sawise kita wis mbukak printah kanggo masang server pangembangan kanggo aplikasi kita, kita bisa aman nggunakake printah ing ngisor iki:

$ npx nodeshift watch

Akibaté, sambungan bakal digawe menyang pod mlaku sing digawe sethitik sadurungé, sinkronisasi file lokal kita karo kluster remot bakal diaktifake, lan file ing sistem lokal kita bakal mulai dipantau kanggo owah-owahan.

Mulane, yen saiki kita nganyari file src/App.js, sistem bakal nanggepi owah-owahan kasebut, nyalin menyang cluster remot lan miwiti server pangembangan, sing banjur bakal nganyari aplikasi kita ing browser.

Kanggo ngrampungake gambar kasebut, ayo tuduhake kaya apa kabeh perintah kasebut:

$ npx nodeshift --strictSSL=false --dockerImage=nodeshift/ubi8-s2i-web-app --build.env YARN_ENABLED=true --expose --deploy.env NPM_RUN="yarn start" --deploy.port 3000

$ npx nodeshift watch --strictSSL=false

Printah watch minangka abstraksi ing ndhuwur printah oc rsync, sampeyan bisa mangerteni sing luwih lengkap babagan cara kerjane kene.

Iki minangka conto kanggo React, nanging cara sing padha bisa digunakake karo kerangka kerja liyane, mung nyetel variabel lingkungan NPM_RUN yen perlu.

Pipa Openhift

Aplikasi modern ing OpenShift, bagean 3: OpenShift minangka lingkungan pangembangan lan OpenShift Pipelines

Sabanjure kita bakal ngomong babagan alat kaya OpenShift Pipelines lan carane bisa digunakake minangka alternatif kanggo mbangun chained.

Apa sing OpenShift Pipelines

OpenShift Pipelines minangka sistem integrasi lan pangiriman terus CI/CD asli awan sing dirancang kanggo ngatur pipa nggunakake Tekton. Tekton minangka kerangka CI/CD asli Kubernetes-sumber terbuka fleksibel sing ngidini sampeyan ngotomatisasi penyebaran ing macem-macem platform (Kubernetes, tanpa server, mesin virtual, lsp) kanthi abstrak saka lapisan dhasar.

Ngerteni artikel iki mbutuhake sawetara kawruh babagan Pipelines, mula disaranake sampeyan maca dhisik buku teks resmi.

Nyetel lingkungan kerja sampeyan

Kanggo muter conto ing artikel iki, sampeyan kudu nyiapake lingkungan kerja sampeyan:

  1. Instal lan konfigurasi kluster OpenShift 4. Conto kita nggunakake CodeReady Containers (CRD) kanggo iki, instruksi instalasi sing bisa ditemokake kene.
  2. Sawise kluster siap, sampeyan kudu nginstal Pipeline Operator ing. Aja wedi, gampang, instruksi instalasi kene.
  3. download Tekton CLI (tkn) kene.
  4. Jalanake alat baris perintah create-react-app kanggo nggawe aplikasi sing banjur bakal disebarake (iki minangka aplikasi sing gampang nanggepi).
  5. (Opsional) Kloning repositori kanggo mbukak conto aplikasi sacara lokal kanthi nginstal npm banjur miwiti npm.

Repositori aplikasi uga bakal duwe folder k8s, sing bakal ngemot YAML Kubernetes/OpenShift sing digunakake kanggo nyebarake aplikasi kasebut. Bakal ana Tugas, ClusterTasks, Sumber Daya lan Pipa sing bakal kita gawe repositori.

Ayo dadi miwiti

Langkah pisanan kanggo conto yaiku nggawe proyek anyar ing kluster OpenShift. Ayo nelpon proyek webapp-pipeline iki lan gawe nganggo printah ing ngisor iki:

$ oc new-project webapp-pipeline

Jeneng proyek iki bakal katon ing kode mengko, dadi yen sampeyan arep menehi jeneng liyane, aja lali ngowahi kode contone. Miwiti saka titik iki, kita ora bakal pindhah ndhuwur-mudhun, nanging ngisor-up: sing, pisanan kita bakal nggawe kabeh komponen saka conveyor, lan mung conveyor dhewe.

Dadi, pisanan kabeh ...

tugas

Ayo nggawe sawetara tugas, sing banjur bakal mbantu nyebarake aplikasi kasebut ing saluran pipa. Tugas pisanan - apply_manifests_task - tanggung jawab kanggo aplikasi YAML saka sumber daya Kubernetes (layanan, penyebaran lan rute) sing ana ing folder k8s aplikasi kita. Tugas kapindho - update_deployment_task - tanggung jawab kanggo nganyari gambar sing wis disebarake menyang sing digawe dening pipa kita.

Aja kuwatir yen durung jelas. Ing kasunyatan, tugas iki kaya keperluan, lan kita bakal katon ing liyane rinci mengko. Saiki, ayo nggawe:

$ oc create -f https://raw.githubusercontent.com/nodeshift/webapp-pipeline-tutorial/master/tasks/update_deployment_task.yaml
$ oc create -f https://raw.githubusercontent.com/nodeshift/webapp-pipeline-tutorial/master/tasks/apply_manifests_task.yaml

Banjur, nggunakake perintah tkn CLI, kita bakal mriksa manawa tugas wis digawe:

$ tkn task ls

NAME                AGE
apply-manifests     1 minute ago
update-deployment   1 minute ago

Cathetan: Iki minangka tugas lokal kanggo proyek sampeyan saiki.

Tugas kluster

Tugas kluster dhasar padha karo tugas sing prasaja. Yaiku, koleksi langkah sing bisa digunakake maneh sing digabungake kanthi cara siji utawa liyane nalika nindakake tugas tartamtu. Bedane yaiku tugas kluster kasedhiya ing endi wae ing kluster. Kanggo ndeleng dhaptar tugas kluster sing digawe kanthi otomatis nalika nambahake Operator Pipa, kita bakal nggunakake printah tkn CLI maneh:

$ tkn clustertask ls

NAME                       AGE
buildah                    1 day ago
buildah-v0-10-0            1 day ago
jib-maven                  1 day ago
kn                         1 day ago
maven                      1 day ago
openshift-client           1 day ago
openshift-client-v0-10-0   1 day ago
s2i                        1 day ago
s2i-go                     1 day ago
s2i-go-v0-10-0             1 day ago
s2i-java-11                1 day ago
s2i-java-11-v0-10-0        1 day ago
s2i-java-8                 1 day ago
s2i-java-8-v0-10-0         1 day ago
s2i-nodejs                 1 day ago
s2i-nodejs-v0-10-0         1 day ago
s2i-perl                   1 day ago
s2i-perl-v0-10-0           1 day ago
s2i-php                    1 day ago
s2i-php-v0-10-0            1 day ago
s2i-python-3               1 day ago
s2i-python-3-v0-10-0       1 day ago
s2i-ruby                   1 day ago
s2i-ruby-v0-10-0           1 day ago
s2i-v0-10-0                1 day ago

Saiki ayo nggawe rong tugas kluster. Pisanan bakal ngasilake gambar S2I lan dikirim menyang registri OpenShift internal; kaloro iku kanggo mbangun gambar kita adhedhasar NGINX, nggunakake aplikasi kita wis dibangun minangka isi.

Nggawe lan ngirim gambar

Nalika nggawe tugas pisanan, kita bakal mbaleni apa sing wis ditindakake ing artikel sadurunge babagan majelis sing disambung. Elinga yen kita nggunakake gambar S2I (ubi8-s2i-web-app) kanggo "mbangun" aplikasi kita, lan rampung karo gambar sing disimpen ing pendaptaran internal OpenShift. Saiki kita bakal nggunakake gambar aplikasi web S2I iki kanggo nggawe DockerFile kanggo aplikasi kita banjur gunakake Buildah kanggo nindakake mbangun nyata lan push gambar sing diasilake menyang registri internal OpenShift, amarga iku persis sing ditindakake OpenShift nalika sampeyan masang aplikasi nggunakake NodeShift. .

Kepiye carane kita ngerti kabeh iki, sampeyan takon? saka versi resmi saka Node.js resmi, kita mung nyalin lan ngowahi kanggo awake dhewe.

Dadi, saiki ayo nggawe tugas kluster s2i-web-app:

$ oc create -f https://raw.githubusercontent.com/nodeshift/webapp-pipeline-tutorial/master/clustertasks/s2i-web-app-task.yaml

Kita ora bakal nganalisa kanthi rinci, nanging mung fokus ing parameter OUTPUT_DIR:

params:
      - name: OUTPUT_DIR
        description: The location of the build output directory
        default: build

Kanthi gawan, parameter iki padha karo mbangun, ing ngendi React nempatake konten sing dirakit. Frameworks liyane nggunakake dalan beda, contone, ing Ember iku dist. Output saka tugas kluster pisanan kita bakal dadi gambar sing ngemot HTML, JavaScript, lan CSS sing diklumpukake.

Gawe gambar adhedhasar NGINX

Kanggo tugas kluster kapindho, kudu nggawe gambar adhedhasar NGINX kanggo kita, nggunakake konten aplikasi sing wis dibangun. Ateges, iki minangka bagean saka bagean sadurunge sing kita deleng bangunan sing dirantai.

Kanggo nindakake iki, kita - persis kaya ing ndhuwur - bakal nggawe tugas kluster webapp-build-runtime:

$ oc create -f https://raw.githubusercontent.com/nodeshift/webapp-pipeline-tutorial/master/clustertasks/webapp-build-runtime-task.yaml

Yen sampeyan ndeleng kode tugas kluster kasebut, sampeyan bisa ndeleng manawa ora nemtokake repositori Git sing digunakake utawa jeneng gambar sing digawe. Kita mung nemtokake apa persis sing bakal kita transfer menyang Git, utawa gambar tartamtu ing ngendi gambar pungkasan kudu metu. Pramila tugas kluster iki bisa digunakake maneh nalika nggarap aplikasi liyane.

Lan ing kene kita kanthi apik pindhah menyang titik sabanjure ...

Sumber Daya

Dadi, amarga, kaya sing wis dakkandhakake, tugas kluster kudu umume, kita kudu nggawe sumber daya sing bakal digunakake minangka input (gudang Git) lan minangka output (gambar pungkasan). Sumber daya pisanan sing kita butuhake yaiku Git, ing ngendi aplikasi kita manggon, kaya mangkene:

# This resource is the location of the git repo with the web application source
apiVersion: tekton.dev/v1alpha1
kind: PipelineResource
metadata:
  name: web-application-repo
spec:
  type: git
  params:
    - name: url
      value: https://github.com/nodeshift-starters/react-pipeline-example
    - name: revision
      value: master

Ing kene PipelineResource minangka jinis git. Tombol url ing bagean params nuduhake gudang tartamtu lan nemtokake cabang master (iki opsional, nanging kita nulis kanggo nggenepi).

Saiki kita kudu nggawe sumber daya kanggo gambar ing ngendi asil tugas s2i-web-app bakal disimpen, iki rampung kaya iki:

# This resource is the result of running "npm run build",  the resulting built files will be located in /opt/app-root/output
apiVersion: tekton.dev/v1alpha1
kind: PipelineResource
metadata:
  name: built-web-application-image
spec:
  type: image
  params:
    - name: url
      value: image-registry.openshift-image-registry.svc:5000/webapp-pipeline/built-web-application:latest

Ing kene, PipelineResource minangka gambar jinis, lan nilai parameter url nuduhake Registry Gambar OpenShift internal, khusus sing ana ing ruang jeneng webapp-pipeline. Aja lali ngganti setelan iki yen sampeyan nggunakake spasi jeneng liyane.

Lan pungkasane, sumber daya pungkasan sing kita butuhake uga bakal dadi gambar jinis lan iki bakal dadi gambar NGINX pungkasan sing bakal digunakake sajrone panyebaran:

# This resource is the image that will be just the static html, css, js files being run with nginx
apiVersion: tekton.dev/v1alpha1
kind: PipelineResource
metadata:
  name: runtime-web-application-image
spec:
  type: image
  params:
    - name: url
      value: image-registry.openshift-image-registry.svc:5000/webapp-pipeline/runtime-web-application:latest

Maneh, elinga manawa sumber daya iki nyimpen gambar ing registri OpenShift internal ing ruang jeneng webapp-pipeline.

Kanggo nggawe kabeh sumber daya iki bebarengan, kita nggunakake printah nggawe:

$ oc create -f https://raw.githubusercontent.com/nodeshift/webapp-pipeline-tutorial/master/resources/resource.yaml

Sampeyan bisa nggawe manawa sumber daya wis digawe kaya iki:

$ tkn resource ls

Pipa conveyor

Saiki kita duwe kabeh komponen sing dibutuhake, ayo ngumpulake pipa saka wong-wong mau kanthi nggawe kanthi printah ing ngisor iki:

$ oc create -f https://raw.githubusercontent.com/nodeshift/webapp-pipeline-tutorial/master/pipelines/build-and-deploy-react.yaml

Nanging sadurunge kita mbukak printah iki, ayo kang katon ing komponen iki. Jeneng pisanan:

apiVersion: tekton.dev/v1alpha1
kind: Pipeline
metadata:
  name: build-and-deploy-react

Banjur ing bagean spek kita ndeleng indikasi sumber daya sing digawe sadurunge:

spec:
  resources:
    - name: web-application-repo
      type: git
    - name: built-web-application-image
      type: image
    - name: runtime-web-application-image
      type: image

Banjur kita nggawe tugas sing kudu dirampungake pipa. Kaping pisanan, kudu nglakokake tugas s2i-web-app sing wis digawe:

tasks:
    - name: build-web-application
      taskRef:
        name: s2i-web-app
        kind: ClusterTask

Tugas iki njupuk input (sumber daya gir) lan output (dibangun-web-aplikasi-sumber gambar) paramèter. Kita uga menehi parameter khusus supaya ora verifikasi TLS amarga kita nggunakake sertifikat sing ditandatangani dhewe:

resources:
        inputs:
          - name: source
            resource: web-application-repo
        outputs:
          - name: image
            resource: built-web-application-image
      params:
        - name: TLSVERIFY
          value: "false"

Tugas sabanjure meh padha, mung ing kene tugas kluster webapp-build-runtime sing wis digawe diarani:

name: build-runtime-image
    taskRef:
      name: webapp-build-runtime
      kind: ClusterTask

Minangka karo tugas sadurunge, kita pass ing sumber, nanging saiki iku dibangun-web-aplikasi-gambar (output saka tugas kita sadurungé). Lan minangka output kita nyetel maneh gambar. Amarga tugas iki kudu dieksekusi sawise sing sadurunge, kita nambah lapangan runAfter:

resources:
        inputs:
          - name: image
            resource: built-web-application-image
        outputs:
          - name: image
            resource: runtime-web-application-image
        params:
        - name: TLSVERIFY
          value: "false"
      runAfter:
        - build-web-application

Loro tugas sabanjure tanggung jawab kanggo nggunakake layanan, rute lan panyebaran file YAML sing manggon ing direktori k8s aplikasi web kita, lan uga kanggo nganyari penyebaran iki nalika nggawe gambar anyar. Kita nemtokake rong tugas kluster iki ing wiwitan artikel.

Miwiti conveyor

Dadi, kabeh bagean pipa kita digawe, lan kita bakal mbukak kanthi printah ing ngisor iki:

$ tkn pipeline start build-and-deploy-react

Ing tahap iki, baris perintah digunakake kanthi interaktif lan sampeyan kudu milih sumber daya sing cocog kanggo nanggepi saben panjaluke: kanggo sumber git, pilih web-application-repo, banjur kanggo sumber gambar pisanan, dibangun-web-aplikasi -gambar, lan pungkasane, kanggo sumber gambar kapindho -runtime-web-application-image:

? Choose the git resource to use for web-application-repo: web-application-repo (https://github.com/nodeshift-starters/react-pipeline-example)
? Choose the image resource to use for built-web-application-image: built-web-application-image (image-registry.openshift-image-registry.svc:5000/webapp-pipeline/built-web-
application:latest)
? Choose the image resource to use for runtime-web-application-image: runtime-web-application-image (image-registry.openshift-image-registry.svc:5000/webapp-pipeline/runtim
e-web-application:latest)
Pipelinerun started: build-and-deploy-react-run-4xwsr

Saiki ayo mriksa status pipa nggunakake printah ing ngisor iki:

$ tkn pipeline logs -f

Sawise pipeline wis diwiwiti lan aplikasi wis disebarake, kita bisa njaluk rute sing diterbitake kanthi printah ing ngisor iki:

$ oc get route react-pipeline-example --template='http://{{.spec.host}}'

Kanggo visualisasi sing luwih gedhe, sampeyan bisa ndeleng pipa ing mode Pangembang ing konsol web ing bagean kasebut Pipa, minangka ditampilake ing Fig. 1.

Aplikasi modern ing OpenShift, bagean 3: OpenShift minangka lingkungan pangembangan lan OpenShift Pipelines

Gambar 1. Review saka mlaku pipelines.

Ngeklik pipa sing mlaku nampilake rincian tambahan, kaya sing ditampilake ing Gambar 2.

Aplikasi modern ing OpenShift, bagean 3: OpenShift minangka lingkungan pangembangan lan OpenShift Pipelines

Gabah. 2. Informasi tambahan babagan pipa.

Sawise informasi luwih lengkap, sampeyan bisa ndeleng aplikasi sing mlaku ing tampilan Topologi, minangka ditampilake ing Fig.3.

Aplikasi modern ing OpenShift, bagean 3: OpenShift minangka lingkungan pangembangan lan OpenShift Pipelines

Fig 3. Dibukak pod.

Ngeklik ing bunder ing pojok tengen ndhuwur lambang mbukak aplikasi kita, minangka ditampilake ing Fig. 4.

Aplikasi modern ing OpenShift, bagean 3: OpenShift minangka lingkungan pangembangan lan OpenShift Pipelines

Gabah. 4. Aplikasi Running React.

kesimpulan

Dadi, kita nuduhake carane mbukak server pangembangan kanggo aplikasi sampeyan ing OpenShift lan nyinkronake karo sistem file lokal. Kita uga ndeleng carane nyimulake template chained-build nggunakake OpenShift Pipelines. Kabeh conto kode saka artikel iki bisa ditemokake kene.

Sumber daya tambahan (EN)

Pengumuman webinar sing bakal teka

Kita miwiti seri webinar Jumuah babagan pengalaman asli nggunakake Red Hat OpenShift Container Platform lan Kubernetes:

Source: www.habr.com

Add a comment