Hogyan válhat Full Stack webfejlesztővé 2020-ban

A teljes verem webfejlesztők a svájci hadsereg kései a kódvilágban. Ez a megnevezés azt jelenti, hogy végponttól végpontig készíthet megoldásokat, ami rendkívül piacképes és mozgékony készség. De mi kell valójában a státusz eléréséhez?

Akár új vagy, tapasztalt vagy specializálódott a verem egyik végébe, itt sok mindent meg lehet emészteni. Bátran merüljön be a tetejéről, vagy ugráljon oda, ahol a legnagyobb támogatásra van szüksége.

  • Először is, mitől lesz egy fejlesztő teljes stack?
  • Mielőtt belevágnánk, beszéljünk erről a fókuszról
  • Tehát hol kezdjük?
  • Front End
  • Hátul
  • DevOps és a felhő
  • Mi a helyzet a dizájnnal?
  • Egyéb dolgok, ha még csak most kezded
  • Egyéb dolgok, ha többet keres

Először is, mitől lesz egy fejlesztő teljes stack?

Nagyon szórakoztató és buzgó azt mondani, hogy bármelyik front end fejlesztő teljes verem fejlesztő, de ha NetLify-ra telepíthet egy weboldalt, az nem tesz teljes veremmé.

Ez nem azt jelenti, hogy elbátortalanítsa - csak reálisan, csak az a tapasztalat birtoklása nem fogja jól felvenni ezt a munkakört a következő interjúban. Amíg technikailag az elejétől a végéig készíti és alkalmazza a munkáját, a Netlify, a Zeit és más szolgáltatók mágikus eszközeikkel megadják ezt az erőt ahhoz, hogy kivegyék a verem műveletek nagy részét az egyenletből.

Ez nem vonja le azt, amit mindannyian képesek vagyunk megvalósítani, mint a front end fejlesztői. A statikus weboldalak összeállításának és telepítésének egyre növekvő mozgása ezt a folyamatot egyszerűbbé tette a verem későbbi felében, előnyökkel járva.

Ezenkívül az olyan szerszámozási lehetőségek rugalmasságával, mint például a JS futtatása egy szerveren, képességkészleteink minden eddiginél több felhasználási esetre képesek áttérni.

Honnan jöttünk

A webfejlesztési környezet gyorsan változik. A Wordpress egy ideje a király CMS, a CMS-t használó webhelyek több mint egyharmadát képviseli, és segíti a PHP népszerűségét. De mások kidolgozták a saját megoldásokat.

Ezek egy hagyományosabb webveremet jelentettek, mint a LAMP. Ezekben az esetekben olyan webkiszolgálók voltak, amelyek általában valamilyen tartalomkezelő rendszert és egy szerveroldali nyelvet (például PHP) futtattak, amelyek kapcsolódnak az adatbázisokhoz, és előállítják a kódot, amelyet végül a böngészőbe juttatnak el.

Ráadásul előfordulhat, hogy a Javascript interaktív funkciókat készít a CSS segítségével az oldal megjelenítésének kezelésével. Bizonyos esetekben bizonyos webhosztokhoz csak egy felügyelt Wordpress szerver szükséges. Más nagyobb helyszínekhez azonban egy másik csapatra lenne szükség a szolgáltatások és a telepítési folyamat irányításához, hogy a kódot előállíthassák.

Hol vagyunk és merre tartunk

Bár a Wordpress nem megy sehova, a szerver nélküli és a JAMstack architektúrák lendületet adnak. Azok számára, akik ismeretlenek, nem az az ötlet, hogy nincsenek kiszolgálók, hanem sokkal inkább az Ön számára felügyelt kiszolgálók használata a felhőben.

Az olyan szolgáltatások, mint az AWS Lambda, lehetővé teszik az egyszerű bemenetet és kimenetet feldolgozó „funkció” felépítését. Csatolja ezt az API-átjáróhoz, és azonnal megkapja a végpontot, amellyel kapcsolatba léphet anélkül, hogy valaha is kezelnie kellene a szervert.

Mások, például az S3, lehetővé teszik a HTML, CSS, JS, képek és minden más statikus eszköz tárolásába történő tárolását, és közvetlenül onnan történő kiszolgálást. A szerveren semmi sem kerül feldolgozásra, egyszerűen a statikus fájlokat szolgáltatja ki az ügyfélnek.

