Ukuntu wumva kwiga JavaScript muri 2016

Nta bikoresho bya JavaScript byakozwe mugihe cyo kwandika iyi ngingo.

Ibikurikira byahumetswe ningingo “Ni ejo hazaza” yo mu ruziga CI. Urashobora gusoma umwimerere hano . Iki gice nigitekerezo gusa, kandi nkibikorwa byose bya JavaScript, ntibigomba gufatanwa uburemere cyane.

Hey, nabonye uyu mushinga mushya wurubuga, ariko mvugishije ukuri ntabwo maze imyaka mike nandika code nyinshi kandi numvise ibibanza byahindutse gato. Wowe uri web igezweho kurubuga dev hafi hano?

-Ijambo nyirizina ni Front End injeniyeri, ariko yego, Ndi umusore ukwiye. Nkora urubuga muri 2016. Visualisations, abacuranga umuziki, drone ziguruka zikina umupira, urabyita. Gusa nagarutse mvuye muri JsConf na ReactConf, nzi rero tekinoroji igezweho yo gukora porogaramu zurubuga.

Cool. Nkeneye gukora page yerekana ibikorwa biheruka kubakoresha, nkeneye gusa kubona amakuru kuva kumpera ya REST hanyuma nkayerekana muburyo bumwe bwo kuyungurura, no kuyivugurura niba hari icyahindutse muri seriveri. Natekerezaga wenda gukoresha jQuery kuzana no kwerekana amakuru?

-Mana yanjye oya, ntamuntu ukoresha jQuery ukundi. Ugomba kugerageza kwiga React, ni 2016.

Yego. Bite?

-Ni isomero ryiza cyane ryakozwe nabasore bamwe kuri Facebook, rwose rizana kugenzura no gukora mubikorwa byawe, mukwemerera gukemura impinduka zose zo kureba byoroshye.

Ibyo byumvikana neza. Nshobora gukoresha React kwerekana amakuru kuva muri seriveri?

-Yego, ariko ubanza ugomba kongeramo React na React DOM nkisomero kurubuga rwawe.

Tegereza, kuki amasomero abiri?

-Nuko rero isomero nyirizina naho irya kabiri ni iyo gukoresha DOM, ubu ushobora gusobanura muri JSX.

JSX? JSX ni iki?

-JSX niyagurwa rya syntax ya JavaScript gusa isa na XML. Nubundi buryo bwo gusobanura DOM, tekereza nka HTML nziza.

Niki kibi kuri HTML?

-Ni 2016. Ntamuntu ukandika HTML mu buryo butaziguye.

Iburyo. Ibyo ari byo byose, niba nongeyeho aya masomero yombi noneho nshobora gukoresha React?

-Ntabwo rwose. Ugomba kongeramo Babel, hanyuma urashobora gukoresha React.

Irindi somero? Babeli ni iki?

-Oh, Babel ni transpiler igufasha guhitamo verisiyo yihariye ya JavaScript, mugihe wanditse muri verisiyo iyo ari yo yose ya JavaScript. Ntugomba gushyiramo Babel kugirango ukoreshe ReactJS, ariko keretse ubikoze, watsimbaraye ku gukoresha ES5, kandi reka tube impamo, ni 2016, ugomba kuba wandika muri ES2016 + nkuko abandi bana bakonje babikora.

ES5? ES2016 +? Ndimo kuzimira hano. ES5 na ES2016 + ni iki?

-ES5 bisobanura ECMAScript 5.Ni verisiyo ifite abantu benshi bagamije kuva yashyizwe mubikorwa nabashakisha benshi muri iki gihe.

ECMAScript?

-Yego, urabizi, inyandiko isanzwe ya JavaScript yashingiweho mu 1999 nyuma yo gusohoka bwa mbere mu 1995, icyo gihe ubwo JavaScript yitwaga Livescript kandi ikorera muri Netscape Navigator gusa. Ibyo byari akajagari cyane icyo gihe, ariko dushimire ubu ibintu birasobanutse neza kandi dufite, nkibisobanuro 7 byashyizwe mubikorwa.

