I learnedwhattheremyselfthroughFreakOh, Capthreeyearsago, andbackthen, I actuallystruggled a lotwithgettingmyprojectsonlineatfirstthroughCloudnine.
AndthenHirokoand I onlyfoundnullify a yearlaterandrealizedthedeployingandscalingis a loteasierwiththejabstackapproach, especiallywithmodernfrontandframeworkslikereactinview.
SothisisthevideoSiri's I wish I hadwhen I startedout.
I hopeyouenjoy.
So I kindofbreakdowntheoverallstructureoftheseriesintonineparts.
Thisisentirelywithinyourlocalmachineandthe, andtheideaistomakeit a loteasiertotestserverlessfunctionstogetherwithyourlocaldevenvironmentwithhotreloadingaswellasanythingelsethatyoumightneedtosimulateyourrealproductionenvironment.
Thenwe'lltake a lookatnullifyforms, andthiscoverstheusecasewhereyouthinkyoumayneed a server.
Butactuallyyoujustwanttohavesomebasicformsubmissioncapability, like a commentsystem, peopleleaving a contactformorevenfileuploads.
AndthenyouwanttodosomebasicautomationwiththatwithZapphereor a servicefunctionorothersortofWebhooks, andwe'llshowyouhowtodothatinsimpleHTMLaswell.
A singlepageJapsandstaticsitegenerators.
Theyweregoingtotake a lookatnullifyidentity, whichhelpsyouaddauthenticationandauthorizationtoyoursite, andthiscouldbeveryusefulforabsentyoucommercesolutions.
Andinparticular, youcanuse a droppingwidgetsoyoudon't havetocallituptoyou.
I oryoucanusesomethinglowerlevelthatactuallygivesyouthecorefunctionality, andyoucancodeyou'reyouontopofit.
Andthat's why I knowif I has a verywonderfulopensourceprojectcalledNullifyCMS, andwe'lltalkabouthowtosetitupaswellaswhatitdoessoyoucanvalidateforyourselfifyouwanttouseitoruseanyoftheother.
HeadofCMSisoutthere.
We'rethengonnatalkaboutNelle.
If I addons, whicharealltheotherfunctionalityofnullified.
And a lotofusershaveandfinallywillendwithpointersforlearningmoreaboutnullifyandjabstackandwhereyoucangethelpifyourunintotrouble.
Sohopefullythat's a goodoverviewofwhatwe'regonnabedoingtodayandlet's startdivingin.
They're a fewwaystodeploytonullifynownullifydropisnotthemostimportantway, but I finditusefultoexplainthisfirstbecauseithelpsexplainthehistoryofnullify.
AndsoisthefundamentalconceptofJanStack.
SoNelle, if I startedlifeas a companycalledbitBalloonandbyballoon, was a simpleservicewhereyoucoulddraganddroplike a folderonyourdesktop, dragitontobitballoons, webyou y, andhaveitbedeployedimmediatelyonto a CDen.
Andtothisday, thatisnowif I drop.
Andsothatisthefundamentalconceptofnullifyingthateverythingthatyoudeploytonullifyaestheticassetsandnullifytakescareofdeployingiton a CDensoallthepointsofpresencearoundtheworldsothatyourusersgetthemasquicklyashumanlypossible.
Thingisnowif I deploybutitpushesitdirectlyinsteadof a draft, yourallypushesitdirectly.
Soherewehave a liveeurope.
Soifyouclickthis, uh, weshouldbeabletoseetheCLIrulesonthemeansonthemaineuroinsteadofthedraftEuropeagainrememberthateachofthesedeploymentsisimmutable, soyoucanrollbacktoitorgiveuh, givethisas a linkto a friendsorcolleaguesforreviewingwhatevercontentorcochanges.
Younoticethatthekeyspromptingmefor a deploypathifyouwanttoactuallyjusthardcoatthatthey're a fewdifferentwaystodoit.
Butthewaythat I wouldrecommendistocreateanotherfindoutTomwillfile.
So I'm gonnaexitoutofthisprocess, and I'm gonnacreate a numberfive.
Sothisisanexamplenullifydotcom O that I havejustsavedmycopyofmyclipboardmanager.
Nowyounoticeonenewfolderthatwascreatedthat I haven't explainedyetisthedotnetloFifolder.
Itreallyisjust a simplelittleJasonfilethatstoreswhereyouhavelinkedwhatsiteyou'velinkedtheprojecttoo.
So, forexample, ifoverhere I runnullifystatus, youcanactuallyseenotjustmylogininformation, butwhichsitethisparticularfolderthisparticularprojecthasbeenlinkedto.
Andonceyouclickthatsite, youshouldbeabletoseenullifyfromgetdirectlyaspushedfromourlocaldirectlocaldevelopmenttogethomefromgoodhugpulledintoLet's have a lookatwhatcontinuousdeploymentworkflowlookslike.
So I'm gonnagoovertomyemployeesview, andthen I'm alsogoingtogotomyproject.
I'm goingtosay I'm gonnamakesomeeditsaswell.
So I'm goingtosayintonewwasAppointmentisthebestbecauseitis.
SonowSonowthatthere's nobilltime, Soitjustbasicallydeployedimmediatelyand, uhandsonowwhen I hitbacktotheoriginalsitegoofyAustin A e, I canseebestoverandgethome.
I canalsorefreshandseemychangedoneinhere, andthat's continuousappointment.
Andsonowwe'redonetalkingaboutwaystodeploythingsonnullifynoticethatwehaven't talkedaboutbuildbecausethat's a differentstageofthedeploycyclewhereyoumayhavetosendtheBillCommandandwe'llcometothatin a bit.
But I wantedtospendsometimetalkingaboutwhatyougetbydefaultbecausetheseairthingswherethere's nothingtocoverbecauseyougotitbythefallalready.
Butyoucanseethatautomaticallysomethingshappenthatyoumaynotnecessarilyhaving a normalsight.
Andsothisis a deploypreviewbasicallysayingthateven a PRwhichhasn't beenmurdered, I canactuallycheckoutoverherewhereitsaysawesomenewfeatureandithas, anditgivesme a labelofdeploypreviewone.
Andthatis a previewthat I cansharewithmyclientsormyColbert.
If I were, youcanlookatLookatwhatpageshavechangedinparticular, andthatshouldbeexactlywhatdoyouexpectintermsofpages.
Onceyou'rehappywithyourpreview, youcanmergeitin, andthatshouldalsokickoff a newbuildonthemasterback.
Sothat's a veryniceworkflowfrompreviewingthenewfeaturebeforeyoumergeandthenmergingitonceyou'rehappyandhavingyourcustomersseeiftheirdefaulttoknowaboutisthatnullifies a seedyendbythephone.
Soallofyourdeploys a distributedtothenearestwenttopresence.
Thisisobviously a superspyonsite, soitdoesn't matter, butyoumayneedyoumaywanttohavethison a largersite.
So, forexample, wecouldmodifytheCSS, oralsoifwehadanyJavaScriptfiles, wecanalsomodifythatanddo a bunchofotherhygienicthingstocleanupthewaythatweoptimizerassets.
Butsometimesandsometimesyouwanttodoredirectsaroundwhattheinternalyour l structureofyourpagesarewecoveredthataslongashowtodocatchALSforfourfours.
Wealsocoveredhowthelinkupcupsthatcustomdomainsaswellas a littlebitaboutnullifiedtheNS.
Andhow, if I canmanage a densforyouifyouchoosetohaveit, youcanalsosetupBranchdeploysforManageDennisifyou'reusingnullifydinner, sothat's thescopeofdeployingandnullifyandinothervideoswillcovertheothersections.
Let's takeourexistingsitethatwe'vebeenworkingonfrompartone, andit's add a buildprocesstoit.
Sorightnow I havethisfolder, whichis a discfolder, andit's got a bunchofindexHTMLfilesandlet's say I wanttoaddsomeJavascripttoittowritesomeinteractivecomponent.
What I'm gonnadois I'm goingtoaddthebart, theparcelbundler, sothatwouldbeourfirst.
I havetoinitiateinitializethepackage.
Stop, Jason.
UmAndthen I havetoaddtheparcelbundler.
Andwhilethat's goingon, I canalsoinstallreactswehavedonebecause I'm gonnausethataswell.
Sohere.
We'renotusing a staticsidegenerator, butwe'reusingusing a billprocess.
AndtheCenexoriginatorisjust a massive.
Sonowwe'vegotthedependenciesinstalled.
We'regonnarearrangethis a littlebit.
So I'm gonnatakethisthisfolderandrenameitssource, andwe'regonnabuildfromthesourcetothedeskfolder.
I'm gonnaadd a newfoldercalledIndexGs, forexample.
I'm gonnapasteinsomeprepreparedreactscode, and I'm goingtogotoindexdothtmlandaddscriptthat I d thoseabsandthen I'm gonnaadd a scripttagbottomsayingspiritsource.
Sonowwhen I runyarnparcelsoorindexstarteast, youknow I get a nicelocalserverwhere I canseetheresultsofmycodesayshellofromreact, and I canactuallyclickinteractive, Butso I knowthat I'veaddedsomeJavascripttomystaticsite.
Sothisiswonderfulnews.
Um, andweneedtoactuallymakethisruninproduction.
So I'm gonnacancelmybreadingprocess.
I'm gonnagoovertopackageJasonandmakelife a littlebiteasierformewithsome M p m scripts.
That's theonehappenswhenwepushourlatestchangestogetwecanseethatallbuildhasfailedbecausethistimewedon't have a disdirectoryanymore.
Remember, weaddedthattogetignorebecausewe'renotbuildingfrom a sourcedirectory, thatmeansthatweneedtorunthebuildcommandinourdeploymentenvironmenttosetupcontinuousdeployment.
Andit's showingusrunningthebuildduringtheoutputofthebuildandthensaving a bunchofdependenciesanddeployingsitefromdist.
Sooverhere, ifyouwanttocheckoutthedeploy, openthisin a newtabandcheckouthowthisreactscodeisnowinproductionontheproductionnullifysite, andit's usingtheproductionbuildingforyet.
Sothat's allwellandgood.
Butthere's a secondweektosetBillCommand, andthat's it.
Neverfindout.
Tom, thisis a higherprioritygrant.
Soitactuallyoverrideswhatwehadbefore.
So I'm gonnacommentitout, andthisishowitshouldlookunderthebuildsettingsyoushouldadd a commandequalsandthenwhateverstringyouwanttorunyourownbuildingsothiscantakeanyform.
I'm gonnacommitittogetandbuilddemand, and I'm gonnapushittothemasterandthatwillkickoffthebuildagaininNell.
If I noticethatthistimethereis a specialmessage, putitoverheresayingthere's differentBillCommanddetectivegoingtousetheonespecifiedinthetumblefileyourownbuildversusyarnrunbuilt.
Itgoesinto a littlebitabouttheoriginofthebill, boughtsomedefaultenvironmentsettingsandversionsthatyoumaywanttoknowabout, butbasicallythehighlevelconceptthatyoushouldknowisthatthebillbutisbasically a doctorcontainer.
OurCTOusedtowork a doctor, andsowe'reveryfamiliarwiththistechnology, anditgivesus a lotofnicesecurityandreproductioncapabilitiesthatisveryhelpfulincreatingcontinuousdeploymentservicelikemetal.
Ifyou'rewatchingthisvideo, andthecurrentsiteshavethes e nialbuildimage.
Andthat's, uh, themorecurrentoftodateversion.
Youcanseethebranchesaccordingly.
Thereisongoingworkonnew a newversionofthebill, butsobythetimeyouwatchthisvideo, theremaybe a newversionavailable, buthopefully I'llalsohave a newvideooutbythencoveringthat.
YoucanjustcurlyourvariousenvironmentsandstartedincashBasicallyanythingthatyoucandoin a typicalbashenvironment, youcandoyouknow, if I, umthenwegettotheactualbillprocess.
That's wherewerunyourbillCommand, ifyouhaveone.
Obviously, wedidthefirstpartofthevideoentirelywithout a billprocess.
Um, we'regoingtosavethedependenciesforthenextbuild, andwe'regonnaallput a manifestyoucan't seeoverhere.
Butthere's a manifestofwhathasbeenproducedsothatwecandogiftsandsothatwecanproduceimagessothatwecanproducesummaryinformationlikethisshowingyouwhatfilesandwhatredirectruleshavechangedandhavebeenprocessedbyBill.