A zseniális rész ebben az, hogy sokkal kevesebb a rezsi, és általában egy csomó sokkal olcsóbb. Sok esetben óriási teljesítménynövekedést is kap, ahol egy webhely kiszolgálása az s3-ból kevesebb feldolgozást igényel, hogy az első válasz a böngészőhöz eljusson, ami közvetlenül a jobb felhasználói élménynek felelhet meg.

Ez nem azért jár, hogy a JAMstack-re lökjen, hanem annak megmutatására, hogy a teljes stack paradigma változik, és érdemes megnézni. A munkában még mindig van egyfajta különbség, de ez kissé másként jelenik meg.

A DevOps csapatai most kezelik a felhőalapú erőforrásokat és telepítik őket. A háttér-fejlesztők most olyan API-kat és kódokat készítenek, amelyek kapcsolódnak a szolgáltatásokhoz olyan eszközök segítségével, mint a lambda függvények. Az elülső fejlesztők pedig elsősorban a Javascript React vagy a Vue alkalmazásaiban dolgoznak, amelyek elérik a háttérfejlesztők által létrehozott szolgáltatásokat. Ez vitathatatlanul tartalmazhat vagy nem tartalmazhat olyan dolgokat, mint például a CSS, de ez egy újabb féregfajta arról, hogy a „hivatalosan” milyen cím alá esik (spoiler: a csapattól függ).

Bár továbbra is megosztott a kötelességtudat, a vonal elmosódik, és könnyebben kezelhetővé teszi a fókusz elosztását.

Mielőtt belevágnánk, beszéljünk erről a fókuszról

Eléggé csábító lehet belemerülni egy teljes stack fejlesztő teljes spektrumába, de van valami mondanivaló a fókuszról. Ez az alapja annak a kifejezésnek, hogy „minden szakma jack, egyik sem a mestere”, ahol megpróbálsz megtanulni egy kicsit a teljes verem egyes részeiből, és soha nem sajátítasz el semmit.

Ez veszélyes lehet, ha új fejlesztőként próbálja kiépíteni az erősségeit. Ezért próbáld meg értékelni, hogy milyen típusú tanuló vagy, és odaadd a figyelmedet, ahol ez fontos. Ha szétszórt tantervvel küzd, ez nem feltétlenül segít abban, hogy megszerezze azt a tapasztalatot, amelyre szüksége van az első munkahely vagy az álom munkahely eléréséhez.

Egy újszerű megközelítés például lehet, hogy egyéni fókuszban van, de a teljes stack képességeit ennek az erősségnek a köré építi. Lehet, hogy ez egy olyan front end fejlesztő, aki saját webalkalmazásait telepítheti, és továbbra is ezen alapvető ismeretekre épít.

Ráadásul a teljes verem fejlesztői rész nem feltétlenül képes azt mondani, hogy tudsz x, y és z nyelvet. A kód- és szoftvertervezési koncepciók megértése, valamint az esetleges kihívások leküzdése, félreállítás, nagyszerű fejlesztő.

A lényeg: próbáld meg kitalálni, mi a legjobb neked, és ne engedd, hogy nagy ambícióid akadályozzák az utazás elsajátítását.

Tehát hol kezdjük?

E cikk alkalmazásában meg fogjuk tartani azokat a hagyományos töréspontokat, amelyek felbomlik a veremben (elülső, hátsó, stb.). Bár egyesek azt mondják, hogy ez valójában már nem egy dolog, reálisan nézve rengeteg munka áll rendelkezésre a teljes verem fejlesztők számára, és nap mint nap hivatkoznak a hagyományos töréspontokra. A "full stack fejlesztő" biztosan nem megy sehova.

Ami a veremet illeti, a szerver nélküli / JAMstack architektúrákra támaszkodunk, mivel ez csak tovább fog növekedni. És ha megtanulja őket, az csak piacképesebbé teszi a körülötte felbukkanó munkahelyek számát.

Amint az alábbiakban észreveszi, ez nem azt jelenti, hogy minden magában foglalja minden típusú adatbázist és minden típusú megjelenítési megoldást. Egy erős fejlesztőnek képesnek kell lennie arra, hogy rugalmas legyen az eszközeivel, el kell érnie munkája fogalmait, nem pedig egyetlen gondolkodásúnak kell lennie, és csak egy keretben kell produktívnak lennie.