Inyandiko 7. Mubyukuri. Kandi ES5 na ES2016 + ni?

-Icyiciro cya gatanu n'icya karindwi.

Tegereza, byagenze bite na gatandatu?

-Urashaka kuvuga ES6? Yego, ndashaka kuvuga, buri cyegeranyo ni superset yicyambere, niba rero ukoresha ES2016 +, ukoresha ibintu byose biranga verisiyo zabanjirije iyi.

Iburyo. Kandi kuki ukoresha ES2016 + hejuru ya ES6 noneho?

-Nibyiza, URASHOBORA gukoresha ES6, ariko kugirango ukoreshe ibintu byiza nka async ugategereza, ugomba gukoresha ES2016 +. Bitabaye ibyo, wiziritse kuri generator ya ES6 hamwe na coroutine kugirango uhagarike guhamagarwa kwa asinchronous guhamagarira kugenzura neza.

Ntabwo nzi ibyo umaze kuvuga, kandi aya mazina yose arimo urujijo. Reba, ndimo gupakira gusa amakuru menshi muri seriveri, nigeze kubasha gushyiramo jQuery gusa muri CDN nkabona gusa amakuru hamwe na AJAX guhamagara, kuki ntashobora kubikora gusa?

-Ni umugabo wa 2016, ntamuntu ukoresha jQuery ukundi, birangirira muri kode ya spaghetti. Abantu bose barabizi.

Iburyo. Ubundi buryo bwanjye ni ugupakira amasomero atatu kugirango uzane amakuru kandi werekane imbonerahamwe ya HTML.

-Nibyiza, ushizemo ayo masomero atatu ariko uyahuze hamwe numuyobozi wa module kugirango yikore dosiye imwe gusa.

Ndabona. Numuyobozi ushinzwe module niki?

-Ibisobanuro biterwa nibidukikije, ariko mururubuga dusanzwe dushaka kuvuga ikintu cyose gishyigikira AMD cyangwa CommonJS modules.

Riiight. Kandi AMD na CommonJS ni…?

-Ibisobanuro. Hariho uburyo bwo gusobanura uburyo amasomero menshi ya JavaScript n'amasomo bigomba gukorana. Urabizi, ibyohereza hanze kandi bisaba? Urashobora kwandika dosiye nyinshi za JavaScript zisobanura AMD cyangwa CommonJS API kandi urashobora gukoresha ikintu nka Browserify kugirango ubihuze.

Nibyo, ibyo birumvikana… Ndatekereza. Browserify ni iki?

-Ni igikoresho kigufasha guhuza CommonJS yasobanuye biterwa na dosiye zishobora gukoreshwa muri mushakisha. Byaremewe kuko abantu benshi batangaza ibyo biterwa muri rejisitiri ya npm.

npm kwiyandikisha?

-Ni ububiko bunini rusange aho abantu bajijutse bashira code hamwe nubwishingizi nka module.

Nka CDN?

-Ntabwo rwose. Birasa cyane nububiko bwibanze aho umuntu wese ashobora gutangaza no gukuramo amasomero, urashobora rero kuyakoresha mugace ka majyambere hanyuma ukayashyira kuri CDN niba ubishaka.

Oh, nka Bower!

-Yego, ariko ni 2016 ubungubu, ntamuntu ukoresha Bower ukundi.

Oh, ndabona… none nkeneye gukuramo amasomero guhera npm noneho?

-Yego. Kurugero rero, niba ushaka gukoresha React, ukuramo module ya React hanyuma ukayitumiza muri code yawe. Urashobora kubikora hafi yububiko rusange bwa JavaScript.

Oh, nka Angular!

-Icyongereza ni 2015. Ariko yego. Angular yaba ihari, hamwe na VueJS cyangwa RxJS nandi masomero meza ya 2016. Urashaka kwiga kubyerekeye?

Reka dukomere kuri React, nsanzwe niga ibintu byinshi cyane ubu. Noneho, niba nkeneye gukoresha React ndayizana muriyi npm hanyuma nkoreshe iki kintu cya Browserify?

-Yego.

