Svaigi resursi tīmekļa dizaineriem un izstrādātājiem (2018. gada janvāris)
Jaunais gads 2018 ir šeit. Ja pirms pieciem gadiem aplūkosim web izstrādes progresu, tas ir pilnīgi atšķirīgs no tā, kas mums ir šodien. Šodien ir jauni metodes, instrumenti un pat pilnīgi jauna paradigma kas maina tīmekļa vietņu veidošanas veidu - un VirtualDOM ir viens no tiem.
DOM (Document Object Model) ir a koku modelis, kas nosaka, kā tīmekļa vietne ir strukturēta. Izvēloties, pārvietojoties un manipulējot ar DOM, varētu būt ļoti dārga atriebība un var traucē jūsu vietnes sniegumu.
Tomēr šajā amatā mēs neapspriedīsim, kā darbojas VirtualDOM, tā vietā kopā ar citiem rīkiem mēs aplūkosim bibliotēkas, kas ļauj īstenot VirtualDOM tūlīt pat. Pārbaudīsim tos.
MaquetteJS
An VirtualDOM ieviešana kas ļauj jums izveidot šķidruma lietotāja saskarni, kas tiek atjaunināta ar tajā esošajiem datiem. Tā ir tīra JavaScript un neapstiprināts līdz ar to ir iespējams izmantojiet to kopā ar sintētisko valodu, piemēram, CoffeeScript, TypeScript un JSX. Lieliska alternatīva bibliotēka React.js; MaquetteJS ir daudz mazāks (tikai 3kb) salīdzinoši.
ReDOM
Šī ir viena no manām iecienītākajām VirtualDOM bibliotēkām, jo to var vienkārši paņemt, apskatot sintaksi. Tikai ar 2Kb, jūs varat izveidot ātras atveidošanas Web lapu vai pielāgotu HTML komponentu. Bibliotēka sastāv no divas galvenās funkcijas el, izveidot vai manipulēt ar elementu, un stiprinājums lai to pievienotu izvēlētajam elementam. To var ielādēt pārlūkprogrammā un servera pusē ar NodeJS.
ReactiveJS
Veidne UI bibliotēka, lai izveidotu ļoti interaktīvu tīmekļa lietojumprogrammu. Sākotnēji TheGuardian, ReactiveJS ir veidota tā, lai darbotos pārlūkprogrammās un mobilajās ierīcēs; lai jūs varētu būt atkarīgi no tā uzticamības. ReactiveJS arī nāk daudzas funkcijas, kas nepieciešamas mūsdienīgai tīmekļa lietojumprogrammai, ir labas, piemēram, Scoped CSS, Custom Components, SVG un animācija.
RiotJS
RitoJS ir patīkams strādāt un daudz vieglāk iemācīties bibliotēku iesācējiem ļauj definēt pielāgotu komponentu ar HTML elementu un HTML atribūti, kamēr iepriekšējās bibliotēkas būs spiestas izmantot tīru JavaScript sintaksi.
RiotJS ir saderīga ar Node.js vidi vai pārlūkprogrammām, un tā var būt a lieliska alternatīva Vue.js, ņemot vērā similarties.
HyperHTML
hiperHTML, kā norāda nosaukums, iezīmes veiktspēju, veicot un manipulējot ar DOM. To var izmantot, lai izveidotu pielāgotu elementu un tīmekļa komponentu. Tas darbojas tikpat viegli kā jQuery, kurā to var izmantot pārlūkā ielādējot skriptu no CDN un piekļūstot hyperHTML. Nav nepieciešama sarežģīta instrumenti.
Mithril
Mithril ir tikpat vēss, kā tas ir jaudīga JavaScript bibliotēka. Papildus VirutalDOM un komponentiem Mithril ir aprīkots arī ar Routing un XHR, ar kuru jūs varat izveidot vienas lapas tīmekļa lietojumprogrammu, nepaļaujot uz citu bibliotēku. Salīdzinošais rādītājs parāda, ka tas pārspēj dažas populāras bibliotēkas, piemēram, Vue.js, React.js un Angular.
SlimJS
SlimJS ir JavaScript bibliotēka veidojiet pielāgotu tīmekļa komponentu, izmantojot vietējo tīmekļa komponentu API. Tā kā tas ir veidots ap vietējo pārlūkprogrammu, SlimJS ir aprīkots ar a Polyfill kas shims API pārlūkprogrammā, kas to vēl neatbalsta. Tas ir lielisks ietvars, ja vēlaties izmantot dzimtā veidā.
VSVG
Kaut arī tam ir līdzīga sintakse ar HTML, SVG ir vēl viens zvērs, kam piemīt pašas savas cirks. Šī bibliotēka, kā norāda nosaukums, būs ļauj izveidot un manipulēt SVG lidojumā.
EmotionSH
EmotionSH ir CSS-in-JS sistēma, kas jums varētu būt nepieciešama, veidojot tīmekļa vietni ar VirtualDOM. Tas ļauj jums piegādāt tikai jūsu vietnē nepieciešamos CSS bitus dinamiski atjaunina stilu bez konvulācijas ar klases nosaukumu un specifiku, jo stils tiek skenēts tikai uz komponentu, uz kuru tas attiecas.
Reaģējiet uz starta komplektu
Ja pēdējo pāris gadu laikā esat sekojis tīmeklim, jūs atradīsiet React (gandrīz) katru reizi. Tas ir 5 īsu video kursu, kas ievieš React. Ja vēlaties sekot līdzi nozarei, tās varētu būt pareizā vieta, lai sāktu darbu.
Elementi
Elementi ir kolekcija iOS komponenti, lai izveidotu iOS lietotnes prototipu skicē. Tās ir izveidojušas cilvēki, izmantojot skici un atjauninātas ar iPhone X UI.
Modaal
Modaal ir JavaScript bibliotēka, kas veidota, ņemot vērā pieejamību. Tas ir bijis pārbaudīts “WCAG 2.0 līmeņa AA atbalsts” tas (es domāju) visvairāk pieejams “Modāls” bibliotēka šodien. Tas ir viegls, jQuery saderīgs, un to var izmantot attēlu, video un pat Instagram. Turklāt šis šis īss kurss no Google palīdzēs jums sākt ar Web pieejamību un kāpēc tas ir svarīgi.
WordPressify
NPM pakete, kas ļauj iegūt WordPress izstrādes vidi un darbojas dažu minūšu laikā. Tas viss ir izveidots mūsdienīgi instrumenti, piemēram, Gulp, LiveReload, PostCSS, Babel lai jūs varētu koncentrēties uz sava projekta izstrādi, nevis uz konfigurēšanu.
Lando
Lando ir arī ērts līdzeklis, lai ātri un viegli spin up attīstības vidi WordPressify mēs jau iepriekš minējām. Bet tā vietā Node.js vietā Docker priekšrocība ir viegls konteiners tehnoloģija, un tā piedāvā lielāku elastību attiecībā uz steku, kuru vēlaties izmantot savā izstrādē.
Piemēram, varat norādiet PHP versiju, iespējojiet XDebug un instalējiet Komponists.
WP-Dockline
WP-Docklines ir a attēlu kolekcija, ko var izmantot kā bāzes līniju, lai veiktu nepārtrauktu integrāciju un piegādi jūsu WordPress tēmām un pluīniem tādos pakalpojumos kā Bitbucket, CircleCI un Gitlab. Katrs attēls ir komplektā rīki, kas parasti ir nepieciešami, izstrādājot WordPress piemēram, PHP kods Sniffer, PHPUnit un WP-CLI.
WP-Locker
WP-Locker ir Docker Izveidot konfigurāciju, lai dažu minūšu laikā spinētu WordPress izstrādes vidi. Tas ir izveidots ar Apache, MySQL un phpMyAdmin un tā kā tas paplašina WP-Docklines attēlu, tas arī veic papildu rīkus attēla ārpusē.
Vienkārši veids bin / start ļaut to konfigurēt vietējais un instalējiet spraudņus un tēmas, kuras konfigurējat konfigurācijas failā.
Docusaurus
Vēl viena atklātā pirmkoda iniciatīva no Facebook, Docusaurus ir instruments, lai izveidotu jūsu projekta dokumentācijas tīmekļa vietni. Ar React un Markdown palīdzību jūs varat viegli izveidot dokumentāciju, uzturēt to un pat izveidot vietnes emuāru, un publicējiet to Github Pages.
VSCode Yo
Yeoman ir mezgla pakete, kas ļauj ātri uzsākt projektu izvēloties iepriekš sagatavotas sastatnes, kas atbilst jūsu projektiem. Ja izmantojat Visual Studio kodu, šis spraudnis vēl vairāk pilnveidos darba uzsākšanas procesu, jo tas ļauj palaist “Yo” komandu tieši no Visual Studio koda loga.
BluebirdJS
JavaScript bibliotēka ļauj izmantot Solījums, gaida, async šodien visās pārlūkprogrammās; teica, ka tas pat darbojas Netscape. Solījums ir viens no spēcīgākajiem punktiem jaunākajās JavaScript specifikācijās padarīt jūsu kodu vienkāršāku, lasāmāku un viegli uzturamu.
Skaistāks
Skaistāks ir līdzeklis formatējiet kodu, lai tas atbilstu valodas kodēšanas standartam. Tā pārrakstīs jūsu kodu no scracth, ievērojot noteikumus, kas ļauj jums un jūsu komandai produktīvāka, nevis apspriest kodu rakstīšanas stilus.