Bár lehet, hogy a React-ben dolgozik, és a jelenlegi munkahelyén jól érzi magát (ez rendben van!), A következő munkája nehéz lehet a Vue-nál vagy "meglepetés!" csapatvezetője át akarja írni az alkalmazást a Svelte-be. Próbáld megérteni, miért használsz először egy felhasználói felület keretet, és hogyan segít megoldani a problémát.

Most menjünk bele ...

Front End

A webhely vagy alkalmazás kezelőfelülete általában az a felhasználói felület, amellyel a szolgáltatást igénybe vevő személy interakcióba lép. A játék legnagyobb nyelvi játékosa a Javascript, ahol általában olyan felhasználói felület könyvtárakra támaszkodik, mint a React vagy a Vue a projekt összetevőinek kezeléséhez.

Ezeknek a kezelőfelület-keretrendszereknek a felhasználásával lehetővé válik olyan "komponensek", lényegében kódblokkok létrehozása, amelyek végül HTML-t állítanak elő, és képesek kölcsönhatásokat és dinamikus állapotokat létrehozni a kóddal együtt. Ez igazán erőteljes lesz, és bár lehet, hogy van egy kis görbe a kezdéshez, nagyon élvezetes lesz együtt dolgozni, amint megérti a dolgot.

Akár új a pályán, vagy jól tapasztalt, végül belefuthat a jQuery-be. Annak ellenére, hogy érdemei vannak, és jól szolgálta a közösséget, a Javascript natív funkciói valóban nőttek, és kevesebb igényt támasztottak a jQuery által nyújtott szolgáltatások iránt. Most a fejlesztők a felhasználói felület keretrendszereire és a natív Javascriptre támaszkodnak.

Tehát jó megérteni, mi is a jQuery, de nem ajánlom, hogy ezen a ponton szánjon időt arra, hogy megtanulja. A jó dolog az, hogy ha egy munkát használ, amely használja, akkor közvetlenül a jQuery-vel együtt natív Javascript-t is írhat, így maga a vanília Javascript megtanulása a helyes válasz.

Tehát mit kellene megtanulnom?

Ha valóban kezdő vagy, szánj időt az alapvető HTML és CSS elsajátítására. Lehet, hogy nem olyan szórakoztató és vonzó, mint a Javascriptbe ásni, de a web alapjaira építve kulcsfontosságú lesz a jobb lábra lépés.

Ezután tanulja meg a Javascript-et. A belátható jövőben király marad. A Javascript minden olyan keretrendszer vagy könyvtár alapját képezi, amelyre épít, így ha megértette, hogy a nyelv darabjai hogyan működnek, akkor elősegítheti Önt a dolgok elülső oldalának elsajátításában.

Megkönnyíti az életedet is, amikor megpróbálod megérteni a különféle minták összetettségét és a használt keretek mögött álló fogalmakat.

Ha már a keretrendszerről beszélünk, a React és a Vue valószínűleg a legjobb jelölt népszerűségük miatt. A React a legnépszerűbb a sok közül, és csak tovább fog növekedni. Csapata folyamatosan azon dolgozik, hogy érettebbé tegye a keretrendszert és olyan API-kat készítsen, amelyek elősegítik a modern, gyors webalkalmazások felépítését.

A Create React App vagy a Gatsby használatának megkezdése még abban is segít, hogy könnyedén felpörgesse a React alkalmazást, és azonnal olyan helyzetbe kerüljön, ahol a kódban bütykölhet.

Bár a CSS-előfeldolgozók és az olyan eszközök meghívása is előnyös lenne, mint a Sass, rengeteg megoldás kínálkozik a CSS-re, beleértve a CSS-in-JS-t is.

Bár a CSS-nek a JS belsejébe helyezésével vannak előnyei és hátrányai, nem feltétlenül érdemes rámutatni arra, hogy mit használjunk adott irányként, mivel ez valóban csapattól függ.

A CSS alapjainak és erejének megértése, valamint a vanília formában történő felhasználásának előkészítése elősegíti a használatát a kerettől függetlenül.