Ibyo bisa nkibigoye cyane gufata gusa ibintu biterwa no kubihuza.

-Niyo, niyo mpamvu ukoresha umuyobozi ushinzwe imirimo nka Grunt cyangwa Gulp cyangwa Broccoli kugirango uhindure gukora Browserify. Heck, ushobora no gukoresha Mimosa.

Grunt? Gulp? Broccoli? Mimosa? Ubu turavuga?

-Babaza abayobozi. Ariko ntibakonje. Twabakoresheje nka, 2015, hanyuma dukoresha Makefiles, ariko ubu turapfunyika byose hamwe na Webpack.

Makile? Natekereje ko ahanini byakoreshwaga kumishinga C cyangwa C ++.

-Yego, ariko ikigaragara kurubuga dukunda gukora ibintu bigoye hanyuma tugasubira mubyibanze. Turabikora buri mwaka cyangwa hafi, gusa utegereze, tugiye gukora inteko kurubuga mumwaka umwe cyangwa ibiri.

Kuniha. Wavuze ikintu cyitwa Webpack?

-Ni iyindi module umuyobozi wa mushakisha mugihe ari ubwoko bwimikorere nayo. Ninkindi verisiyo nziza ya Browserify.

Yego, Ok. Kuki ari byiza?

-Nibyiza, birashoboka ko atari byiza, biratekerezwa gusa kuburyo ibyo wishingikirije bigomba guhuzwa. Webpack igushoboza gukoresha module zitandukanye, kandi ntabwo ari CommonJS gusa, kurugero rero kavukire ya ES6 kavukire.

Ndumiwe cyane nibintu byose bya CommonJS / ES6.

-Buriwese ni, ariko ntugomba kubyitaho hamwe na SystemJS.

Yesu kristo, irindi zina-js. Ok, kandi iyi SystemJS ni iki?

-Nibyiza, bitandukanye na Browserify na Webpack 1.x, SystemJS numusemburo wa module yingirakamaro igufasha guhuza modules nyinshi mumadosiye menshi aho kuyahuza muri dosiye imwe nini.

Tegereza, ariko natekereje ko dushaka kubaka amasomero yacu muri dosiye nini hanyuma tukayikorera!

-Yego, ariko kubera ko HTTP / 2 ije ubu ibyifuzo byinshi bya HTTP mubyukuri nibyiza.

Tegereza, none ntidushobora kongeramo amasomero atatu yumwimerere ya Reaction ??

-Ntabwo rwose. Ndashaka kuvuga, ushobora kubongeramo nkimyandikire yo hanze ya CDN, ariko uracyakeneye gushiramo Babel noneho.

Kuniha. Kandi ibyo ni bibi?

-Yego, waba ushizemo babel-core yose, kandi ntabwo byakorwa neza. Ku musaruro ugomba gukora urukurikirane rwimirimo ibanziriza kugirango umushinga wawe witegure utuma umuhango wo guhamagara Satani usa nkamagi yatetse. Ugomba kugabanya umutungo, kubihindura, kumurongo css hejuru yububiko, gusubika inyandiko, kimwe na-

Nabonye, Nabonye. Noneho niba udashyizemo amasomero muri CDN, wabikora ute?

-Nabimura muri Typescript nkoresheje Webpack + SystemJS + Babel combo.

Imyandikire? Natekereje ko twandika muri JavaScript!

-Ubwanditsi ni JavaScript, cyangwa shyira neza, superset ya JavaScript, cyane cyane JavaScript kuri verisiyo ya ES6. Urabizi, iyo verisiyo ya gatandatu twavuze mbere?

Natekereje ko ES2016 + yari isanzwe ari superset ya ES6! KUKI dukeneye ubu iki kintu cyitwa Typescript?

-Oh, kuko itwemerera gukoresha JavaScript nkururimi rwanditse, no kugabanya amakosa yo gukora-igihe. Ni 2016, ugomba kongeramo ubwoko bumwe kuri kode ya JavaScript.

Kandi Imyandikire biragaragara ko ibikora.

