{"id":92048,"date":"2020-08-22T07:42:57","date_gmt":"2020-08-22T05:42:57","guid":{"rendered":"https:\/\/prohoster.info\/blog\/administrirovanie\/sovremennye-prilozheniya-na-openshift-chast-3-openshift-kak-sreda-razrabotki-i-konvejery-openshift-pipelines"},"modified":"2020-08-22T07:42:57","modified_gmt":"2020-08-22T05:42:57","slug":"sovremennye-prilozheniya-na-openshift-chast-3-openshift-kak-sreda-razrabotki-i-konvejery-openshift-pipelines","status":"publish","type":"post","link":"https:\/\/prohoster.info\/sq\/blog\/administrirovanie\/sovremennye-prilozheniya-na-openshift-chast-3-openshift-kak-sreda-razrabotki-i-konvejery-openshift-pipelines","title":{"rendered":"Aplikacionet moderne n\u00eb OpenShift, pjesa 3: OpenShift si mjedis zhvillimi dhe pipeline-et OpenShift Pipelines","gt_translate_keys":[{"key":"rendered","format":"text"}]},"content":{"rendered":"

P\u00ebrsh\u00ebndetje t\u00eb gjith\u00eb n\u00eb k\u00ebt\u00eb blog! Ky \u00ebsht\u00eb postimi i tret\u00eb nga seria, ku ne shfaqim se si t\u00eb zhvilloni aplikacione moderne n\u00eb Red Hat OpenShift.<\/p>\n

\"Aplikacionet
\n
\nN\u00eb dy postimet e m\u00ebparshme ne treguam se si t\u00eb zhvilloni aplikacione moderne me disa hapa t\u00eb thjesht\u00eb dhe si t\u00eb p\u00ebrdorni imazhin e ri S2I s\u00eb bashku me imazhin e gatsh\u00ebm t\u00eb serverit HTTP, si NGINX me ndihm\u00ebn e nd\u00ebrlidhjeve t\u00eb nd\u00ebrtimit p\u00ebr t\u00eb organizuar nj\u00eb zhvillim prodhimi.<\/p>\n

Sot ne do t\u00eb tregojm\u00eb se si t\u00eb nxjerrim n\u00eb platform\u00ebn OpenShift nj\u00eb server zhvillimi p\u00ebr aplikacionin ton\u00eb dhe ta sinkronizojm\u00eb at\u00eb me sistemin lokal t\u00eb skedar\u00ebve, si dhe do t\u00eb flasim p\u00ebr \u00e7far\u00eb \u00ebsht\u00eb OpenShift Pipelines dhe si mund t\u00eb aplikohet si alternativ\u00eb ndaj nd\u00ebrlidhjeve t\u00eb nd\u00ebrtimit.
\n<\/a><\/noindex><\/p>\n

OpenShift si nj\u00eb mjedis zhvillimi<\/h3>\n

<\/p>\n

Procesi i pun\u00ebs p\u00ebr zhvillim<\/h4>\n

\nSi\u00e7 u tha m\u00eb par\u00eb n\u00eb postimin e par\u00eb<\/a><\/noindex>, procesi tipik i zhvillimit p\u00ebr aplikacione moderne \u00ebsht\u00eb thjesht nj\u00eb 'server zhvillimi' q\u00eb monitoron ndryshimet n\u00eb skedar\u00ebt lokal\u00eb. Kur ndodhin ato, niset ndarja e aplikacionit, dhe m\u00eb pas ajo p\u00ebrdit\u00ebsohet n\u00eb shfletues.<\/p>\n

N\u00eb shumic\u00ebn e kornizave moderne, nj\u00eb 'server zhvillimi' \u00ebsht\u00eb i integruar n\u00eb veglat p\u00ebrkat\u00ebse t\u00eb komand\u00ebs.<\/p>\n

Shembulli lokal<\/h4>\n

\nFillimisht, le t\u00eb shikojm\u00eb se si funksionon kjo p\u00ebr sa i p\u00ebrket ekzekutimit lokal t\u00eb aplikacioneve. Si shembull do t\u00eb p\u00ebrdorim aplikacionin React<\/a><\/noindex> nga artikujt e m\u00ebparsh\u00ebm, megjith\u00ebse konceptet e nj\u00ebjta t\u00eb procesit t\u00eb pun\u00ebs jan\u00eb t\u00eb aplikueshme n\u00eb t\u00eb gjitha kornizat moderne.
\nPra, p\u00ebr t\u00eb nisur 'serverin e zhvillimit' n\u00eb shembullin ton\u00eb me React, do t\u00eb futim komand\u00ebn e m\u00ebposhtme:<\/p>\n

$ npm run start\n<\/code><\/pre>\n
\nAt\u00ebher\u00eb n\u00eb dritaren e terminalit do t\u00eb shohim di\u00e7ka t\u00eb till\u00eb:<\/p>\n
\"Aplikacionet<\/p>\n
Dhe aplikacioni yn\u00eb do t\u00eb hapet n\u00eb shfletuesin ton\u00eb t\u00eb paracaktuar:<\/p>\n
\"Aplikacionet<\/p>\n
Tani, n\u00ebse b\u00ebjm\u00eb ndryshime n\u00eb skedar, aplikacioni duhet t\u00eb p\u00ebrdit\u00ebsohet n\u00eb shfletues.<\/p>\n
OK, \u00ebsht\u00eb e qart\u00eb p\u00ebr zhvillimin n\u00eb modus lokal, por si t\u00eb arrihet e nj\u00ebjta gj\u00eb n\u00eb OpenShift?<\/p>\n
Serveri i zhvillimit n\u00eb OpenShift<\/h4>\n
\nN\u00ebse e mbani mend, n\u00eb postimin e kaluar<\/a><\/noindex>, ne diskutuam faz\u00ebn e aktivizimit (run phase) t\u00eb imazhit S2I dhe pat\u00ebm mund\u00ebsin\u00eb t\u00eb shohim se p\u00ebr parazgjedhje, menaxhimi i aplikacionit ton\u00eb web b\u00ebhet nga moduli serve.<\/p>\n
Megjithat\u00eb, n\u00ebse e shikojm\u00eb m\u00eb me kujdes skriptin e aktivizimit<\/a><\/noindex> nga ai shembull, v\u00ebreni se ka nj\u00eb variab\u00ebl ambienti $NPM_RUN, e cila lejon t\u00eb ekzekutohet edhe komanda juaj.<\/p>\n
P\u00ebr shembull, mund t\u00eb p\u00ebrdorim modulimin nodeshift p\u00ebr t\u00eb zhvilluar aplikacionin ton\u00eb:<\/p>\n
$ npx nodeshift --deploy.env NPM_RUN=\"yarn start\" --dockerImage=nodeshift\/ubi8-s2i-web-app\n<\/code><\/pre>\n
\nV\u00ebrejtje: shembulli m\u00eb sip\u00ebr \u00ebsht\u00eb dh\u00ebn\u00eb n\u00eb nj\u00eb form\u00eb t\u00eb p\u00ebrmbledhur p\u00ebr t\u00eb ilustruar iden\u00eb e p\u00ebrgjithshme.<\/i><\/p>\n
K\u00ebtu kemi shtuar n\u00eb shp\u00ebrndarjen ton\u00eb nj\u00eb variab\u00ebl mjedisi NPM_RUN, e cila i thot\u00eb faz\u00ebs s\u00eb ekzekutimit q\u00eb duhet t\u00eb ekzekutoj\u00eb komand\u00ebn yarn start, e cila nis serverin e zhvillimit React brenda pod-it ton\u00eb OpenShift.<\/p>\n
N\u00ebse shikoni logun e pod-it n\u00eb pun\u00eb, do t\u00eb duket p\u00ebraf\u00ebrsisht k\u00ebshtu:<\/p>\n
\"Aplikacionet<\/p>\n
Sigurisht, kjo do t\u00eb mos ket\u00eb kuptim derisa t\u00eb mund t\u00eb sinkronizojm\u00eb kodin lokal me kodin, i cili gjithashtu kontrollohet p\u00ebr ndryshime, por jeton n\u00eb nj\u00eb server t\u00eb larg\u00ebt.<\/p>\n
Sinkronizimi i kodit t\u00eb larg\u00ebt dhe atij lokal<\/h4>\n
\nFatmir\u00ebsisht, nodeshift ndihmon leht\u00ebsisht me sinkronizimin, dhe p\u00ebr t\u00eb ndjekur ndryshimet mund t\u00eb p\u00ebrdorim komand\u00ebn watch.<\/p>\n
K\u00ebshtu q\u00eb pasi t\u00eb kemi ekzekutuar komand\u00ebn p\u00ebr shp\u00ebrndarjen e serverit t\u00eb zhvillimit p\u00ebr aplikacionin ton\u00eb, mund t\u00eb p\u00ebrdorim me besim k\u00ebt\u00eb komand\u00eb:<\/p>\n
$ npx nodeshift watch\n<\/code><\/pre>\n
\nSi rezultat, do t\u00eb lidhemi me pod-in e aktivizuar q\u00eb krijuam pak m\u00eb par\u00eb, aktivizohet sinkronizimi i skedar\u00ebve tan\u00eb lokal\u00eb me klusterin e larg\u00ebt, dhe skedar\u00ebt n\u00eb sistemin ton\u00eb lokal do t\u00eb fillojn\u00eb t\u00eb ndjekin ndryshimet.<\/p>\n
Prandaj, n\u00ebse tani p\u00ebrdit\u00ebsojm\u00eb skedarin src\/App.js, sistemi do t\u00eb reagoj\u00eb ndaj k\u00ebtyre ndryshimeve, do t'i kopjoj\u00eb ato n\u00eb klusterin e larg\u00ebt dhe do t\u00eb niste serverin e zhvillimit, i cili m\u00eb pas do ta p\u00ebrdit\u00ebsoj\u00eb aplikacionin ton\u00eb n\u00eb shfletues.<\/p>\n
P\u00ebr t\u00eb plot\u00ebsuar pamjen, le t\u00eb shohim si duken k\u00ebto komanda n\u00eb t\u00ebr\u00ebsi:<\/p>\n
$ 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\n\n$ npx nodeshift watch --strictSSL=false\n<\/code><\/pre>\n
\nKomanda watch \u00ebsht\u00eb nj\u00eb abstraksion mbi komand\u00ebn oc rsync, p\u00ebr detaje m\u00eb t\u00eb thella mbi funksionimin e saj mund t\u00eb m\u00ebsoni k\u00ebtu<\/a><\/noindex>.<\/p>\n
Ky ishte nj\u00eb shembull p\u00ebr React, por e nj\u00ebjta metod\u00eb mund t\u00eb p\u00ebrdoret edhe me framework-e t\u00eb tjera, thjesht shkruani si\u00e7 duhet variablin mjedisor NPM_RUN.
\n\u2003<\/p>\n
Tuba t\u00eb Openshift Pipelines<\/h3>\n
\"Aplikacionet<\/p>\n
M\u00eb pas do t\u00eb flasim p\u00ebr nj\u00eb mjet, si\u00e7 \u00ebsht\u00eb OpenShift Pipelines, dhe se si mund t\u00eb p\u00ebrdoret si nj\u00eb alternativ\u00eb p\u00ebr nd\u00ebrtimet e lidhura chained build.<\/p>\n
\u00c7far\u00eb jan\u00eb OpenShift Pipelines<\/h4>\n
\nOpenShift Pipelines \u00ebsht\u00eb nj\u00eb sistem CI\/CD i orientuar nga reja p\u00ebr integrimin dhe shp\u00ebrndarjen e vazhdueshme, i destinuar p\u00ebr organizimin e konvejereve duke p\u00ebrdorur Tekton. Tekton \u00ebsht\u00eb nj\u00eb korniz\u00eb CI\/CD me burim t\u00eb hapur, e cila \u00ebsht\u00eb e natyrshme p\u00ebr Kubernetes, duke lejuar automatizimin e shp\u00ebrndarjes n\u00eb platforma t\u00eb ndryshme (Kubernetes, serverless, makina virtuale, etj.) duke abstraktuar nivelin e posht\u00ebm.<\/p>\n
P\u00ebr t\u00eb kuptuar k\u00ebt\u00eb artikull jan\u00eb t\u00eb nevojshme disa njohuri mbi Pipelines, prandaj ju sugjerojm\u00eb t\u00eb njiheni fillimisht me manualin zyrtar<\/a><\/noindex>.<\/p>\n
Konfigurimi i mjedisit t\u00eb pun\u00ebs<\/h4>\n
\nP\u00ebr t\u00eb provuar shembujt nga ky artikull, s\u00eb pari duhet t\u00eb p\u00ebrgatitni mjedisin e pun\u00ebs:<\/p>\n
    \n
  1. Instaloni dhe konfiguroni nj\u00eb klaster OpenShift 4. N\u00eb shembujt tan\u00eb, p\u00ebr k\u00ebt\u00eb p\u00ebrdoren CodeReady Containers (CRD), udh\u00ebzimet p\u00ebr instalimin e t\u00eb cil\u00ebve mund t\u00eb gjenden k\u00ebtu<\/a><\/noindex>.<\/li>\n
  2. Pas p\u00ebrfundimit t\u00eb klasterit, duhet t\u00eb instaloni Pipeline Operator. Mos u frik\u00ebsoni, \u00ebsht\u00eb e leht\u00eb; udh\u00ebzimet p\u00ebr instalimin e tij k\u00ebtu<\/a><\/noindex>.<\/li>\n
  3. Shkarko Tekton CLI<\/a><\/noindex> (tkn) k\u00ebtu<\/a><\/noindex>.<\/li>\n
  4. Ekzekutoni mjetin e komand\u00ebs create-react-app p\u00ebr t\u00eb krijuar nj\u00eb aplikacion q\u00eb m\u00eb pas do t\u00eb shp\u00ebrndahet (ky \u00ebsht\u00eb nj\u00eb aplikacion i thjesht\u00eb React<\/a><\/noindex>).<\/li>\n
  5. (Opsionale) Kloni repositorin p\u00ebr t\u00eb drejtuar lokalisht shembullin e aplikacionit me komand\u00ebn npm install dhe pastaj npm start.<\/li>\n<\/ol>\n
    \nN\u00eb repositorin e aplikacionit gjithashtu do t\u00eb ket\u00eb nj\u00eb dosje k8s, ku do t\u00eb jen\u00eb YAML-t\u00eb e Kubernetes\/OpenShift q\u00eb p\u00ebrdoren p\u00ebr shp\u00ebrndarjen e aplikacionit. Aty do t\u00eb jen\u00eb Tasks, ClusterTasks, Resources dhe Pipelines q\u00eb ne do t\u00eb krijojm\u00eb n\u00eb k\u00ebt\u00eb repotit\u00eb e tij<\/a><\/noindex>.<\/p>\n
    T\u00eb fillojm\u00eb<\/h4>\n
    \nS\u00eb pari, p\u00ebr shembullin ton\u00eb duhet t\u00eb krijojm\u00eb nj\u00eb projekt t\u00eb ri n\u00eb klasterin OpenShift. Ta quajm\u00eb k\u00ebt\u00eb projekt webapp-pipeline dhe ta krijojm\u00eb me komand\u00ebn e m\u00ebposhtme:<\/p>\n
    $ oc new-project webapp-pipeline\n<\/code><\/pre>\n
    \nM\u00eb pas, kjo em\u00ebr projekti do t\u00eb figuroj\u00eb n\u00eb kod, k\u00ebshtu q\u00eb, n\u00ebse vendosni ta quani ndryshe, mos harroni t\u00eb rregulloni p\u00ebrkat\u00ebsisht kodin nga shembujt. Duke filluar nga ky moment, ne do t\u00eb shkojm\u00eb nga posht\u00eb lart: do t\u00eb krijojm\u00eb s\u00eb pari t\u00eb gjitha komponent\u00ebt e konvejereve dhe pastaj konvejerin vet\u00eb.<\/p>\n
    Pra, s\u00eb pari...<\/p>\n
    Detyrat Tasks<\/h4>\n
    \nNe do qojm\u00eb disa detyra (tasks) q\u00eb do t\u00eb ndihmojn\u00eb m\u00eb pas n\u00eb implementimin e aplikacionit n\u00eb kuad\u00ebr t\u00eb konvejerit ton\u00eb pipeline. Detyra e par\u00eb \u2013 apply_manifests_task \u2013 \u00ebsht\u00eb p\u00ebrgjegj\u00ebse p\u00ebr aplikimin e burimeve Kubernetes (service, deployment dhe route) q\u00eb ndodhen n\u00eb dosjen k8s t\u00eb aplikacionit ton\u00eb. Detyra e dyt\u00eb \u2013 update_deployment_task \u2013 \u00ebsht\u00eb p\u00ebrgjegj\u00ebse p\u00ebr p\u00ebrdit\u00ebsimin e imazhit tashm\u00eb t\u00eb implementuar me at\u00eb q\u00eb krijohet nga konvejeri yn\u00eb.<\/p>\n
    Mos u shqet\u00ebsoni n\u00ebse nuk \u00ebsht\u00eb shum\u00eb e qart\u00eb p\u00ebr momentin. N\u00eb t\u00eb v\u00ebrtet\u00eb, k\u00ebto detyra jan\u00eb si lloji i mjeteve, dhe ne do t'i shqyrtojm\u00eb ato m\u00eb von\u00eb. Nd\u00ebrsa p\u00ebr tani, le t\u00eb krijojm\u00eb ato:<\/p>\n
    $ oc create -f https:\/\/raw.githubusercontent.com\/nodeshift\/webapp-pipeline-tutorial\/master\/tasks\/update_deployment_task.yaml\n$ oc create -f https:\/\/raw.githubusercontent.com\/nodeshift\/webapp-pipeline-tutorial\/master\/tasks\/apply_manifests_task.yaml\n<\/code><\/pre>\n
    \nM\u00eb pas, me ndihm\u00ebn e komand\u00ebs tkn CLI, do t\u00eb verifikojm\u00eb q\u00eb detyrat jan\u00eb krijuar:<\/p>\n
    $ tkn task ls\n\nNAME                AGE\napply-manifests     1 minute ago\nupdate-deployment   1 minute ago\n<\/code><\/pre>\n
    \nSh\u00ebnim: k\u00ebto jan\u00eb detyra lokale t\u00eb projektit tuaj aktual.<\/i><\/p>\n
    Detyrat e klasit Cluster tasks<\/h4>\n
    \nDetyrat e klasit Cluster tasks jan\u00eb n\u00eb thelb t\u00eb nj\u00ebjtat si detyrat e zakonshme. K\u00ebshtu, ato jan\u00eb nj\u00eb koleksion i rip\u00ebrdorsh\u00ebm hapash, t\u00eb cil\u00ebt kombinohen n\u00eb m\u00ebnyra t\u00eb ndryshme gjat\u00eb ekzekutimit t\u00eb nj\u00eb detyre t\u00eb caktuar. Dallimi \u00ebsht\u00eb se detyra e klasit \u00ebsht\u00eb e disponueshme n\u00eb t\u00eb gjith\u00eb klastrin. P\u00ebr t\u00eb par\u00eb list\u00ebn e detyrave t\u00eb klasit q\u00eb krijohen automatikisht kur shtohet Pipeline Operator, le t\u00eb p\u00ebrdorim p\u00ebrs\u00ebri komand\u00ebn tkn CLI:<\/p>\n
    $ tkn clustertask ls\n\nNAME                       AGE\nbuildah                    1 day ago\nbuildah-v0-10-0            1 day ago\njib-maven                  1 day ago\nkn                         1 day ago\nmaven                      1 day ago\nopenshift-client           1 day ago\nopenshift-client-v0-10-0   1 day ago\ns2i                        1 day ago\ns2i-go                     1 day ago\ns2i-go-v0-10-0             1 day ago\ns2i-java-11                1 day ago\ns2i-java-11-v0-10-0        1 day ago\ns2i-java-8                 1 day ago\ns2i-java-8-v0-10-0         1 day ago\ns2i-nodejs                 1 day ago\ns2i-nodejs-v0-10-0         1 day ago\ns2i-perl                   1 day ago\ns2i-perl-v0-10-0           1 day ago\ns2i-php                    1 day ago\ns2i-php-v0-10-0            1 day ago\ns2i-python-3               1 day ago\ns2i-python-3-v0-10-0       1 day ago\ns2i-ruby                   1 day ago\ns2i-ruby-v0-10-0           1 day ago\ns2i-v0-10-0                1 day ago\n<\/code><\/pre>\n
    \nTani le t\u00eb krijojm\u00eb dy detyra t\u00eb klasit. E para do t\u00eb gjeneroj\u00eb nj\u00eb imazh S2I dhe do ta d\u00ebrgoj\u00eb n\u00eb regjistrin e brendsh\u00ebm OpenShift; e dyta do t\u00eb kryej\u00eb nd\u00ebrtimin e imazhit ton\u00eb mbi baz\u00ebn e NGINX, duke p\u00ebrdorur si p\u00ebrmbajtje aplikacionin q\u00eb e kemi nd\u00ebrtuar tashm\u00eb.<\/p>\n
    Krijojm\u00eb dhe d\u00ebrgojm\u00eb imazhin<\/h4>\n
    \nKur krijojn\u00eb detyr\u00ebn e par\u00eb, ne do t\u00eb p\u00ebrs\u00ebrisim at\u00eb q\u00eb kemi b\u00ebr\u00eb n\u00eb artikullin e m\u00ebparsh\u00ebm p\u00ebr nd\u00ebrtimet e lidhura. Kujtojm\u00eb se ne p\u00ebrdor\u00ebm imazhin S2I (ubi8-s2i-web-app) p\u00ebr t\u00eb \"nd\u00ebrtuar\" aplikacionin ton\u00eb dhe p\u00ebrfundimisht mor\u00ebm nj\u00eb imazh q\u00eb ruhej n\u00eb registrin e brendsh\u00ebm OpenShift. Tani do t\u00eb p\u00ebrdorim k\u00ebt\u00eb imazh S2I t\u00eb aplikacionit web p\u00ebr t\u00eb krijuar DockerFile p\u00ebr aplikacionin ton\u00eb dhe pastaj do t\u00eb p\u00ebrdorim Buildah p\u00ebr t\u00eb kryer nd\u00ebrtimin real dhe duke d\u00ebrguar imazhin e fituar n\u00eb registrin e brendsh\u00ebm OpenShift, sepse kjo \u00ebsht\u00eb ajo q\u00eb OpenShift b\u00ebn kur ju vendosni aplikacionet tuaja duke p\u00ebrdorur NodeShift.<\/p>\n
    Po pyesni, nga kemi m\u00ebsuar t\u00eb gjitha k\u00ebto? Nga \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 official Node.js<\/a><\/noindex>, ne thjesht e kopjuam at\u00eb dhe e adaptuam sipas nevojave tona.<\/p>\n
    Tani, le t\u00eb krijojm\u00eb detyr\u00ebn e grupit s2i-web-app:<\/p>\n
    $ oc create -f https:\/\/raw.githubusercontent.com\/nodeshift\/webapp-pipeline-tutorial\/master\/clustertasks\/s2i-web-app-task.yaml\n<\/code><\/pre>\n
    \nNuk do ta shqyrtojm\u00eb k\u00ebt\u00eb n\u00eb detaje, por do t\u00eb ndalemi te parametri OUTPUT_DIR:<\/p>\n
    params:\n      - name: OUTPUT_DIR\n        description: Vendndodhja e direktoris\u00eb s\u00eb daljes s\u00eb nd\u00ebrtimit\n        default: build\n<\/code><\/pre>\n
    \nN\u00eb m\u00ebnyr\u00eb t\u00eb paracaktuar, ky paramet\u00ebr \u00ebsht\u00eb i barabart\u00eb me build, aty React vendos p\u00ebrmbajtjen e mbledhur. N\u00eb frameworke t\u00eb tjera p\u00ebrdoren rrug\u00eb t\u00eb ndryshme, p\u00ebr shembull, n\u00eb Ember \u00ebsht\u00eb dist. Dalja e detyr\u00ebs son\u00eb t\u00eb par\u00eb t\u00eb grupit do t\u00eb p\u00ebrb\u00ebj\u00eb nj\u00eb imazh q\u00eb p\u00ebrmban HTML, JavaScript dhe CSS t\u00eb mbledhura nga ne.<\/p>\n
    Nd\u00ebrtojm\u00eb nj\u00eb imazh mbi NGINX<\/h4>\n
    \nSa i p\u00ebrket detyr\u00ebs son\u00eb t\u00eb dyt\u00eb t\u00eb grupit, ajo duhet t\u00eb ndihmoj\u00eb n\u00eb nd\u00ebrtimin e nj\u00eb imazhi mbi NGINX, duke p\u00ebrdorur p\u00ebrmbajtjen e aplikacionit tan\u00eb tashm\u00eb t\u00eb mbledhur. N\u00eb thelb, kjo \u00ebsht\u00eb ajo pjes\u00eb e seksionit t\u00eb m\u00ebparsh\u00ebm ku shikuam nd\u00ebrtimet e lidhura.<\/p>\n
    P\u00ebr k\u00ebt\u00eb, ne \u2013 ashtu si m\u00eb sip\u00ebr \u2013 do t\u00eb krijojm\u00eb detyr\u00ebn e grupit webapp-build-runtime:<\/p>\n
    $ oc create -f https:\/\/raw.githubusercontent.com\/nodeshift\/webapp-pipeline-tutorial\/master\/clustertasks\/webapp-build-runtime-task.yaml\n<\/code><\/pre>\n
    \nN\u00ebse shikoni kodin e k\u00ebtyre detyrave t\u00eb grupit, do t\u00eb shihni se nuk specifikohet asnj\u00eb repo Git me t\u00eb cilin punojm\u00eb, ose emrat e imazheve q\u00eb krijojm\u00eb. Ne vet\u00ebm p\u00ebrcaktojm\u00eb at\u00eb q\u00eb ne kalojm\u00eb n\u00eb Git, ose nj\u00eb imazh, ku duhet t\u00eb d\u00ebrgohet imazhi p\u00ebrfundimtar. Pik\u00ebrisht p\u00ebr k\u00ebt\u00eb arsye, k\u00ebto detyra grupi mund t\u00eb p\u00ebrdoreshin p\u00ebrs\u00ebri dhe kur punon me aplikacione t\u00eb tjera.<\/p>\n
    Dhe k\u00ebtu kalojm\u00eb elegante n\u00eb pik\u00ebn e ardhshme...<\/p>\n
    Burime<\/h4>\n
    \nPra ndaj, pasi si\u00e7 tham\u00eb, detyrat n\u00eb klaster duhet t\u00eb jen\u00eb sa m\u00eb t\u00eb p\u00ebrgjithshme, na nevojitet t\u00eb krijojm\u00eb burime q\u00eb do t\u00eb p\u00ebrdoren n\u00eb hyrje (repo Git) dhe n\u00eb dalje (imazhe p\u00ebrfundimtare). Burimi i par\u00eb q\u00eb na nevojitet \u00ebsht\u00eb Git, ku ndodhet aplikacioni yn\u00eb, di\u00e7ka si kjo:<\/p>\n
    # This resource is the location of the git repo with the web application source\napiVersion: tekton.dev\/v1alpha1\nkind: PipelineResource\nmetadata:\n  name: web-application-repo\nspec:\n  type: git\n  params:\n    - name: url\n      value: https:\/\/github.com\/nodeshift-starters\/react-pipeline-example\n    - name: revision\n      value: master\n<\/code><\/pre>\n
    \nK\u00ebtu PipelineResource ka llojin git. \u00c7el\u00ebsi url n\u00eb seksionin params tregon p\u00ebr repo specific dhe vendos deg\u00ebn master (kjo \u00ebsht\u00eb opsionale, por e shkruajm\u00eb p\u00ebr plot\u00ebsi).<\/p>\n
    Tani, na nevojitet t\u00eb krijojm\u00eb nj\u00eb burim p\u00ebr imazhin ku do t\u00eb ruajm\u00eb rezultatet e ekzekutimit t\u00eb detyr\u00ebs s2i-web-app, kjo b\u00ebhet k\u00ebshtu:<\/p>\n
    # This resource is the result of running "npm run build",  the resulting built files will be located in \/opt\/app-root\/output\napiVersion: tekton.dev\/v1alpha1\nkind: PipelineResource\nmetadata:\n  name: built-web-application-image\nspec:\n  type: image\n  params:\n    - name: url\n      value: image-registry.openshift-image-registry.svc:5000\/webapp-pipeline\/built-web-application:latest\n<\/code><\/pre>\n
    \nK\u00ebtu PipelineResource ka llojin image, dhe vlera e parametrave url tregon p\u00ebr OpenShift Image Registry brendsh\u00ebm, specifikisht at\u00eb q\u00eb ndodhet n\u00eb hap\u00ebsir\u00ebn e em\u00ebrtes\u00ebs webapp-pipeline. Mos harroni t\u00eb ndryshoni k\u00ebt\u00eb parameter n\u00ebse p\u00ebrdorni nj\u00eb hap\u00ebsir\u00eb tjet\u00ebr em\u00ebrtes\u00eb.<\/p>\n
    Dhe, p\u00ebrfundimisht, burimi i fundit q\u00eb do t\u00eb na nevojitet, gjithashtu do t\u00eb ket\u00eb llojin image dhe do t\u00eb jet\u00eb imazhi p\u00ebrfundimtar NGINX, i cili do t\u00eb p\u00ebrdoret m\u00eb von\u00eb gjat\u00eb implementimit:<\/p>\n
    # This resource is the image that will be just the static html, css, js files being run with nginx\napiVersion: tekton.dev\/v1alpha1\nkind: PipelineResource\nmetadata:\n  name: runtime-web-application-image\nspec:\n  type: image\n  params:\n    - name: url\n      value: image-registry.openshift-image-registry.svc:5000\/webapp-pipeline\/runtime-web-application:latest\n<\/code><\/pre>\n
    \nDhe p\u00ebrs\u00ebri, mos harroni q\u00eb ky burim ruan imazhin n\u00eb registrin e brendsh\u00ebm t\u00eb OpenShift n\u00eb hap\u00ebsir\u00ebn e em\u00ebrtes\u00ebs webapp-pipeline.<\/p>\n
    P\u00ebr t\u00eb krijuar t\u00eb gjitha k\u00ebto burime nj\u00ebher\u00ebsh, do t\u00eb p\u00ebrdorim komand\u00ebn create:<\/p>\n
    $ oc create -f https:\/\/raw.githubusercontent.com\/nodeshift\/webapp-pipeline-tutorial\/master\/resources\/resource.yaml\n<\/code><\/pre>\n
    \nP\u00ebr t\u00eb verifikuar q\u00eb burimet jan\u00eb krijuar, mund ta b\u00ebni k\u00ebshtu:<\/p>\n
    $ tkn resource ls\n<\/code><\/pre>\n
    <\/p>\n
    Pipeline-i<\/h4>\n
    \nTani q\u00eb kemi t\u00eb gjitha komponent\u00ebt e nevojsh\u00ebm, do t'i grumbullojm\u00eb ato duke krijuar pipeline-in me komand\u00ebn e m\u00ebposhtme:<\/p>\n
    $ oc create -f https:\/\/raw.githubusercontent.com\/nodeshift\/webapp-pipeline-tutorial\/master\/pipelines\/build-and-deploy-react.yaml\n<\/code><\/pre>\n
    \nPor, para se ta ekzekutojm\u00eb k\u00ebt\u00eb komand\u00eb, le t\u00eb shohim k\u00ebta komponent\u00eb. I pari \u00ebsht\u00eb emri:<\/p>\n
    apiVersion: tekton.dev\/v1alpha1\nkind: Pipeline\nmetadata:\n  name: build-and-deploy-react\n<\/code><\/pre>\n
    \nPastaj n\u00eb seksionin spec shohim tregimin e burimeve q\u00eb krijuam m\u00eb par\u00eb:<\/p>\n
    spec:\n  resources:\n    - name: web-application-repo\n      type: git\n    - name: built-web-application-image\n      type: image\n    - name: runtime-web-application-image\n      type: image\n<\/code><\/pre>\n
    \nPastaj krijojm\u00eb detyrat q\u00eb duhet t\u00eb kryej\u00eb pipeline-i yn\u00eb. E para q\u00eb duhet t\u00eb ekzekutoj\u00eb \u00ebsht\u00eb detyra s2i-web-app q\u00eb kemi krijuar m\u00eb par\u00eb:<\/p>\n
    tasks:\n    - name: build-web-application\n      taskRef:\n        name: s2i-web-app\n        kind: ClusterTask\n<\/code><\/pre>\n
    \nKjo detyr\u00eb merr parametrat hyr\u00ebs (burimi git) dhe dal\u00ebs (burimi built-web-application-image). Ne gjithashtu i p\u00ebrcjellim nj\u00eb parameter t\u00eb ve\u00e7ant\u00eb q\u00eb nuk verifikon TLS, pasi p\u00ebrdorim certifikata t\u00eb vet\u00eb-n\u00ebnshkruara:<\/p>\n
    resources:\n        inputs:\n          - name: source\n            resource: web-application-repo\n        outputs:\n          - name: image\n            resource: built-web-application-image\n      params:\n        - name: TLSVERIFY\n          value: \"false\"\n<\/code><\/pre>\n
    \nDetyra e ardhshme \u00ebsht\u00eb pothuajse e nj\u00ebjt\u00eb, vet\u00ebm se k\u00ebtu thirret detyra e klasterizuar e krijuar prej nesh webapp-build-runtime:<\/p>\n
    emri: build-runtime-image\n    referenc\u00eb e detyr\u00ebs:\n      emri: webapp-build-runtime\n      lloji: ClusterTask\n<\/code><\/pre>\n
    \nSi me detyr\u00ebn e m\u00ebparshme, ne kalojm\u00eb burimin, por tani \u00ebsht\u00eb built-web-application-image (dalja e detyr\u00ebs son\u00eb t\u00eb m\u00ebparshme). Dhe si dalje p\u00ebrs\u00ebri p\u00ebrcaktojm\u00eb imazhin. Duke qen\u00eb se kjo detyr\u00eb duhet t\u00eb ekzekutohet pas asaj t\u00eb m\u00ebparshme, shtojm\u00eb fush\u00ebn runAfter:<\/p>\n
    resources:\n        inputs:\n          - name: image\n            resource: built-web-application-image\n        outputs:\n          - name: image\n            resource: runtime-web-application-image\n        params:\n        - name: TLSVERIFY\n          value: \"false\"\n      runAfter:\n        - build-web-application\n<\/code><\/pre>\n
    \nDy detyrat e ardhshme jan\u00eb p\u00ebrgjegj\u00ebse p\u00ebr aplikimin e skedar\u00ebve YAML t\u00eb sh\u00ebrbimit, rrug\u00ebs dhe implementimit, t\u00eb cilat jetojn\u00eb n\u00eb katalogun k8s t\u00eb aplikacionit ton\u00eb t\u00eb uebit, si dhe p\u00ebr t\u00eb p\u00ebrdit\u00ebsuar k\u00ebt\u00eb implementim kur krijohen imazhe t\u00eb reja. K\u00ebto dy detyra klasterizuar i kemi caktuar q\u00eb her\u00ebt gjat\u00eb artikullit.<\/p>\n
    Fillimi i konvejrit<\/h4>\n
    \nPra, t\u00eb gjitha pjes\u00ebt e konvejrit ton\u00eb jan\u00eb krijuar, dhe ne do ta fillojm\u00eb at\u00eb me komand\u00ebn e m\u00ebposhtme:<\/p>\n
    $ tkn pipeline start build-and-deploy-react\n<\/code><\/pre>\n
    \nN\u00eb k\u00ebt\u00eb pik\u00eb, struktura komand\u00eb p\u00ebrdoret n\u00eb modin interaktiv dhe duhet t\u00eb zgjidhen burimet p\u00ebrkat\u00ebse n\u00eb p\u00ebrgjigje t\u00eb \u00e7do k\u00ebrkese t\u00eb saj: p\u00ebr burimin git zgjidhim web-application-repo, pastaj p\u00ebr burimin e imazhit t\u00eb par\u00eb \u2013 built-web-application-image, dhe, p\u00ebrfundimisht, p\u00ebr burimin e imazhit t\u00eb dyt\u00eb \u2013 runtime-web-application-image:<\/p>\n
    ? Choose the git resource to use for web-application-repo: web-application-repo (https:\/\/github.com\/nodeshift-starters\/react-pipeline-example)\n? 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-\napplication:latest)\n? 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\ne-web-application:latest)\nPipelinerun started: build-and-deploy-react-run-4xwsr\n<\/code><\/pre>\n
    \nTani do t\u00eb kontrollojm\u00eb statusin e konvejrit me komand\u00ebn e m\u00ebposhtme:<\/p>\n
    $ tkn pipeline logs -f\n<\/code><\/pre>\n
    \nPas niste si konvejeri dhe aplikacioni \u00ebsht\u00eb implementuar, do t\u00eb k\u00ebrkojm\u00eb rrug\u00ebn e publikuar me komand\u00ebn e m\u00ebposhtme:<\/p>\n
    $ oc get route react-pipeline-example --template='http:\/\/{{.spec.host}}'\n<\/code><\/pre>\n
    \nP\u00ebr m\u00eb shum\u00eb vizibilitet, mund t\u00eb shohim konvejerin ton\u00eb n\u00eb modin Developer t\u00eb konsol\u00ebs n\u00eb internet n\u00eb seksionin Pipeline<\/b>, si\u00e7 \u00ebsht\u00eb treguar n\u00eb Figur\u00ebn 1.<\/p>\n
    \"Aplikacionet<\/p>\n
    Fig.1. P\u00ebrmbledhje e konvejr\u00ebve t\u00eb nisur.<\/i><\/p>\n
    Klikimi mbi konvejerin e nisur shfaq detaje t\u00eb tjera, si\u00e7 \u00ebsht\u00eb treguar n\u00eb Figur\u00ebn 2.<\/p>\n
    \"Aplikacionet<\/p>\n
    Fig. 2. Detaje t\u00eb tjera mbi konvejerin.<\/i><\/p>\n
    Pas detajeve t\u00eb tjera, mund t\u00eb shohim aplikacionet e nisura n\u00eb pamjen Topology<\/b>, si\u00e7 \u00ebsht\u00eb treguar n\u00eb Figur\u00ebn 3.<\/p>\n
    \"Aplikacionet<\/p>\n
    Fig 3. Pod-i i nisur.<\/i><\/p>\n
    Klikimi n\u00eb rrethin n\u00eb k\u00ebndin e sip\u00ebrm t\u00eb djatht\u00eb t\u00eb ikon\u00ebs hap aplikacionin ton\u00eb, si\u00e7 \u00ebsht\u00eb treguar n\u00eb Figur\u00ebn 4.<\/p>\n
    \"Aplikacionet<\/p>\n
    Fig. 4. Aplikacioni React i nisur.<\/i><\/p>\n
    P\u00ebrfundim<\/h3>\n
    \nPra t\u00eb arritje, ne treguam se si t\u00eb ndizni nj\u00eb server zhvillimi p\u00ebr aplikacionin tuaj n\u00eb OpenShift dhe ta sinkronizoni at\u00eb me sistemin tuaj t\u00eb skedar\u00ebve lokal. Gjithashtu, ne shqyrtuam se si t\u00eb simulojm\u00eb nj\u00eb template t\u00eb nd\u00ebrlidhur t\u00eb nd\u00ebrtimit p\u00ebrmes OpenShift Pipelines. T\u00eb gjith\u00eb kodet e shembujve nga ky artikull mund t\u00eb gjenden k\u00ebtu<\/a><\/noindex>.<\/p>\n
    Burime t\u00eb tjera (EN)<\/h3>\n
    <\/p>\n