Erőforrások

  • freecodecamp.org Érzékeny webtervezési tanúsítás //www.freecodecamp.org/learn
  • „Tegye le a Javascript-et: Tanulja meg először a HTML-t és a CSS-t” //www.freecodecamp.org/news/put-down-the-javascript-learn-html-css/
  • MDN bevezető a Javascript-hez //developer.mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript
  • Csak Javascript e-mail tanfolyam //justjavascript.com/
  • JSRobot Learning Game //lab.reaal.me/jsrobot/
  • reactjs.org Bevezetés a Reactbe //reactjs.org/tutorial/tutorial.html
  • gatsbyjs.org oktatóanyagok //www.gatsbyjs.org/tutorial/

Hátul

A JAMstack világban a háttér általában azokra az API-kra hivatkozik, amelyeket kezelőfelületeink dinamikus élmények létrehozásához használnak az ügyfél végpontjaival való interakció révén (például a CRUD API-kban). Az ilyen kérelmek elküldése az ügyféltől feleslegessé teszi a feldolgozás bármelyikének elvégzését, mielőtt az oldal a böngészőbe kerül.

Annak ellenére, hogy nem szabad úgy éreznie, hogy csak egy nyelven tud kódolni, a Javascript-tel való írás itt nagy előnyt jelent, mivel belevághat a dolgok hátoldalával való munka alapjaiba egy ismerős nyelvvel (vagy fordítva az elülső végével).

A NodeJS egy gyakori futási idő, amelyet a legtöbb felhőkörnyezetben talál, mint opciót, és hasonló élményt nyújt Önnek, mint amire a böngészőben számíthat. A fő különbség az, hogy nem fér hozzá bizonyos böngésző API-khoz, és nem lesz windowobjektum és az ahhoz társított API-k.

Ez azt jelenti, hogy a Python szintén egy másik népszerű nyelv, és növekszik, különös tekintettel az adattudományi és mérnöki közösségben való népszerűségére. A PHP és a Ruby, bár érvényesek, és lehetőséget nyújtanak Önnek a munkaerőpiacra, úgy tűnik, nem annyira népszerűek, és nem is annyira felfelé irányuló trendben, mint a Javascript és a Python.

Az Ön által választott nyelv használatával a legjobb megoldás az, ha megtanulja, hogyan hozhat létre felhőszolgáltatásokat, amelyekkel az alkalmazásai interakcióba léphetnek.

Ha létrehoz egy egyszerű lambdát, amellyel játszhat, akár az AWS-ben, akár a Netlify-ban, akár bármely más felhőszolgáltatóban, akkor jó tapasztalatokat szerezhet arról, hogy mire számíthat a területen végzett munka során.

És még akkor is, ha nem biztos, hogy közvetlenül a lambdában fejlődik a megtalált munkában, akkor elkezdheti megismerni azokat a fogalmakat, amelyek alapvető fontosságúak a háttérrel való munkához. És ezeket a funkciókat végül más szolgáltatásokkal és adatbázisokkal való összeköttetéshez használja, hogy saját dinamikus szolgáltatásokat hozzon létre.

Tehát mit kellene megtanulnom?

Ha már dolgozik a Javascript elsajátításán a dolgok elülső részén, folytassa a Javascript használatával a háttérrendszeréhez. Forgasson fel egy lambdát a Netlify függvények segítségével, ahol csak a kódra kell összpontosítania, a Netlify pedig gondoskodik a többiről (például a funkció felépítéséről és telepítéséről).

A választott nyelvvel és az első funkcióval próbáljon meg együtt dolgozni más, a kódban szereplő szolgáltatásokkal, hogy tapasztalatokat szerezzen a harmadik felek API-jaival kapcsolatban.

Esetleg készítsen egy olyan végpontot, amely tweetet küldhet a Twitter API segítségével (de ne éljen vele vissza). Megtanulják, hogyan kell létrehozni egy adatbázist, és beállítani a függvényét, hogy CRUD mintában illeszkedjen hozzá, amely reálisabb felhasználási lehetőséget nyújt Önnek arra, hogy egy tipikus alkalmazás miként léphet kapcsolatba a háttérprogrammal.