-Fata kandi, nubwo igenzura gusa kwandika mugihe Typescript ari superset ya JavaScript igomba gukusanywa.

Kuniha… na Flow ni?

-Ni cheque yubwoko bwa static ikorwa nabasore bamwe kuri Facebook. Barayanditse muri OCaml, kuko programming ikora ni nziza.

OCaml? Porogaramu ikora?

-Ni iki abana bakonje bakoresha muri iki gihe man, urabizi, 2016? Porogaramu ikora? Imikorere yo murwego rwohejuru? Kurry? Imikorere itanduye?

Sinzi icyo wavuze.

-Nta muntu ubikora mu ntangiriro. Reba, ukeneye kumenya gusa ko programming ikora iruta OOP kandi nibyo twakagombye gukoresha muri 2016.

Tegereza, nize OOP muri kaminuza, natekereje ko aribyiza?

-Nuko rero yari Java mbere yo kugurwa na Oracle. Ndashaka kuvuga, OOP yari nziza muminsi, kandi iracyafite imikoreshereze uyumunsi, ariko ubu abantu bose barabona ko guhindura leta bihwanye no gukubita abana, ubu rero buriwese yimukira mubintu bidahinduka hamwe na programme ikora. Abasore ba Haskell bari bamaze imyaka bahamagara, -kandi ntuntangire nabasore ba Elm- ariko kubwamahirwe kururubuga ubu dufite amasomero nka Ramda atwemerera gukoresha programme ikora muri JavaScript isanzwe.

Urimo guta amazina gusa kubwibyo? Ramnda ni iki?

-Oya. Ramda. Nka Lambda. Urabizi, isomero rya David Chambers?

Dawidi ninde?

-Icyumba cya David. Umusore mwiza. Gukina umukino usobanutse. Umwe mubaterankunga kuri Ramda. Ugomba kandi kugenzura Erik Meijer niba uri serieux yo kwiga programming ikora.

Erik Meijer ni…?

-Umusore ukora progaramu ya progaramu nayo. Umusore mwiza. Afite udutsiko twerekana aho yanduza Agile mugihe akoresha iyi shati idasanzwe. Ugomba kandi kugenzura bimwe mubintu biva muri Tj, Jash Kenas, Sindre Sorhus, Paul Irlande, Addy Osmani-

Ok. Ngiye kuguhagarika aho. Ibintu byose nibyiza kandi byiza, ariko ndatekereza ko ibyo byose bigoye cyane kandi bitari ngombwa kugirango uzane amakuru gusa no kuyerekana. Nzi neza ko ntakeneye kumenya aba bantu cyangwa kwiga ibyo bintu byose kugirango nkore imbonerahamwe ifite amakuru yingirakamaro. Reka dusubire kuri Reaction. Nigute nshobora kuzana amakuru muri seriveri hamwe na Reaction?

-Nibyiza, mubyukuri ntabwo uzana amakuru hamwe na React, werekana gusa amakuru hamwe na Reaction.

Nyamuneka. Niki ukoresha kugirango uzane amakuru?

-Ukoresha Fetch kugirango uzane amakuru muri seriveri.

Mbabarira? Ukoresha Fetch kugirango uzane amakuru? Umuntu wese uvuga ibyo bintu akeneye thesaurus.

-Nzi neza? Fetch nizina ryibikorwa kavukire byo gukora XMLHttpRequests kurwanya seriveri.

Yego, AJAX.

-AJAX nugukoresha gusa XMLHttpRequests. Ariko byanze bikunze. Fetch igufasha gukora AJAX ishingiye kumasezerano, noneho urashobora kwiyemeza kwirinda ikuzimu.

Hamagara ikuzimu?

-Yego. Igihe cyose ukoze icyifuzo kidahuje na seriveri, ugomba gutegereza igisubizo cyacyo, hanyuma kigutera kongeramo imikorere mumikorere, aricyo bita callback pyramide iva ikuzimu.

Yego, Ok. Kandi iki kintu cyamasezerano kiragikemura?

