Bonjou tout moun! Sa a se dezyèm pòs nan seri nou an kote nou montre kijan pou deplwaye aplikasyon entènèt modèn sou Red Hat OpenShift.
Nan pòs anvan an, nou te touche yon ti kras sou kapasite nouvo S2I (sous-a-imaj) builder imaj, ki fèt pou bati ak deplwaye aplikasyon entènèt modèn sou platfòm OpenShift la. Lè sa a, nou te enterese nan sijè a nan deplwaye byen vit yon aplikasyon, ak jodi a nou pral gade nan ki jan yo sèvi ak yon imaj S2I kòm yon "pi" imaj mason ak konbine li ak asanble OpenShift ki gen rapò.
Netwaye imaj mason
Kòm nou mansyone nan Pati XNUMX, pifò aplikasyon entènèt modèn yo gen yon sa yo rele etap konstriksyon, ki tipikman fè operasyon tankou transpilasyon kòd, konkatènasyon fichye miltip, ak minifikasyon. Fichye yo jwenn kòm yon rezilta nan operasyon sa yo - ak sa a se HTML estatik, JavaScript ak CSS - yo estoke nan katab pwodiksyon an. Kote katab sa a anjeneral depann de ki zouti konstriksyon yo te itilize, epi pou React sa a pral katab la ./build (nou pral tounen sou sa a an plis detay anba a).
Sous-a-Imaj (S2I)
Nan pòs sa a nou pa manyen sijè "ki sa ki S2I ak kijan pou itilize li" (ou ka li plis sou sa a ), men li enpòtan pou w klè sou de etap sa yo nan pwosesis sa a pou w konprann sa yon imaj Web App Builder fè.
Faz asanble
Faz asanble a sanble anpil nan lanati ak sa k ap pase lè ou kouri Docker build epi fini ak yon nouvo imaj Docker. An konsekans, etap sa a rive lè w kòmanse yon bati sou platfòm OpenShift la.
Nan ka yon imaj Web App Builder, li responsab pou enstale depandans aplikasyon w lan ak kouri bati a. . Pa default, imaj builder la itilize npm run build construction, men sa a ka pase sou plas nan varyab anviwònman NPM_BUILD.
Kòm nou te di pi bonè, kote aplikasyon an fini, deja bati depann de ki zouti ou itilize. Pou egzanp, nan ka React sa a pral katab la ./build, ak pou aplikasyon angilè li pral folder nan project_name/dist. Epi, jan yo deja montre nan pòs anvan an, kote anyè pwodiksyon an, ki se mete nan bati pa default, ka depase nan varyab anviwònman an OUTPUT_DIR. Oke, depi kote a nan katab pwodiksyon an diferan de fondasyon an kad, ou tou senpleman kopye pwodiksyon an pwodwi nan katab la estanda nan imaj la, sètadi /opt/apt-root/output. Sa a enpòtan pou konprann rès atik sa a, men pou kounye a ann gade byen vit nan pwochen etap la - faz nan kouri.
kouri faz
Etap sa a rive lè yo fè yon apèl nan kouri docker sou nouvo imaj ki te kreye pandan etap asanble a. Menm bagay la tou rive lè w ap deplwaye sou platfòm OpenShift la. Default itilizasyon pou sèvi kontni estatik ki sitiye nan anyè pwodiksyon estanda ki anwo a.
Metòd sa a bon pou deplwaye aplikasyon rapid, men li jeneralman pa rekòmande pou sèvi kontni estatik nan fason sa a. Oke, piske an reyalite nou sèlman sèvi kontni estatik, nou pa bezwen Node.js enstale andedan imaj nou an - yon sèvè entènèt ap sifi.
Nan lòt mo, lè rasanble nou bezwen yon bagay, lè egzekite nou bezwen yon lòt. Nan sitiyasyon sa a, bati chèn vini an sou la men.
Chained bati
Sa a se sa yo ekri sou nan dokiman OpenShift la:
"De asanble yo ka lye ansanm, ak youn jenere yon antite konpile ak lòt la hosting antite sa a nan yon imaj separe ki itilize pou kouri antite sa a."
Nan lòt mo, nou ka itilize imaj la Web App Builder pou kouri bati nou an, ak Lè sa a, sèvi ak imaj la sèvè entènèt, menm NGINX a, sèvi kontni nou an.
Kidonk, nou ka itilize imaj la Web App Builder kòm yon "pi" mason epi an menm tan an gen yon ti imaj ègzekutabl.
Koulye a, kite a gade nan sa a ak yon egzanp espesifik.
Pou fòmasyon nou pral itilize , kreye lè l sèvi avèk zouti liy kòmand kreye-react-app.
Li pral ede nou mete tout bagay ansanm .
Ann gade nan dosye sa a an plis detay, epi kòmanse ak seksyon an paramèt.
parameters:
- name: SOURCE_REPOSITORY_URL
description: The source URL for the application
displayName: Source URL
required: true
- name: SOURCE_REPOSITORY_REF
description: The branch name for the application
displayName: Source Branch
value: master
required: true
- name: SOURCE_REPOSITORY_DIR
description: The location within the source repo of the application
displayName: Source Directory
value: .
required: true
- name: OUTPUT_DIR
description: The location of the compiled static files from your web apps builder
displayName: Output Directory
value: build
required: false
Tout bagay isit la trè klè, men li vo peye atansyon sou paramèt OUTPUT_DIR la. Pou aplikasyon React nan egzanp nou an, pa gen anyen enkyete sou, depi React itilize valè default la kòm katab pwodiksyon an, men nan ka angilè oswa yon lòt bagay, paramèt sa a pral bezwen chanje jan sa nesesè.
Koulye a, kite a pran yon gade nan seksyon an ImageStreams.
- apiVersion: v1
kind: ImageStream
metadata:
name: react-web-app-builder // 1
spec: {}
- apiVersion: v1
kind: ImageStream
metadata:
name: react-web-app-runtime // 2
spec: {}
- apiVersion: v1
kind: ImageStream
metadata:
name: web-app-builder-runtime // 3
spec:
tags:
- name: latest
from:
kind: DockerImage
name: nodeshift/ubi8-s2i-web-app:10.x
- apiVersion: v1
kind: ImageStream
metadata:
name: nginx-image-runtime // 4
spec:
tags:
- name: latest
from:
kind: DockerImage
name: 'centos/nginx-112-centos7:latest'
Gade twazyèm ak katriyèm imaj yo. Yo tou de defini kòm imaj Docker, epi ou ka byen klè wè kote yo soti.
Twazyèm imaj la se web-app-builder e li soti nan nodeshift/ubi8-s2i-web-app ki make 10.x sou .
Katriyèm lan se yon imaj NGINX (vèsyon 1.12) ak dènye tag la .
Koulye a, ann gade nan de premye imaj yo. Yo tou de vid nan kòmansman epi yo kreye sèlman pandan faz konstriksyon an. Premye imaj la, reyaji-web-app-builder, pral rezilta nan yon etap asanble ki pral konbine imaj la web-app-builder-runtime ak kòd sous nou an. Se poutèt sa nou te ajoute "-builder" nan non imaj sa a.
Dezyèm imaj la - react-web-app-runtime - pral rezilta konbine nginx-image-runtime ak kèk dosye ki soti nan imaj react-web-app-builder. Imaj sa a pral itilize tou pandan deplwaman epi li pral sèlman genyen sèvè entènèt la ak HTML estatik, JavaScript, CSS aplikasyon nou an.
Konfonn? Koulye a, kite a pran yon gade nan konfigirasyon yo bati epi li pral vin yon ti kras pi klè.
Modèl nou an gen de konfigirasyon bati. Men premye a, epi li trè estanda:
apiVersion: v1
kind: BuildConfig
metadata:
name: react-web-app-builder
spec:
output:
to:
kind: ImageStreamTag
name: react-web-app-builder:latest // 1
source: // 2
git:
uri: ${SOURCE_REPOSITORY_URL}
ref: ${SOURCE_REPOSITORY_REF}
contextDir: ${SOURCE_REPOSITORY_DIR}
type: Git
strategy:
sourceStrategy:
env:
- name: OUTPUT_DIR // 3
value: ${OUTPUT_DIR}
from:
kind: ImageStreamTag
name: web-app-builder-runtime:latest // 4
incremental: true // 5
type: Source
triggers: // 6
- github:
secret: ${GITHUB_WEBHOOK_SECRET}
type: GitHub
- type: ConfigChange
- imageChange: {}
type: ImageChange
Kòm ou ka wè, liy lan ak etikèt 1 di ke rezilta a nan bati sa a pral mete nan menm imaj la reyaji-web-app-builder ke nou te wè yon ti kras pi bonè nan seksyon an ImageStreams.
Liy ki make 2 a di w ki kote pou w jwenn kòd la. Nan ka nou an, sa a se yon depo git, ak kote, ref ak katab kontèks yo detèmine pa paramèt yo nou deja wè pi wo a.
Liy ki make 3 se sa nou te deja wè nan seksyon paramèt yo. Li ajoute varyab anviwònman an OUTPUT_DIR, ki nan egzanp nou an se bati.
Liy ki make 4 la di pou itilize imaj web-app-builder-runtime, ke nou te deja wè nan seksyon ImageStream la.
Liy ki make 5 di ke nou vle sèvi ak yon bati incrémentielle si imaj S2I a sipòte li, epi imaj Web App Builder la fè. Nan premye lansman an, apre etap asanble a fini, imaj la pral sove folder nan node_modules nan yon dosye achiv. Lè sa a, sou kouri ki vin apre yo, imaj la pral tou senpleman dezipe katab sa a pou diminye tan bati.
Epi finalman, liy ki make 6 a se jis kèk deklanche pou fè bati a kouri otomatikman, san entèvansyon manyèl, lè yon bagay chanje.
An jeneral, sa a se yon konfigirasyon bati trè estanda.
Koulye a, kite a pran yon gade nan dezyèm konfigirasyon bati. Li sanble anpil ak premye a, men gen yon diferans enpòtan.
apiVersion: v1
kind: BuildConfig
metadata:
name: react-web-app-runtime
spec:
output:
to:
kind: ImageStreamTag
name: react-web-app-runtime:latest // 1
source: // 2
type: Image
images:
- from:
kind: ImageStreamTag
name: react-web-app-builder:latest // 3
paths:
- sourcePath: /opt/app-root/output/. // 4
destinationDir: . // 5
strategy: // 6
sourceStrategy:
from:
kind: ImageStreamTag
name: nginx-image-runtime:latest
incremental: true
type: Source
triggers:
- github:
secret: ${GITHUB_WEBHOOK_SECRET}
type: GitHub
- type: ConfigChange
- type: ImageChange
imageChange: {}
- type: ImageChange
imageChange:
from:
kind: ImageStreamTag
name: react-web-app-builder:latest // 7
Se konsa, dezyèm konfigirasyon bati a se reyaji-web-app-runtime, epi li kòmanse soti trè estanda.
Liy ki make 1 a pa gen anyen nouvo - li tou senpleman di ke rezilta bati a mete nan imaj la react-web-app-runtime.
Liy ki make 2, tankou nan konfigirasyon anvan an, endike ki kote pou jwenn kòd sous la. Men, remake ke isit la nou ap di ke li se pran nan imaj la. Anplis, soti nan imaj la ke nou jis kreye - soti nan reyaji-web-app-builder (ki endike nan liy ki make 3). Fichye yo nou vle itilize yo andedan imaj la epi kote yo mete nan liy ki make 4, nan ka nou an se /opt/app-root/output/. Si w sonje, sa a se kote dosye yo pwodwi ki baze sou rezilta yo nan bati aplikasyon nou an yo estoke.
Katab destinasyon an espesifye nan tèm nan ak etikèt 5 se tou senpleman anyè aktyèl la (sa a se tout, sonje, kouri andedan kèk bagay majik yo rele OpenShift, epi yo pa sou òdinatè lokal ou a).
Seksyon estrateji a - liy ki make 6 - sanble tou ak premye konfigirasyon konstriksyon an. Se sèlman fwa sa a nou pral sèvi ak nginx-image-runtime, ki nou te deja wè nan seksyon ImageStream la.
Finalman, liy ki make 7 a se yon seksyon deklannche ki pral aktive bati sa a chak fwa imaj reyaji-web-app-builder la chanje.
Sinon, modèl sa a gen konfigirasyon deplwaman trè estanda, ansanm ak bagay ki gen rapò ak sèvis ak wout, men nou pa pral antre nan twòp detay. Tanpri sonje ke imaj la ke yo pral deplwaye se imaj la react-web-app-runtime.
Deplwaman aplikasyon
Se konsa, kounye a ke nou te gade nan modèl la, kite a wè ki jan yo sèvi ak li deplwaye yon aplikasyon.
Nou ka itilize zouti kliyan OpenShift ki rele oc pou deplwaye modèl nou an:
$ find . | grep openshiftio | grep application | xargs -n 1 oc apply -f
$ oc new-app --template react-web-app -p SOURCE_REPOSITORY_URL=https://github.com/lholmquist/react-web-app
Premye kòmandman nan D' ki pi wo a se yon fason espre jeni pou jwenn yon modèl./openshiftio/application.yaml.
Dezyèm kòmandman an tou senpleman kreye yon nouvo aplikasyon ki baze sou modèl sa a.
Apre kòmandman sa yo travay, nou pral wè ke nou gen de asanble:
Epi retounen nan ekran Apèsi sou lekòl la, nou pral wè gous lanse a:
Klike sou lyen an epi yo pral mennen nou nan aplikasyon nou an, ki se paj default React App a:
Sipleman 1
Pou rayisab angilè nou genyen tou .
Modèl la isit la se menm bagay la, eksepte pou varyab OUTPUT_DIR.
Sipleman 2
Nan atik sa a nou itilize NGINX kòm yon sèvè entènèt, men li se byen fasil ranplase li ak Apache, jis chanje modèl la nan dosye a. sou .
Konklizyon
Nan premye pati seri sa a, nou te montre kijan pou deplwaye byen vit aplikasyon entènèt modèn sou platfòm OpenShift la. Jodi a nou te gade sa yon imaj aplikasyon Web fè ak ki jan li ka konbine avèk yon sèvè entènèt pi bon kalite tankou NGINX lè l sèvi avèk chèn bati pou kreye yon aplikasyon ki pi pare pou pwodiksyon. Nan pwochen ak dènye atik nan seri sa a, nou pral montre kijan pou kouri yon sèvè devlopman pou aplikasyon w lan sou OpenShift epi asire senkronizasyon dosye lokal yo ak dosye aleka.
Sa ki nan seri atik sa a
- Pati 1: ;
- Pati 2: Ki jan yo sèvi ak yon nouvo imaj S2I ak yon imaj sèvè HTTP ki deja egziste, tankou NGINX, lè l sèvi avèk asanble OpenShift ki asosye pou deplwaman pwodiksyon;
- Pati 3: ki jan yo kouri yon sèvè devlopman pou aplikasyon w lan sou platfòm OpenShift la epi senkronize li ak sistèm dosye lokal la.
Lòt Resous
- Gratis e-liv .
- Enfòmasyon sou .
Sous: www.habr.com