Célja olyan szolgáltatások létrehozása, amelyekkel a kezelőfelülete egy végponton keresztül kölcsönhatásba lép, hogy műveleteket hajtson végre az alkalmazást használó személy számára. A jó hír megkapja a felhő lendületét, rengeteg opcióval és ingyenes opcióval vagy szinttel rendelkezik, amelyekkel elkezdhet játszani.

Erőforrások

  • „Szuper egyszerű a szervertelen indítás” //kentcdodds.com/blog/super-simple-start-to-serverless
  • „Szerver nélküli CRUD-alkalmazások készítése a Netlify Functions & FaunaDB segítségével” //www.netlify.com/blog/2018/07/09/building-serverless-crud-apps-with-netlify-functions-faunadb/

DevOps és a felhő

A DevOps abból ered, hogy képesnek kell lennie olyan megoldások létrehozására, amelyek kisimítják és felgyorsítják a kód eljuttatásának folyamatát az íróktól a telepített állapotba.

Ez a munka sok felelősségtől kezdve néhányig terjedhet, legyen szó bash szkriptek írásáról egy egyedi megoldáshoz, vagy olyan CloudFormation sablonról, amely létrehozza az alkalmazás futtatásához szükséges összes erőforrást.

Ezt általában a CI / CD munkafolyamatok nagyobb hangszerelésének részeként találja meg, amelyek automatizálják az összeállítási és telepítési folyamatot.

És ez folyamatosan változik! A kiszolgáló nélküli fellendülés miatt felbukkant a kiszolgáló nélküli keretrendszer, amely sok mindent könnyebben kezel az Ön számára, ami még az AWS-t is arra készteti, hogy létrehozzák a saját SAM-megoldást. Az olyan eszközök, mint a Jenkins, már régóta megtalálhatók a dolgok CI / CD részeiben, de most látja, hogy a Github, a Gitlab és más forrásvezérlő szolgáltatók saját megoldásokat és eszközöket kínálnak, mint például a CircleCI, amelyek közvetlenül a projektjükbe kapcsolódnak.

Az sem tökéletes még - a CloudFormation sablonok írása félelmetes. Az automatizálási szkriptek írása szintén nem a legszórakoztatóbb, bár szuper kifizetődő, ha működik!

De ez egyre jobb, ahol az olyan termékek beilleszkednek, mint a Netlify és a Zeit. Noha a dolgok inkább a statikus tárhely oldaláról gyökereznek, ahol lefordítja az alkalmazást és tárolóba helyezi, kínálatuk növekszik, például a Netlify funkciói valójában csak az AWS Lambdas, amelyeket könnyebben lehet beállítani és egy teljesen működő végpontra telepíteni (ez nagyon szuper könnyű).

Tehát mit kellene megtanulnom?

Ha először állít be ilyesmit, kezdje a Netlify-val. Állítson be egy React alkalmazást vagy akár csak egy egyszerű HTML fájlt a Github-tárházban, csatlakoztassa egy új Netlify-fiókhoz, és nézze meg, ahogy települ.

Innen kezdve, vagy ha már van egy kis tapasztalatod, kezdj el kíváncsi lenni arra, hogy mi történik a kulisszák mögött. A Netlify valószínűleg megkapja a kódot, futtatja a beállított (például yarn build) parancsokat egy virtuális környezetben, eldobja az S3-hoz hasonló tárolóba épített fájlokat, és CDN-t tesz elé, mint a CloudFront, hogy egy végponttól szolgáljon.

Először próbálja meg ezt manuálisan elvégezni a számítógépről az AWS konzol és a CLI használatával, majd írjon egy szkriptet a Netlify helyett a Circle CI-vel a Github projektbe integrálódás folyamatának automatizálásához, hogy valóban telepítse az AWS-be.

Ennek felemelése magában foglalja azoknak a szolgáltatásoknak a felpörgetését, amelyekkel a hátsó vége kapcsolódhat. Van olyan adatbázisa, amelyet a szolgáltatásai használnak? Automatizálhatja az adatbázis felpörgetését a CloudFormation vagy a bash parancsfájlok használatával.

Az infrastruktúra kódként történő kezelése eldobható, könnyen helyreállítható forrásokkal elősegíti, hogy Ön és projektjei rugalmasabbá váljanak, és jobban képesek legyenek visszaállni kudarc esetén.