-Byingenzi. Ukoresheje ibyo wahamagaye ukoresheje amasezerano, urashobora kwandika byoroshye kumva code, gushinyagura no kubagerageza, kimwe no gukora icyarimwe icyarimwe hanyuma ugategereza kugeza byose byuzuye.

Kandi ibyo birashobora gukorwa na Fetch?

-Yego, ariko gusa niba umukoresha wawe akoresha mushakisha yicyatsi kibisi, bitabaye ibyo ukeneye gushyiramo Fetch polyfill cyangwa gukoresha Gusaba, Bluebird cyangwa Axios.

Nkeneye amasomero angahe nkeneye kumenya kubwimana? Ni bangahe muri bo?

-Ni JavaScript. Hagomba kubaho amasomero ibihumbi nibihumbi byose bikora ikintu kimwe. Tuzi amasomero, mubyukuri, dufite amasomero meza. Amasomero yacu ni huuuge, kandi rimwe na rimwe dushyiramo amashusho ya Guy Fieri.

Wavuze gusa Guy Fieri? Reka tubirangize. Niki aya masomero ya Bluebird, Gusaba, Axios amasomero akora?

-Ni amasomero yo gukora XMLHttpIbisubizo bisubiza amasezerano.

Uburyo bwa AJAX bwa jQuery ntabwo bwatangiye gusubiza amasezerano?

-Ntabwo tugikoresha ijambo "J" muri 2016. Koresha Fetch gusa, hanyuma uyuzuze mugihe itari muri mushakisha cyangwa ukoreshe Bluebird, Gusaba cyangwa Axios aho. Noneho ucunge amasezerano hamwe no gutegereza mumikorere ya async no gutera imbere, ufite kugenzura neza.

Ni inshuro ya gatatu uvuze utegereze ariko sinzi icyo aricyo.

-Gutegereza bigufasha guhagarika umuhamagaro udahuje, bikwemerera kugenzura neza igihe amakuru azanwa no kongera kode isomeka muri rusange. Nibyiza, ukeneye gusa kwemeza ko wongeyeho stage-3 preset muri Babel, cyangwa ugakoresha syntax-async-imikorere no guhindura-async-kuri-generator plugin.

Ibi ni ibisazi.

-Oya, umusazi nukuri ukeneye kubanziriza code ya Typescript hanyuma ukayimura hamwe na Babel kugirango ukoreshe gutegereza.

Wat? Ntabwo bikubiye muri Typescript?

-Bikora muri verisiyo ikurikira, ariko nkuko biri muri verisiyo 1.7 ireba ES6 gusa, niba rero ushaka gukoresha gutegereza muri mushakisha, ubanza ugomba gukusanya code yawe ya Typescript ugamije ES6 hanyuma Babel igahita yerekeza kuri ES5.

Aha sinzi icyo mvuga.

-Reba, biroroshye. Kode ibintu byose muburyo bwanditse. Module zose zikoresha Fetch zirayegeranya kugirango zigere kuri ES6, zohereze hamwe na Babel kuri stade-3, hanyuma ubishyire hamwe na SystemJS. Niba udafite Fetch, polyfill, cyangwa ukoreshe Bluebird, Gusaba cyangwa Axios, kandi ukore amasezerano yawe yose utegereje.

Dufite ibisobanuro bitandukanye cyane byoroshye. Noneho, hamwe nuwo muhango narangije kuzana amakuru none ndashobora kuyerekana hamwe na Reaction nibyo?

-Ese porogaramu yawe igiye gukemura impinduka zose za leta?

Err, sintekereza ko. Nkeneye gusa kwerekana amakuru.

-Oh, Imana ishimwe. Bitabaye ibyo nagira ngo ngusobanurire Flux, nibishyirwa mubikorwa nka Flummox, Alt, Fluxible. Nubwo kuvugisha ukuri ugomba kuba ukoresha Redux.

Ngiye kuguruka hejuru yaya mazina. Na none, nkeneye gusa kwerekana amakuru.

-Oh, niba urimo kwerekana gusa amakuru utari ukeneye Reaction kugirango utangire. Wari kuba mwiza hamwe na moteri yerekana.