És ez minden felhő vagy CI / CD szolgáltatóra vonatkozik, nem csak az AWS és a Circle CI. Válaszd ki a kedvenc felhő- és munkafolyamat-eszközt, és fuss vele. A lényeg az, hogy kezdje el megvizsgálni a projekt szükségleteit, és tanulmányozza, mi történik valójában a verem automatizált részeiben. Ez segít többet megtudni és találékonyabbá válni a projekt igényeinek megfelelően.

Erőforrások

  • „Lépésenkénti útmutató: Telepítés a Netlify-ra”
  • „Statikus webhely beállítása” //docs.aws.amazon.com/AmazonS3/latest/dev/HostingWebsiteOnS3Setup.html
  • „AWS Certified Cloud Practitioner Training 2019 - Ingyenes 4 órás videotanfolyam” //www.freecodecamp.org/news/aws-certified-cloud-practitioner-training-2019-free-video-course/
  • Lásd a Javascript-erőforrásokat a fenti kezelőfelületen

Mi a helyzet a dizájnnal?

Igen, meg kell értenie a tervezés alapjait. Nem, nem kell tervezőnek lenned.

A tervezés számos szempontból felgyorsítja fejlesztői képességeit. Noha mindannyian tudjuk, hogy a látványtervezők és az UX-tervezők varázslatot produkálnak, az alapismeretek birtoklása megakadályozhatja, hogy alkalmazása csalódássá váljon.

A fejlesztési folyamatban mindenki azon cél elérésén dolgozik, amely így vagy úgy befolyásolja a végfelhasználót. Ha meg tudja érteni, hogy mire van szüksége a munkájának, és hogyan hat ez a felhasználókra, az egész csapat számára átfogóbb végmegoldás kidolgozásában segít.

Fontoljon meg egy háttér-fejlesztőt, amely API-t hoz létre, hogy valaki kezelhesse a felhasználókat egy alkalmazásban. Az API követelményei elég szűkek, és csak a felhasználó nevét tartalmazzák. Annak előírása, hogy egyetlen „név” mezőként az „első” és „utolsó” helyett nem biztos, hogy a legtöbb intuitív megoldás. De ez lehet egy bonyolultság, amely bonyolítja, hogy a kezelőfelület fejlesztője miként fedi fel ezt a kezelőfelületen, ami fájdalmat okozna a fejlesztő számára a megjelenítésben, vagy zavaróvá teheti a végfelhasználó fogyasztását.

Ráadásul a tervezés közvetlenül befolyásolhatja a konverziót. Ha az e-kereskedelmi térben épít, akkor egy olyan gomb, amely nem úgy néz ki, mint egy gomb, megakadályozhatja az embereket abban, hogy termékeket vegyenek fel a kosarukba. Ez természetesen megakadályozza a vásárlást, amely bevételkiesés. A felhasználói felület humanizálásának megértése alapvető értelemben szó szerint több pénzt tehet a projektjének, vagy egyszerűen segíthet valakinek a könnyebb felhasználásában.

És ami még fontosabb, azt szeretné, ha webhelye elérhető lenne. Sok embernek különböző igényei vannak, függetlenül attól, hogy nem látják-e a színeket egyformán, vagy nem hallják az alkalmazásod által keltett hangokat, fel akarod ismerni mások igényeit, és megpróbálsz úgy tervezni, hogy alkalmazásod mindenki számára elérhetővé váljon.

Tehát mit kellene megtanulnom?

Bár nem számítok arra, hogy egy egész tanfolyamot elvégeznél érte, próbálj tudatos és kíváncsi lenni. És talán legközelebb ne hagyja ki azt a tervezési cikket, amelyet látott, hogy felbukkan a freeCodeCamp twitterén.

Megoldások készítésekor próbáld meg elképzelni, hogyan fogják felhasználni a munkádat. Mire lesz szüksége a csapat többi fejlesztőjének az API-ból? Mire lesz szüksége az Ön alkalmazását használó embereknek az Ön felületéről?

Megpróbálhat inspirációt meríteni abból is, amit mások csinálnak az űrben. Hogyan várhatja el, hogy egy alkalmazás kinézzen, amikor hasonló funkciókat biztosít? Ez nem engedély másolásra vagy lopásra, de meg kell értenie azokat a szükségleteket, amelyeket a megoldás megold. Gondoljon arra, hogy miért olyan hatalmas a Kosárba helyezésük gomb, miért adnak lehetőséget a felhasználóknak egy termékfotó nagyítására, vagy hogyan lehetne kissé használhatóbbá tenni az asztalt

Ami az akadálymentességet illeti, próbálja megtanulni az alapokat. Egyre több forrás áll rendelkezésre a mások igényeinek megértéséhez. Próbáld megérteni, hogy milyen fogyatékosságok vannak, és hogyan befolyásolhatják az alkalmazásod használatát. Talán nézzen meg néhány gyakori mintát az aggodalmak kezelésére.

Gyakran előfordul, hogy nem túl nehéz beépíteni, és ha kezdettől fogva megszokja, hogy ezt csinálja, akkor nem is gondol rá, amikor legközelebb épít egy alkalmazást.

Erőforrások

  • Design for Developers //thoughtbot.com/upcase/design-for-developers
  • Hack Design //hackdesign.org
  • Design for Hackers //designforhackers.com/
  • Bevezetés a webes akadálymentességhez //webaim.org/intro/

Egyéb dolgok, ha még csak most kezded

A cikk nagy része feltételezi, hogy vannak olyan alapjai, mint például a git és a forrás vezérlésének megértése, vagy egyszerűen a kódszerkesztő beállítása. Ha valóban csak most kezded, akkor legalább meg akarod érteni ezeket a fogalmakat, mivel ezek nélkül gyorsan kihívást jelent.

Van néhány mondanivaló a terminál használatának megtanulásáról is. Döbbenetes lehet, ha nem használsz GUI-t, ha új vagy, de ha mozgolódsz, gyorsan megtudhatod, hogy termelénebb leszel, és sok projekt megköveteli a terminál használatát.

Tehát mit kellene megtanulnom?

Először is, állítsa be a kódszerkesztőt. A Visual Studio Code most divat, de vannak olyanok, amelyek a beállításaitól függően jól szolgálnak majd Önnek, például az Atom vagy a Sublime Text. Még olyan felhőalapú IDE-ket is talál, mint a Repl.it, vagy csak egy alacsonyabb belépési korláttal indulhat el a CodePen vagy a JSFiddle játékkal.

Akárhogy is, ha készen áll a kódolásra, meg akarja érteni, mi a forrásvezérlés, hol a git a legnagyobb játékos jelenleg. A Git egy hatékony eszköz, amely lehetővé teszi a kódváltozások nyomon követését, és hatékonyabbá válik az együttműködés más fejlesztőkkel.

Érdemes megismernie a git néhány alapvető parancsát, például új módosítások hozzáadását, valamint az ágakat és azok használatát. A Git hatalmas világ, nem kell azonnal elsajátítania, gyorsan megtanulja, hogy végtelen mennyiségű új dolgot kell megtanulnia a git fu elsajátításának útján.

Sok használt eszközhöz rendelkezésre állnak olyan GUI-k, mint a GitKraken, de még mindig kissé korlátozott lesz a lehetőségeivel. A legjobb megoldás az, ha elsajátítja a gép alapértelmezett termináljait, vagy más opciókat tölt le, például az iterm2 (az én preferenciám) vagy az Xterm.js. Bónusz: úgy érzed magad, mint egy filmhacker, minden alkalommal, amikor használod (vagy ez csak én vagyok?).

Erőforrások

  • Az első lépések a Visual Studio Code használatával //www.codecademy.com/articles/visual-studio-code
  • Git-források a Github-tól //try.github.io/
  • Ismerje meg a gitet az elágazó játékkal //learngitbranching.js.org/
  • Bevezetés a Mac parancssorába //blog.teamtreehouse.com/introduction-to-the-mac-os-x-command-line

Egyéb dolgok, ha többet keres

Sokkal több van, amivel gyorsan le lehet menni egy nyúllyukon. Ne felejtsd el, hogy ne tereld a fókuszt, és próbáld meg nem elárasztani magad. De ha nagyon jól érzed magad, hogy hol vagy, van néhány más fogalom, amelyek csak a valós világ kihívásainak kezelésében segítenek.

Tesztelés és a különböző módszertanok