Uransetsa? Utekereza ko ibi bisekeje? Nuburyo ufata abo ukunda?

-Nari gusobanura gusa icyo ushobora gukoresha.

Hagarara. Hagarara.

-Ndashaka kuvuga, niyo yaba ikoresha moteri yicyitegererezo gusa, nakomeza gukoresha Typescript + SystemJS + Babel combo iyo nza kuba wowe.

Nkeneye kwerekana amakuru kurupapuro, ntabwo nkora Sub Zero yambere yapfuye. Gusa mbwira moteri yicyitegererezo yo gukoresha nzayikura aho.

-Hari byinshi, niyihe mumenyereye?

Ugh, ntushobora kwibuka izina. Hari hashize igihe kinini.

-Urugero? jQote? BYIZA?

Err, ntabwo avuza inzogera. Undi?

-Umucyo? JSRender? MarkupJS? KnockoutJS? Uwo yari afite guhuza inzira ebyiri.

Undi?

-IbyapaJS? JQuery-tmpl? Amaboko? Abantu bamwe baracyayikoresha.

Birashoboka. Hoba hariho ibisa nkibyanyuma?

-Mustache, ashimangira? Ndatekereza ko ubu na lodash ifite imwe yo kuvugisha ukuri, ariko ibyo ni ubwoko bwa 2014.

Err .. birashoboka ko byari bishya.

-Jade? Umukungugu?

Oya.

-DotJS? EJS?

Oya.

-Nunjucks? ECT?

Oya.

-Mah, ntamuntu ukunda syntax ya Coffeescript uko byagenda kose. Jade?

Oya, umaze kuvuga Jade.

-Nashakaga kuvuga Pug. Nashakaga kuvuga Jade. Ndashaka kuvuga, Jade ubu ni Pug.

Kuniha. Oya. Ntushobora kwibuka. Ninde wakoresha?

-Birashoboka gusa ES6 kavukire yicyitegererezo.

Reka nkeke. Kandi ibyo bisaba ES6.

-Bikosore.

Ninde, ukurikije mushakisha nkoresha ikeneye Babel.

-Bikosore.

Ninde, niba nshaka gushyiramo ntongeyeho isomero ryibanze ryose, nkeneye kubitwara nka module kuva npm.

-Bikosore.

Niki, gisaba Browserify, cyangwa Wepback, cyangwa birashoboka cyane ko ikindi kintu cyitwa SystemJS.

-Bikosore.

Ninde, keretse niba ari Webpack, nibyiza bigomba gucungwa numurimo ukora.

-Bikosore.

Ariko, kubera ko ngomba kuba nkoresha progaramu ya progaramu ya progaramu nindimi zanditse nkeneye kubanza gukora mbere yo kwandika Typescript cyangwa kongeraho iki kintu cya Flow.

-Bikosore.

Noneho ohereza ibyo kuri Babel niba nshaka gukoresha gutegereza.

-Bikosore.

Ndashobora noneho gukoresha Fetch, amasezerano, no kugenzura imigendekere nubumaji bwose.

-Gusa ntuzibagirwe polyfill Fetch niba idashyigikiwe, Safari ntashobora kubyitwaramo.

Uzi icyo. Ndatekereza ko twarangije hano. Mubyukuri, ndatekereza ko narangije. Ndangije kurubuga, ndangije na JavaScript rwose.

-Ni byiza, mumyaka mike twese tugiye kuba code muri Elm cyangwa WebAssemble.

Gusa ngiye gusubira inyuma. Gusa sinshobora gukemura izi mpinduka nyinshi na verisiyo hamwe nibisohoka hamwe nababiteguye hamwe na transpilers. Umuryango wa JavaScript ni umusazi niba utekereza ko umuntu wese ashobora kugendana nibi.

-Ndumva. Ugomba kugerageza umuryango wa Python noneho.

Kubera iki?

-Bigeze wumva ibya Python 3?

Kuvugurura: Urakoze kwerekana amakosa namakosa, nzavugurura ingingo nkuko byavuzwe. Ikiganiro muri HackerNews na Reddit .