A kód megírása egy dolog, de ha hatékony teszteket állítunk be, az keményíteni fogja a kódot, és megakadályozza a hibák kijutását. Nem akarja pazarolni a jövőbeni idejét, és még a termék pénzébe sem kerülhet, amikor az oldal leáll. A tesztek megírásának és a különböző megközelítéseknek a megtanulása fontos a kód megszilárdításához.

Böngészőeszközök, például a Chrome DevTools

Az egyik leghatékonyabb eszköz, amely a hibakeresés során rendelkezésre áll, véleményem szerint az, hogy az alkalmazást a böngészőben lehet hibakeresni.

Akár a DOM renderelésének, a CSS-sel való játéknak, akár a hálózati kérések hibakeresésének a vizsgálatát, gyorsan megtudhatja, hogyan lehet időt spórolni és könnyebben azonosíthatja, hogy honnan származik a hiba.

HTTP és a kérések hibakeresése a hálózati panelen

Tekintettel arra, hogy a web az interneten alapul, az alkalmazás végül más szerverekhez fog kéréseket küldeni. Amikor ez megtörténik, a kérelem ütközőpontjainak megértése vagy egyszerűen a kérés benyújtásának módja segíthet megérteni, miért tűnik későnek az alkalmazás, vagy miért nem működik a mentés gomb.

Az alapos ismeretek a kérelmek működéséről és a hibakereséshez való megjelenítéséről nagyban hozzájárulnak az utazáshoz.

Nyílt forráskódú szoftverek és csomagkezelők

Ez nem annyira készség vagy eszköz a tanuláshoz, mint a szoftver terjesztésének módja. A kódex-megoldások építésének megkezdésekor megtudhatja, hogy sokan támaszkodunk nyílt forráskódú csomagokra. Legtöbbször az npm-en keresztül történik, ha Javascriptet ír, ami segít abban, hogy produktívabbak legyünk, és ne kelljen minden alkalommal újratalálnunk a kereket.

Töltsön el egy kis időt arra, hogy megértse a nyílt forráskódú koncepciót, és akár fontolja meg a visszatérést is, hozzájárulva kedvenc projektjéhez. A kezek kölcsönzése általában nagyon nagyra értékelhető, segít a tapasztalatszerzésben, és még az első jóváhagyott húzási kérésnél is képes lehet egy kis szabad fogást szerezni! Csak tiszteljen odakint, a kérés másik oldalán van egy igazi személy is.

Mi más?

Ez a lista örökké folytatódhat, mivel annyi minden rejlik a kódolás világában. Mit gondolsz még mi fontos a fejlődés mesterré válásának útjában? Küldj nekem egy tweetet vagy DM-t, ha úgy gondolod, hogy hiányzik valami fontos dolog!

Te lángolsz! Összeszedve az egészet

Tekintettel a fentiekben felhalmozott összes tapasztalatra, akkor képesnek kell lennie arra, hogy egy teljes alkalmazást létrehozhasson az elejétől a végéig egyedül. Megérted a benned rejlő erőt?

Itt kezdődik a móka. Próbáljon új alkalmazást létrehozni - nem számít, mi az, csak építsen valamit. A legjobb, amit tehetsz a tanulás érdekében, ha tapasztalattal gazdagodsz. Nem számít, hogy egyike-e a megtalált millió Todo oktatóanyagnak, vagy megtanítja magát kódolni az egyik legnagyobb közösségi hálózat kiépítésével, például az Instagram készítőjével.

Innen képesnek kell lennie létrehozni:

  • A böngészőben futó webalkalmazás-kezelőfelület
  • Olyan háttérszolgáltatások, amelyekre webalkalmazása végpontokon keresztül kéréseket intézhet
  • Írjon egy szkriptet, amelyet egy CI / CD eszközhöz kell csatlakoztatni, hogy automatizálja az összeállítási és telepítési folyamatot
  • Bónusz: jó döntéseket hoz a felületed külleméről, hogy az emberek valóban használni tudják!

Menj és építkezz! Ossza meg velünk fejlesztési útját a Twitteren a #codejourney hashtag használatával. Szeretnénk többet megtudni arról, hogy hol jártál és mit építettél, vagy merre mész és mit akarsz építeni.

Kövessen engem további Javascript, UX és egyéb érdekességekért!

  • ? Kövess a Twitteren
  • ? ️ Iratkozzon fel a Youtube-ra
  • ✉️ Iratkozzon fel a hírlevelemre