Az abszolút kezdő útmutató a webfejlesztés elsajátításához 2018-ban

Próbál megtanulni a webfejlesztést, de nem biztos abban, hol kezdje?

Valószínűleg már megpróbálta keresni a Google-on a tanulás módját, és rengeteg forrás áll rendelkezésre. De sokan túl sok információt tartalmaznak.

Jelenleg minden, amire szükséged van a webfejlesztés alapjaira - általános magyarázat, némi irányban, hogy hova tovább menjen.

Pontosan ezért írtam ezt az egyszerű útmutatót arról, hogyan válhat webfejlesztővé ...

Ha kezdő kódoló vagy, ez az útmutató az Ön számára!

Ez az, amit ez az útmutató ismertet:

  • A webfejlesztés alapvető területeinek magyarázata,
  • A programozási nyelvek és keretek áttekintése,
  • És ajánlott források a tanulás megkönnyítéséhez.

Ez kezdőknek szól, hasznos linkekkel és információkkal, amelyek előnyt jelentenek a saját kutatásában.

Itt van, mit fogunk átélni.

Tartalomjegyzék

* Ugrás linkek mellékelve, így kihagyhatja, ha akarod!

1. rész: Az alapokkal kezdjük:

  • Mi a webes fejlesztés: annak magyarázata, hogy mi történik valójában, amikor egy weboldalt tölt fel a böngészőjébe.
  • HTML, CSS és JavaScript: minden webhely alapja.
  • Hasznos eszközök: kódszerkesztők és Git használata
  • Mi az elülső és a hátsó?

2. rész: Akkor beépülünk a közbenső front-end készségekbe:

  • Érzékeny kialakítás: ügyeljen arra, hogy webhelye jól néz ki számítógépeken, táblagépeknél és telefonokon.
  • Grunt, Gulp és WebPack: építőeszközök segítségével végezhet némi munkát az Ön számára!
  • Bevezetés a JavaScript front-end keretrendszerébe: React, Vue és Angular

3. rész: A háttérképességek követik:

  • A leggyakrabban használt háttérnyelvek áttekintése és azok összeállítása.
  • Gyors bevezetés az adatbázisokhoz és az adatbázis-nyelvek elsajátításához.
  • A webhely kiszolgálón történő beállításának alapjai.

Epilógus: Tanulási források

  • Az ajánlott online tanfolyamok, oktatóanyagok és könyvek rövid listája.

Most, mielőtt mindent átnézünk a weboldalakkal kapcsolatban, kezdjük önnel!

Mi a végső célja a kódolás megtanulásakor?

Stephen R. Covey a „Nagyon hatékony emberek 7 szokása” című könyvében azt állítja, hogy a sikerhez „a végét szem előtt tartva kell kezdeni”.

Fontolja meg a saját okait, hogy a kódolásba kezdjen… Mire céloz?

Mi a végső célja?

Érdekes hobbit, karrierváltást, rugalmas munkát keres, ahol közelebb állhat a családhoz?

A webfejlesztéssel kapcsolatos teljes megközelítésének ezen egy álom elérésére kell összpontosítania.

Még megpróbálhatja leírni a célt, és elhelyezheti azt olyan helyre, ahol mindennapi látni fogja, például a fürdőszobai tükörben vagy a számítógép mellett.

A cikk áttekintésekor tartsa szem előtt a célját, és hagyja, hogy ez határozza meg, milyen döntéseket hoz: mely nyelveket kell megtanulnia, még akkor is, ha úgy dönt, hogy megtanulja.

Mindezekkel kezdve kezdjük meg az alapokat!

1. rész: Alapok

Ez nyilvánvalónak tűnhet, de mindazonáltal ezt mondom:

A webfejlesztés lényege a webhelyek felépítése.

Lehet, hogy egy weboldal egyszerű egyoldalas, vagy hihetetlenül összetett webes alkalmazás.

Ha megnézheti az interneten egy böngészőben, akkor ennek kapcsolódnia kell a webfejlesztéshez.

Íme egy egyszerű magyarázat az internetes webhelyek működéséről:

  1. A webhelyek alapvetően egy csomó fájl, amelyet a kiszolgálóknak nevezett számítógépeken tárolnak.
  2. A kiszolgálók olyan számítógépek, amelyeket webhelyek fogadására használnak, azaz a webhely fájljait tárolják. Ezek a szerverek a világháló nevű óriási hálózathoz (a 90-es évek lingójának használatához) vagy az internethez kapcsolódnak.
  3. A böngészők olyan programok, amelyeket a számítógépen futtat. Betölti a webhely fájljait az internetkapcsolaton keresztül. A számítógép kliensként is ismert, amely csatlakozik a szerverhez.

További irodalom

  • Hogyan működik az internet? - Mozilla fejlesztői hálózat
  • Mi a különbség a weboldal, a weboldal, a webszerver és a keresőmotor között? - Mozilla fejlesztői hálózat

A 3 összetevő, amelyek minden weboldalt alkotnak

Mint fentebb említettük, a webhelyek fájlokból állnak, elsősorban HTML, CSS és JavaScript fájlokból.

Nézzük közelebbről mindegyiket:

HTML vagy HyperText jelölőnyelv

A HTML az összes webhely alapja. Ez a fő fájltípus, amelyet a böngészőbe tölt be, amikor egy webhelyet néz.

Valójában nagyon egyszerű webhelyet készíthet, csak HTML használatával, és nem más típusú fájlokkal.

Nem fog kinézni nagyon érdekesnek, de ez egy minimálisan szükséges, hogy egy weboldal weboldal legyen.

(Ha érdekli a HTML alapjai, akkor nézd meg egy videó / blog oktatóprogramomat, amely erről van.)

CSS vagy lépcsőzetes stíluslapok

CSS nélkül egy webhely esztétikai szempontból ugyanolyan kellemesnek tűnik, mint egy Word-dokumentum.

A CSS használatával bármilyen színt, vonzó betűtípust hozzáadhat, és bármilyen módon elrendezheti a weboldalt.

Még animációkat is felvehet és alakzatokat rajzolhat a fejlettebb CSS segítségével.

JavaScript

A JavaScript egy programozási nyelv, amely lehetővé teszi a weboldal elemeivel való interakciót és azok manipulálását.

Míg a CSS stílust ad a HTML-hez, a JavaScript hozzáadja az interaktivitást, és dinamikusabbá teszi a weboldalt.

Például a JavaScript használatával görgeti az oldal tetejét, amikor egy gombra kattint, vagy diavetítést készíthet gombokkal a képek közötti navigáláshoz.

A HTML, CSS és JavaScript fájlok kezeléséhez a számítógépen egy kódszerkesztőnek nevezett programot kell használnia.

Ami a következő ponthoz vezet:

Melyik kódszerkesztőt kell használni?

Ez egy nagyon gyakori kérdés, különösen, ha csak kezdődik.

A legjobb kódszerkesztő nagyban függ attól, hogy milyen kódot ír.

Ha elsősorban HTML-t, CSS-t és JavaScriptet készít, akkor kódolhat a Windows Jegyzettömbben vagy a TextEdit for Mac-ekben, ha szeretné.

De mi lenne a móka ebben?

A kódszerkesztő programok, például a Sublime vagy a VS Code sok olyan funkcióval rendelkeznek, amelyek csak megkönnyítik a kódolást.

Lehetővé teszik, hogy több szövegsor behúzódjon jobbra vagy balra, és különféle módon kiemelheti a szöveget, attól függően, hogy a fájl melyik nyelven található.

Példa a szintaxis kiemelésére a VS kódban

A háttérnyelvekhez (a későbbi részekbe fogunk belekerülni) egy erősebb kódszerkesztőre lesz szükségünk, IDE (Integrált Fejlesztési Környezet) néven. Az IDE-k olyan funkciókkal rendelkeznek, amelyek lehetővé teszik a kód hibakeresését és fordítását (feldolgozását).

Íme néhány népszerű kódszerkesztő:

VS kód: A Visual Studio, a Microsoft fő IDE-jének könnyű verziója csak néhány évvel ezelőtt van, ám hihetetlenül népszerűvé vált a sebesség, a könnyű használat és az erőteljes szolgáltatások miatt. A VS Code a választott személyes szerkesztőm, így talán meglehetősen elfogult vagyok

Atom: A GitHub készítette és „hackab text text editor” -ként hirdette meg. Atom közkedvelt szerkesztő. Az egyik fő erőssége a testreszabhatóság. Telepíthet olyan csomagokat és témákat, amelyek funkciókat adnak a programhoz.

Fenséges: Egy rendkívül népszerű program, amely egy ideje működik. Mint az Atom, telepíthet csomagokat és témákat, és gyors teljesítményt nyújt. A másik két szerkesztõvel ellentétben a Sublime licenc 70 dollárba kerül (de kipróbálni szabad).

Az összehasonlítás kedvéért azt javaslom, hogy kipróbáljam ezeket a szerkesztőket. Ezután válasszon egyet, és maradjon rajta, megtanulva annak jellemzőit és gyorsbillentyűit.

Verzióvezérlés

Most megvan a kódszerkesztő, és elkezdi írni a kódot.

Mi történik azonban akkor, ha hibát követ el a kódban, és ha megnyomja a Ctrl-Z-t, hogy egymilliószor visszavonja az ön számára? Mit csinálsz?

A válasz: verzióvezérlés!

A verzióvezérlés olyan, mintha pontokat mentne a kódfájlokhoz.

Ha úgy gondolja, hogy valamilyen kódváltoztatást hajt végre, amely mindent megtörhet, létrehozhat egy új mentési pontot (úgynevezett elkötelezettség).

Ezután, ha megsemmisíti webhelyét, visszaállíthatja a kódját az előző állapotába.

Életmentő lehet, ha hibát követett el, amelyet vissza kell vonnia.

A verzióvezérlés jól hangzik! Hogyan működik?

Változat-vezérlő rendszer (VCS) használatával a kódfájlokat és a változások teljes előzményeit tárolni kell az úgynevezett lerakatban.

Általában egy tárolót fog használni webhelyen vagy projektenként.

Ezután online tárolja a lerakatot úgynevezett központi lerakatként, és a számítógépen lévő verziót egy helyi leraktárban is megőrzi.

Miközben módosítja a számítógépet, létrehozhat kötelezettségeket, majd helyezheti őket a központi adattárba.

Ez a folyamat lehetővé teszi, hogy több ember ugyanazon kódkészlettel dolgozzon, még ugyanazokat a fájlokat megváltoztatva.

A Git jelenleg a legnépszerűbb VCS

Manapság a fő verziószabályozó rendszer a Git. Fő versenytársa a Subversion (SVN), egy régebbi rendszer.

De a bootcamp-ek és az oktatóprogramok túlnyomó többsége a Git-et fogja használni, tehát ezt ajánlom, hogy tanuljon meg.

További irodalom

  • Gyors bemutató a Git használatának alapjairól
  • Részletes útmutató a GitHub használatához

Most, amikor elmagyarázunk a ténylegesen használt nyelveket és kereteket, olyan kifejezéseket fogunk használni, amelyekkel valószínűleg már találkoztam: az első és a hátsó.

Az első oldal arról szól, hogyan néz ki a webhely vizuálisan.

Sarah Maes a GIPHY-n keresztül

Az elülső oldal (vagy kliensoldal) arra utal, amit a felhasználó böngészője tölt be, más néven az ügyfél.

Ez lenne a HTML és a CSS, amelyről elkezdtünk beszélni. A JavaScript eredetileg csak front-end nyelv volt, de manapság használhatja a JavaScriptet szerver oldali vagy back-end nyelvként is.

A front-end munka nagyban foglalkozik azzal, hogy a weboldal jól néz ki.

Ezenkívül azt is magában foglalja, hogy a webhely a felhasználó számára értelmes módon viselkedjen (UX vagy felhasználói élménynek is hívják).

Ha szívesen módosítja a CSS-t, hogy megbizonyosodjon arról, hogy a weboldal tökéletes pixel-e, és finom JavaScript animációkat ad hozzá, amelyek segítik a felhasználót, akkor valószínűleg élvezni fogja a front-end fejlesztést.

A hátoldal a funkcionalitásra és annak biztosítására szolgál, hogy minden működjön.

Míg az előtér a weboldal megjelenéséről és vizuális viselkedéséről szól, a hátsó az, hogy mindent működjön a színfalak mögött.

Ha háttér-fejlesztésben dolgozik, akkor olyan feladatokat fog végezni, mint például a kiszolgálóra és az adatbázisra vonatkozó kérelmek kezelése.

A háttérmunka néhány példája az adatok mentése, amikor valaki kitölti az űrlapot a kapcsolattartó oldalon, vagy az adatok lekérése a blogbejegyzések megjelenítéséhez egy adott kategóriában, amelyet a felhasználó igényelt.

A háttérmunka magában foglalhatja a weboldal beállítását egy kiszolgálón, a telepítés kezelését és az SQL adatbázisok beállítását.

Ha egy weboldal összes funkcionális részének felállításának ötlete szórakoztatónak számít neked, élvezheti a háttér-munkát!

Összerakva mindkét oldalt

A front-end és a back-end nevek azért jöttek létre, mert a front-end az, amit láthat a böngészőben.

És a hátsó rész az a rész, amelyet nem lát, de sok nehéz emelővel és funkcionalitással foglalkozik, amely elősegíti az előlapot.

Gondolkodhat az elülső oldalra, mint egy üzlet kirakatára, az egyetlen olyan részre, amelyet a legtöbb vásárló látni fog. A háttér olyan, mint a gyártási, forgalmazási és üzemeltetési központok, amelyek segítenek az üzlet működésében.

Mindkettő különálló funkciókat szolgál, amelyek ugyanolyan fontosak.

Elülső, hátsó vagy teljes verem?

A webfejlesztés során csak a kezelőfelületre vagy a hátsó oldalra lehet összpontosítani. Vagy foglalkozhat mindkettővel, amit teljes verem fejlesztésnek hívnak.

Amit úgy dönt, hogy összpontosít, főleg két dologtól függ:

  • Személyes preferencia: Nem mindenkinek tetszik az elülső és a hátsó oldal.
  • Álláslehetőség: Böngésszen a helyi állásajánlatokban, és vegyen részt a helyi kódolási találkozókon, hogy megértse, milyen típusú munkák vannak.

Érdemes megemlíteni, hogy ha egyaránt élvezi az elülső és a hátsó elemet, akkor teljes verem-fejlesztővé válhat piacképesebbé.

Ennek van értelme - minél több technológiával dolgozhat, annál több feladatot tudja végrehajtani.

A verem túlcsordulása a 2017. évi felhasználói felmérés szerint 63,7% -át teljes készlet-ként, 24,4% -át háttérképként és 11,9% -át elsőrendű fejlesztőként azonosították:

Forrás: Stack Overflow 2017 felmérés

Ez azonban ismét erősen függ a társaságtól. Egyes vállalatok teljes verem-fejlesztőket használhatnak, ahol mások megosztják a hátsó és előlapokat.

Néhányuknak a front-end fejlesztői is átterjednek a tervezésre, ahol a fejlesztők megtervezik és felépítik az alkalmazás első felét.

2. rész: Az elsődleges készségek ragyogása

Miután elsajátította a HTML, CSS és a JavaScript alapjait, elkezdheti a fejlettebb készségek elsajátítását az elülső oldalon.

Ez a szakasz azokat a gyakorlatokat és eszközöket ismerteti, amelyek elősegítik a piacképesebb készségek fejlesztését web-fejlesztőként.

A reagáló formatervezés elengedhetetlen része ebben a mobilbarát világban

Amikor a webhelyek először körül voltak, csak egy módon lehet megtekinteni őket: a számítógépen.

Az okostelefonok és a mobil adatok még nem léteztek. Webhely létrehozásakor csak azért kell aggódnia, hogy hogyan néz ki a számítógépe.

A Statcounter.com szerint most több ember használja a telefonját, mint az asztali számítógépét az internet böngészéséhez.

Tehát meg kell győződnünk arról, hogy minden weboldalunk működik és jól néz ki mindent, a legnagyobb monitortól a legkisebb telefonig.

Ez a gyakorlat az úgynevezett érzékeny tervezés. Úgy hívják, mert a formatervezés képes "reagálni" minden olyan eszközre, amelyik megtekinti.

Kipróbálhatja, hogy a weboldal milyen érzékenyen reagáljon, manuálisan megváltoztatva a böngészőablak szélességét, és megnézve, hogyan néz ki a formatervezés nagy és kis szélességben.

Egy igazán érzékeny webhely felépítése sok tervezést igényel a tervezési szakaszban, hogy meggondoljuk, hogyan fog kinézni minden eszköz minden eszközén. A webfejlesztési szakaszban médialekérdezésekkel kell ellenőrizni, hogy mely CSS tulajdonságokat használják meghatározott szélességben.

A keretrendszer segít gyorsan reagáló webhely felépítésében

Mint gondolnád, egy reagáló weboldal összes CSS-jének kódolása sok munkát igényel.

Ha nem szabad sok időt kímélni, akkor megpróbálhat egy érzékeny keretet, mint például a Bootstrap vagy a Zurb Foundation.

Példa egy oldalra, amelyet a Bootstrap segítségével hozhat létre

Ezeknek a kereteknek a szépsége az, hogy előre csomagolva vannak az egyedi CSS és a JavaScript. Nagyon sok munkát végeztek az Ön számára az olyan elemek előzetes formázásával, mint a címsorok és a gombok.

Szintén jönnek JavaScript-összetevőkkel (alapvetően kis bővítményekkel), például a modális felbukkanó ablakokkal és navigációs sávokkal.

Mivel olyasmit használ, amelyet már teszteltél, ez sokkal könnyebbé teszi webhelyének felépítését. Az egyetlen figyelmeztetés az, hogy nem szabad túlságosan függni a keretrendszerektől.

Nem helyettesíti azt, hogy megtudja, hogyan lehet reagáló weboldalt létrehozni a semmiből.

További irodalom

  • Példák az érzékeny tervezésre a Designmodo.com webhelyről
  • Rugalmas webdesign alapjai a Google-tól
  • Bootstrap 4 bemutató a W3Schools-tól
  • Zurb Alapítvány oktatóanyagai

A Sass időt és fejfájást takarít meg a CSS írásakor

Miután megismerte a CSS alapjait, elkezdtem tanulni a Sass-ot, mert ez egyszerűen fantasztikus.

Még a nevében is! A Sass a „Szintaktikailag fantasztikus stíluslapok” kifejezést jelenti. És a weboldalán azt írják le, mint „a CSS kiterjesztése”.

Sokkal könnyebbé, intuitívabbá és gyorsabbá teszi a CSS stílusok írását.

Ne érts félre, a CSS nagyszerű. De amint belépsz rá, rájössz, hogy a rendszeres vanília CSS nagyon unalmas lehet. És ha nem vagy túl szervezett a stílusok megírásában, akkor a CSS-stílusok frusztrálóan összezavarodhatnak.

Amit Sass tesz, az nagyobb energiát és irányítást biztosít Önnek.

Íme néhány példa arra, hogy Sass hogyan fogja megkönnyíteni az életét:

  • Mixins: Ahelyett, hogy bizonyos elemekre CSS-kódot milliószor másolna és beillesztne, használhatja a mixineket. Ezek lehetővé teszik, hogy csak egyszer írjon stíluskészletet egy elemhez, és annyiszor használja újra, amennyit csak akar.
  • Fészekrakás: Ahelyett, hogy egy adott stílus összes szülőosztályát megírná, az összes gyermeket beillesztheti a szülő stílusaiba. Ez sok másolatot eredményez.
Íme egy példa a Sass fészkelésének használatára.

Röviden: a Sass használata időt és bosszantást takarít meg. Megér egy erőfeszítést, ami megtanulja!

További irodalom

  • Kezdeti lépések Sass-szal
  • Sass alapjai

Egy megjegyzés: mivel a böngésző nem tudja elolvasni a Sass-fájlokat, a Sass-fájlokat CSS-be kell fordítania.

Ehhez használnia kell valami építőeszközt, amelyet futtatnia kell a számítógépen.

Ami a következő szakaszhoz vezet minket ...

Amúgy is ezek az építőeszközök?

Valószínűleg hallotta a következő kifejezések közül egyet vagy többet: npm, Webpack, Grunt, Gulp, Bower, Fonal ... a lista elég hosszú lesz!

Ezeket az eszközöket gyakran építőeszközöknek, feladatkezelőknek, feladatkezelőknek vagy „MOST kell telepítenem ?!”

Néhány eszköz elvégzi az Ön munkáját (szándékosan!)

Az olyan eszközöket, mint a Grunt, a Gulp és a Webpack, általában a következő feladatok elvégzésére használják:

  • Sass fájlok feldolgozása CSS-be
  • Több CSS vagy több JavaScript fájl összefűzése (kombinálása) egy nagy CSS vagy JavaScript fájlba.
  • CSS, JavaScript és akár képfájlok tömörítése (tömörítése)
  • A böngésző automatikus frissítése a frissített CSS vagy JavaScript kóddal

Természetesen ezek közül a feladatok közül sokat kézzel is elvégezhetsz.

Fárasztóvá válik azonban, ha újra és újra el kell végeznie egy kis CSS vagy JavaScript módosítást.

Melyik eszközöket kell használni?

Jelenleg a Webpack veszi át a pályát, de Grunt és Gulp továbbra is használatban vannak.

Határozottan megtanulom a Webpack-et, de nem ártani sem a Grunt, sem a Gulp tanulásnak (a Gulp gyorsabb, és kicsit könnyebbnek tűnik felkelni és futni).

Más eszközök telepítik a csomagokat (beépülő modulokat) az Ön számára

Ezen felül az összes fenti feladat elvégzéséhez általában be kell töltenie és telepítenie kell a bővítményeket vagy csomagokat.

Itt hasznos egy olyan eszköz, mint az npm (Csomópont csomagkezelő), a Bower vagy a Fonal. Ezek olyan eszközök, amelyek lehetővé teszik a csomagok gyors telepítését a számítógépre, ha parancsokat írnak be a számítógép parancssorába.

Eszközök, amelyek alapvetően további eszközöket szerezhetnek Önnek!

Mivel az npm jelenleg az uralkodó csomagkezelő, feltétlenül meg kell tanulnia használni.

A Bower volt az egyik első csomagkezelő eszköz, de hivatalosan elavult - a Bower.io alkotói most a Yarn használatát javasolják.

A fonal egy nagyon npm-szerű eszköz, amelyet a Google, a Facebook és mások hoztak létre, és megígéri javítani az npm által felvetett néhány problémát.

Amíg a fonal kisebbségben van, még mindig azt javaslom, hogy nézd meg, mivel úgy tűnik, hogy egyre népszerűbb.

További irodalom

  • Hogyan lehet a Webpack +2.0-t a nulláról telepíteni?
  • Javascript szerszámkészlet - A JS és a front-end készítő eszközök fejlődése és jövője
  • NPM vs fonal-csaló lap

Mindenki szereti a JavaScripti kereteket

Valószínűleg egy csomó JavaScript-keretet, könyvtárat, eszközkészletet és így tovább észrevettél, hogy körül vannak dobva ... tudod, azok a nevek, amelyek mind „.JS?” -Vel végződnek

Először térjünk vissza és határozzuk meg, hogy mi a JavaScript keret.

Attól függően, hogy kivel beszélget, a keret, a könyvtár és / vagy az eszközkészlet kifejezések cserélhetők, vagy nem. (Még vita alatt áll.)

De mindegyik lényegében olyan eszköz, amely meglepően meglepő módon a munka néhány részét az Ön számára elvégzi.

A keret egy előre elkészített struktúra, amelyre épít.

Általánosságban elmondható, hogy a keret valamely más által létrehozott munkadarab-rendszer.

A keret használatához telepítenie kell a saját webhely fájljain. Ezután kidolgozza azt a meglévő struktúrát, és hozzáteszi, hogy megvalósítsa azt, amit meg akar tenni.

A keret használata olyan, mintha egy csupasz csontot vásárolna, amelyhez minden szerkezeti elem tartozik (alap, keret, tető), de nem teljesen kész.

Még be kell mennie és csatlakoztatnia kell a vizet és az elektromos áramot, valamint szekrényeket kell felszerelnie, festeni a falakat és díszíteni.

Néhány példa a JavaScript front-end keretrendszerére: React, Vue és Angular.

A könyvtár egy előre elkészített eszközkészlet, amelyet hozzáad a saját struktúrájához.

Összehasonlításképpen: a könyvtár olyan egyedi összetevők gyűjteménye, amelyeket elvehet és beilleszthet saját rendszerébe.

Ez a fő különbség a keretek és a könyvtárak között:
Míg a keretek előre elkészített struktúrák, addig a könyvtárak önmagukban nem struktúrák. További funkciókat biztosítanak a meglévő rendszerek számára.

A házépítés analógiájának folytatása érdekében olyan könyvtárakra gondolhat, mint olyan készülékek, amelyeket úgy dönt, hogy hozzáad a házához.

Az olyan gépek, mint a sütők, zuhanyzók és légkondicionálók, külön funkciót látnak el, de ezeket hasznos használatuk érdekében meg kell telepíteni egy meglévő házba.

A fenti osztályozás használatával egy könyvtár egyik példája a jQuery.

A jQuery egy JavaScript könyvtár, amelynek önmagában nincs semmilyen felépítése, de több mint 300 különféle funkciója van, amelyek használhatók.

Ezekben a meghatározásokban sem mindenki egyetértett.

A React és a jQuery könyvtárakba sorolják magukat, míg az Angular és a Vue kereteknek hívják magukat.

Saját személyes megértésem azonban segít az eszközök elkülönítésében a keretrendszerek (rendszerek) és a könyvtárak (eszközök) e két általános csoportjába.

Ami a következő ponthoz vezet minket ...

A három nagy JavaScript-keretrendszerben: szögletes, reagáló és védő

A 2010-es évek elején robbanás történt a „.js” -vel végződő keretek havonta.

Ahogy közeledünk 2020-hoz, a mező kitisztult, és a három nagy nyertest meghagyjuk: Angular, React és Vue.

Lehetséges, hogy a JavaScript-keretrendszer tendenciaként kezdett megjelenni, de határozottan itt vannak, hogy fennmaradjanak.

A Sarkos, A Reaktív és a Vue mindegyike növekszik, és maga a JavaScript jelenleg is rendkívül népszerű - ez a Stack Overflow éves felmérésének ötödik éve a leginkább használt technológia.

Ezenkívül a Stack Overflow közzéteszi a technológiák trendeit annak alapján, hogy hány kérdést tesznek fel havonta.

Láthatjuk, hogy a Angular-nak van a legnagyobb mennyisége, és mind a Angular, mind a React növekedése az utóbbi évben meglehetősen meredek volt.

Forrás: Stack Overflow - JavaScript keretrendszer trendei

A JavaScripti állam felmérése azt mutatja, hogy a React azon fejlesztők számában szerepel, akik már használják és szeretik, míg Angular nem tűnik annyira érdekesnek, vagy annyira vágyakozik az újrafelhasználásra.

A Vue tényleges felhasználása kevesebb, de vezeti a csomagot abban a technológiában, amelyet a fejlesztők a jövőben kipróbálni akarnak. Tehát megvalósítható, hogy Vue a következő néhány évben nagyobb szereplővé váljon.

Úgy gondolom azonban, hogy mindhárom ragaszkodik hozzá, legalább a következő néhány évre.

TL, DR: Melyik keretet kell megtanulnom most?

Attól függ - ha teljes munkaidőben szeretne webfejlesztő munkát szerezni, akkor böngésznék a helyi állásleírásokban, hogy lássa, melyik keretet tűnik a leginkább megemlíteni.

Ha éppen most tanul, anélkül, hogy ezt a konkrét célt szem előtt tartanánk, a Vue jó hely a kezdéshez. Könnyű és nagyon jól dokumentált.

Személy szerint én nem csak Vue-t tanulnék. Jó ötlet lenne, ha végül hozzáadna Reakciót vagy Szögletet az eszközövéhez, tetszésének függvényében.

További irodalom

  • A 2017-ben használható legjobb JavaScript-keretek, könyvtárak és eszközök
  • A Noob útmutatója a JavaScript-keretrendszer kiválasztásához

3. rész: Menjünk be a háttérbe

Melyik nyelvet kell elõször tanulni?

Van egy csomó háttér-nyelv. Sokan közülük már jó ideje vannak, néhányuk még az internet létezése előtt is!

Ez megnehezítheti annak kiválasztását, hogy melyik nyelvet kezdje. A választások szűkítése érdekében a következő elveket javaslom alkalmazni döntéseire:

  • Válasszon egy tanulható nyelvet: ésszerű tanulási görbével rendelkezik, jól dokumentált és / vagy jó online támogatási rendszerrel rendelkezik.
  • Válasszon olyan nyelvet, amely releváns az esetleges karriercélokhoz.
  • Válasszon egy nyelvet, amely élvezetes. A webfejlesztés elsajátítása elég nehéz - nincs értelme arra kényszeríteni magát, hogy megtanuljon egy olyan nyelvet, amely valójában nem tetszik.
Fontos szem előtt tartani, hogy nem kell minden nyelvet elsajátítania.
Valójában, ha kezdő vagy, erősen ajánlom, hogy először az egyik nyelvre összpontosítson.

Az összes programozási nyelv közös közös elvekkel rendelkezik.

Írhat például egy „for” hurkot a JavaScript, a PHP, a C # és a Python számára.

Miután kiválasztotta az első nyelven történő programozás alapelveit, könnyebb lesz ezeket a fogalmakat más nyelvekre átvinni.

Remélem, ez kis nyomást gyakorol az első háttér-nyelv kiválasztásához, amelyet megtanulsz

Vessen egy pillantást néhány legnépszerűbb háttér-nyelvre.

Jáva

A Java egy stabil nyelv, amelyet nagyon széles körben használnak és hosszú ideje működik. 2001 óta a TIOBE index első helyezettje. (A TIOBE a programozási nyelvek rangsorolása a keresések száma szerint.)

Forrás: Ben Putano a Stackify.com webhelyen

Ezenkívül a Java a harmadik helyen áll a Stack Overflow leggyakrabban használt nyelvek rangsorában, és a második legmagasabb címkével ellátott kérdései vannak a Stack Overflow-ról.

Forrás: A leggyakoribb programozási nyelvek, Stack Overflow Developer Survey 2017

Sok nagy technológiai vállalat használja a Java-t webhelyein: többek között a Google, a YouTube, a Facebook, az Amazon és a Twitter.

Ennek egyik oka, hogy a Java gyors, és méretezhető nagy webhelyek kezelésére. Ez egy egységes nyelv, amely megkönnyíti a hosszú távú projektek karbantartását.

A Twitter eredetileg a Ruby on Rails webhelyen készült. De 2015-ben képeseknek voltak támogatni hatalmas növekedésüket, így átváltottak a Scala nyelvre, amely a Java virtuális gépen fut.

C # (C éles)

A C # a Microsoft hozta létre, hogy a Java versenytársa legyen. Láthatjuk, hogy a C # csúcspontja volt a Stack Overflow trendjeinek 2009-ben, és azóta csökken.

Forrás: A háttér-nyelvek halmozott trendei

De még nem számolnék a C # -ot.

Ez egy erőteljes, objektum-orientált nyelv, amely a harmadik legnagyobb számú Stack Overflow-címkével rendelkezik. Ez a harmadik helyezett a Stackify által a legkeresettebb nyelvekkel kapcsolatos kutatásban, valójában a 2017. decemberi állásfoglalásokban.

Forrás: Ben Putano a Stackify.com webhelyen

A C # sokféle alkalmazásban használható, például a Windows asztali alkalmazásokban és az Android programozásban.

Sokat használják a játékfejlesztésben is, a Unity játékmotorján keresztül. Tehát ha érdekli az Android vagy a játék fejlesztése, a C # nagyszerű lehetőség a tanulásra.

node.js

Mint korábban említettük, a Stack Overflow felhasználók által az elmúlt öt évben a JavaScript volt a leggyakrabban használt nyelv.

Ennek nagy része a Node.js-hez kapcsolódik, amely 2017-ben tetején tette a legtöbbet használt keretek és könyvtárak listájának.

Forrás: A leggyakoribb keretek és könyvtárak, Stack Overflow Developer Survey 2017

A Node.js, amelyet önmagában „JavaScript futási időnek” neveznek, alapvetően a JavaScript, amely a hátoldalon fut.

Eredetileg az Apache HTTP szerver hatékonyabb alternatívájának szánták. A Node.js 2009. évi megjelenése óta folyamatosan növekszik a használata, gyors, könnyű jellege miatt.

A csomópont-fejlesztők gyakran használják az Express keretrendszert webes alkalmazások készítésekor. Az Express.js egy „minimalista webes keret” a Node.js számára.

A Node és az Express használatával a hátoldalon, valamint a Angular vagy a React használatával a felhasználói felületen, ez azt jelenti, hogy teljes veremű JavaScript fejlesztő lehet.

Ez a verem vagy a technológiák kombinációja jelenleg nagyon népszerű, főleg az induló vállalkozásoknál.

Piton

A Python 1991-ben jelent meg először a színpadon, és sok programozó hallgató gyakori „első nyelve”.

Az olvashatóság és az angol kulcsszavak használata miatt általában könnyen megtanulható nyelvnek tekintik.

Van néhány Python-keret, amelyet használhat:

  • Django (előre beépített funkciók, több csengő és síp) és
  • Lombik (minimális és rugalmas).

A Python népszerűsége az utóbbi években megugrott. Az írástól kezdve a 4. helyen van a TIOBE indexben.

És 2017-ben a második évre került a GitHubra vonatkozó vontatási kérelmek számában, a 2017-es év áttekintéséről szóló jelentésük szerint.

Forrás: Ben Putano a Stackify.com webhelyen

A Stack Overflow tavaly szeptemberben számolt be arról, hogy az adattudomány, a gépi tanulás és az akadémiai kutatás nagyrészt a gyors növekedés oka.

Még ha nem is adattudós, az adatokkal való együttműködés és az adatok kezelése hasznos készséggé válik.

Amint Alexus Strong, a Code Academy írja:

"A Python vonzó minket a nem technikai területeken, mert az adatelemzést [...] karnyújtásnyira teszi."

Ha kíváncsi az adattudományra vagy a gépi tanulásra, a Python nagyon jó lehet a számodra, mivel ezek a mezők valószínűleg bővülnek az elkövetkező években.

Rubin

A Rubint először 1995-ben adták ki. Nagy figyelmet kapott a 2000-es évek elején, amikor az induló Basecamp feltalálta a Ruby on Rails keretet.

A Ruby kezdőbarát szintaxisával és olvashatóságával kombinálva a Rails nagyon gyorsan és egyszerűen készítette a webes alkalmazásokat.

A Ruby on Rails népszerűsége növekedett, és az induló vállalkozások számára választott keretévé vált. (A Codepen.io, a GitHub és a Shopify mind a Ruby on Rails-t használja.)

Ruby azonban soha nem volt az egyik legnagyobb ütő. Tavaly a Stack Overflow által leggyakrabban használt nyelvi rangsorban és a TIOBE indexben a tizedik helyet érte el.

Ezen túlmenően a Ruby on Rails skálája nem olyan jó, hogy az induló vállalkozások végül más nyelvekre váltanak, amikor valóban nagyok lesznek (például a Twitter átvált a Java-ra, amint fentebb említettük).

Lehet, hogy nem feltétlenül rangsorolja a rangsorot, de a Ruby továbbra is jó választás az első nyelv tanulásához.

Ha érdekli az induló világ vagy a földrajzi térségében nagyon sok Ruby munka található, fontolóra veszem a Ruby és a Ruby on Rails tanulását.

PHP

A PHP olyan nyelv, amelyet sok ember szeret gyűlölni.

Annak ellenére, hogy számos Quora kérdés felvette a PHP halálát, továbbra is tény, hogy a PHP manapság a legszélesebb körben használt háttér nyelv.

A W3Techs.com által végzett kutatás azt mutatja, hogy az összes webhely 83% -a használja a PHP-t. (A következő legmagasabb nyelv, az ASP.NET, csupán 14% -ot tesz ki.)

Forrás: W3Techs.com

A tartalomkezelő rendszerek (CMS) a PHP nagy piaci részesedésének fő oka. Az első három CMS - a WordPress, a Joomla és a Drupal - mind a PHP-vel készül.

Maga a WordPress az oroszlánrészét képviseli a CMS piacon, az összes webhely 29,5% -át teszi ki.

Ha szereti vele dolgozni, a WordPress fejlesztése jó hangsúlyt helyezhet a webhelyek testreszabására, valamint a bővítmények vagy témák felépítésére.

A tartalomkezelő rendszerek mellett a PHP-nek vannak olyan keretei is, amelyek megkönnyítik és gyorsítják a fejlesztést. A Laravel, a 2011-ben megjelent keret, jelenleg a legnépszerűbb.

További irodalom

  • Bevezető útmutató a háttér-fejlesztéshez (Upwork.com)
  • Szerveroldali webes keretek (Mozilla Developer Network)
  • Mi a számomra a legjobb programozási nyelv?

Munka adatokkal és adatbázisokkal

Forrás: Sherchle a GIPHY-n keresztül

Az adatbázisok félelmetesnek tűnhetnek, ha nem ismeri őket.

Ha azonban gondolkodik rajta, akkor valószínűleg dolgozott és használt adatokat az életében egy bizonyos ponton.

Ha valaha az Excel rendszert használta az adatok szervezéséhez, vagy diagramot készített a célok nyomon követésére, akkor hasonló (bár sokkal egyszerűbb) funkciót végzett az adatbázisok.

Mit kell megtanulnom az adatbázisok használatához?

Szerencsére nem kell sokféle nyelvet megtanulnia. Az adatbázis fő nyelve az SQL (kiejtve folytatódik).

Az SQL-t (Structured Query Language) az 1970-es években hozta létre az IBM, és relációs adatbázisokban használja.

A relációs modell arra szolgál, hogy az adatokat sorokba és oszlopokba rendezzük (úgy gondoljuk, mint egy Excel táblázat).

Az egyes oszlopokat egy bizonyos típusú adat jelöli, és megkövetelheti az adatok megfelelő formázását. És minden sor vagy rekord egy egyedi azonosítót vagy kulcsot tartalmaz az oszlop vagy mező értékén kívül.

Az alábbiakban látható:

Egy egyszerű táblázat, amely hasonló az adatok táblában történő tárolásához. A Bérleti oszlop numerikus értékeket igényelne.

A rekordokat ezután több gyűjteményben tárolják, amelyeket táblázatoknak hívnak. Táblázatgyűjtemény (többek között) alkotja a teljes adatbázis sémát vagy struktúrát.

Az SQL adatbázisrendszerek fő típusai a következők:

  • MySQL (PHP és nyílt forráskódú alkalmazásokhoz használható)
  • Microsoft SQL Server (általában .NET alkalmazásokhoz használják)
  • PostgreSQL (nyílt forráskódú)

NoSQL

Annak ellenére, hogy az SQL az uralkodó adatbázis-típus, létezik egy másik típus is: NoSQL (azaz nem-SQL). Ahogy a neve is sugallja, a NoSQL adatbázisok bizonyos értelemben ellentétesek a hagyományos SQL adatbázisokkal.

A NoSQL nem relációs, és nem érvényesíti ugyanolyan típusú struktúrát, mint az SQL. Ehelyett bármilyen adatot tárolhat egy szabadabb, rugalmasabb típusú rendszerben.

Ez sokkal gyorsabb folyamatokat hoz létre, és sokkal jobb a méretezés nagy, összetett alkalmazásokhoz. A hátránya, hogy feláldozza az adatok konzisztenciáját.

Ahogy Craig Buckler, a Sitepoint írja:

A NoSQL rugalmasabb és megbocsátó, de bármilyen adat bárhol történő tárolása következetességi problémákat okozhat.

A NoSQL népszerűsége nőtt a 2000-es években, mivel a nagy technológiai cégeknek, mint például a Facebook és az Amazonnak gyors módja van az adatok kezelésének és tárolásának.

A MongoDB a leggyakrabban használt NoSQL rendszer. A többi legnépszerűbb típus a Cassandra, az Elasticsearch és a Couchbase, Hackernoon szerint.

SQL vs NoSQL?

Megbeszéléseket folytathat arról, hogy a NoSQL felváltja-e az SQL-t, vagy melyik a jobb. Az igazság az, hogy mindkét típusú adatbázisnak vannak erősségei és gyengeségei.

Mint bármi más, a helyes választás a projekttől és a munkától függően változik. Személy szerint azt javaslom, hogy megtanulják mind az SQL, mind a NoSQL alapjait.

További irodalom

  • Az SQL története - TheBalance.com
  • SQLCourse.com - ingyenes online bemutató az SQL-ről
  • SQL vs NoSQL különbség - XplentyBlog
  • NoSQL magyarázat - MongoDB

Webhelyek létrehozása a szerverekre

Mint az elején említettük, a szerverek egyszerűen olyan számítógépek, amelyek webhelyfájlokat és egyéb erőforrásokat, például adatbázisokat tárolnak.

Annak érdekében, hogy egy weboldal nyilvánosan hozzáférhető legyen az interneten, telepíteni kell azt egy szerverre.

Íme néhány dolog, amellyel együtt kell működnie egy élő webhely létrehozásában:

Domain név és SSL tanúsítvány

A domain nevek a webhely címe, például a Google.com, a Wikipedia.org vagy a Dartmouth.edu.

Annak érdekében, hogy megkapja, ki kell választania egy elérhetőt, majd meg kell vásárolnia egy domain név regisztrátorból, például a Namecheap.com vagy a Google Domains.

Ezek a vállalatok regisztrálják a domaineket az ICANN-nél (Internet Corporation a hozzárendelt nevek és számok számára).

Az ICANN egy központosított szervezet, amely felügyeli és kezeli a globális internet DNS (domain name system) és IP (internet Protocol) területeit.

A domain név mellett SSL (Secure Sockets Layer) tanúsítványt is be kell szereznie a domainjére. Az SSL titkosítja a webhely forgalmát, amely megvédi a számítógépes támadásoktól.

Web gazdaszerver-hely

Miután megszerezte az AwesomeStupendousAmazingSite.com domain nevet, meg kell vásárolnia szerverterületet.

Van néhány különféle szintű webtárhely-tervezés:

  • Megosztott szerverek: A legolcsóbb lehetőség néhány dollártól havonta 12–20 dollárig terjedhet. Mint hangzik, megosztja szerverterületét más webhely „szomszédaival”. Upside a megfizethetőség, hátránya pedig a lassabb sebesség és az esetleges állásidő, ha túllépi a havi felhasználását. Népszerű házigazdák a SiteGround, a Bluehost és a WP Engine.
  • Felhőszerverek: A felhőtárhely viszonylag új lehetőség. Nagyon sok fizikai szerver rendszeréből áll, amelyek összes erőforrása meg van osztva. Ezután minden egyes „bérlőnek” kap egy virtuális szervert, amely erőforrásokat von ki a kollektív készletből. Ez a beállítás nagyobb rugalmasságot tesz lehetővé a sávszélesség szempontjából, és nagyon gyorsan méretezhető. Az egyik cég, a Digital Ocean kizárólag felhőkiszolgálókkal foglalkozik. Az árazás a szerver specifikációjától függ, és havonta néhány dollárig terjedhet, egészen egészen majdnem 1000 dollárig.
  • VPS (virtuális magánkiszolgálók): A VPS hasonló a felhőtárhelyhez, mivel minden bérlőnek saját virtuális kiszolgálója van, és minden bérlő megoszt egy fizikai kiszolgálót. Ez jobb, mint a megosztott tárhely, mert Ön a kiszolgáló erőforrásainak saját szelvényét kapja. Ez az opció egy kicsit drágább, havonta 20–60 dollár (a BlueHost szerint).
  • Dedikált szerverek: Ezek a szerverek mindössze egy teljes fizikai szervert biztosítanak magadnak. Mint gondolnád, ez a lehetőség a legerősebb, de a legdrágább is. Gyakran felügyelt szerverek is, vagyis a vállalat karbantartást fog végezni és más feladatokat is elvégz az Ön számára. A dedikált tárhely általában havonta néhány-néhány száz dollárt fizetsz, a SiteGround árazása szerint.

Szerver beállítása és karbantartása

Miután megszerezte a domain nevét és a kiszolgálóterület, beállítania kell a webhelyet a szerveren.

Ez magában foglalja a domain név irányítását a szerver egyedi IP címére, a webhely fájljainak és adatbázisának (ha szükséges) beállítását, valamint más konfigurációkat.

Az, hogy mennyi munkát kell elvégeznie, attól függ, hogy milyen szervertervet vásárolt meg a web host-tól. A legegyszerűbb megosztott tervek gyakran egy kattintással elérhetők, amelyek automatikusan telepítik a WordPress, a Drupal vagy más webhelyeket az Ön számára.

Más szerverek, például a Digital Ocean, nagyon minimálisak, és megkövetelik, hogy mindent manuálisan állítson be.

Fájlok telepítése a szerverre

Kíváncsi lehet, hogy hogyan hozhat fájlokat a saját számítógépéről a szerverre. Ezt egy protokoll használatával érheti el, amely alapvetően fájlok vagy más adatok átvitelére szolgál a kiszolgálóra és a kiszolgálóra.

Oldalsó megjegyzés: A HTTP, ahogyan a böngésző betölti a webhelyeket, szintén egy protokoll - a HTTP a Hypertext Transfer Protocol-t jelenti.

A legegyszerűbb módszer az FTP (File Transfer Protocol) nevű protokoll használata. Az FTP használata azonban már nem ajánlott, mivel nem biztonságos (titkosítva).

Manapság a legtöbb ember biztonságosabb FTPS (FTP over SSL) vagy SFTP (Secure SHell FTP) protokollokat használ.

Ahhoz, hogy az FTP / SFTP működjön, létre kell hoznia egy fiókot a szerveren. Ezután csatlakozni fog a kiszolgálóhoz a kiszolgáló IP-címével, valamint a hitelesítéshez felhasználónévvel és jelszóval történő bejelentkezéshez.

A fájlok FTP / SFTP-n keresztüli átviteléhez használhat olyan programokat, mint a Filezilla vagy a CyberDuck. Ezeknek grafikus felhasználói felületük van (grafikus felhasználói felület), amely megkönnyíti a fájlok feltöltését és letöltését a számítógépre és a szerverre, illetve a számítógépről.

Telepítési eszközök

Mint gondolnád, a fájlok kézi feltöltése a szerverre minden alkalommal, amikor egy kis kódot megváltoztat, unalmasá válhat. Ezen túlmenően a dolgok zavarossá válhatnak, ha több ember dolgozik ugyanazon a fájlon, és egyszerre tölt fel.

Szerencsére beállíthat olyan telepítéseket, amelyek összekapcsolódnak a Git-tárolóval.

A telepítési eszköz tárolja az FTP / SFTP beállításait, és amikor például a Git változtatását átadja a fő ágnak, az eszköz átviszi a fájlokat az Ön számára. Ilyen módon nem kell megjegyeznie, hogy mely fájlokat módosította, csökkentve ezzel a hibák számát.

Bonyolultabb webhelyek esetén, ahol több emberből álló csapat működik, fejlettebb telepítési eszközök és rendszerek vannak, amelyek felhasználhatók a telepítések strukturáltabbá tételére.

Ezek a rendszerek kívül esnek a cikk hatályán, de magukban foglalnak olyan gyakorlatokat, mint a folyamatos integráció.

További irodalom

  • Domain név regisztráció folyamata - WHOIS
  • 8 népszerű webtárhely-szolgáltatás típus - TheBalance.com
  • 6 legjobb FTP-ügyfél - WP kezdő
  • Folyamatos integráció vs. folyamatos szállítás vs. folyamatos telepítés - Atlassian

Gratula!!

Megtettél már!

Most, mielőtt folytatnánk az erőforráslistát, kérjük, vegye figyelembe, hogy a következő szakasz néhány kapcsolt linket tartalmaz. Ez azt jelenti, hogy kapok egy kis jutalékot a társaságtól, ha a link segítségével vásárol.

Ez egy egyszerű módja annak, hogy támogathatja az ilyen típusú cikkek írását, önmagának semmilyen extra költség nélkül. (Nem társult linkeket is felvettem, ha inkább ezt szeretné használni.)

Epilógus: Ajánlott tanulási források

Mint biztos vagyok benne, tudod, rengeteg erőforrás használható a kód megtanulására.

Itt találtam néhány legnépszerűbb és ajánlott online oktatóanyagot, könyvet és egyéb forrást.

Teljes webfejlesztési tanfolyamok

Van néhány online tanfolyam, amelyek lefedik a webfejlesztés összes területét, vagy nagyon közel vannak hozzá.

Ha nem akarja ugrálni, és csak egy helyre akarja koncentrálni, hogy mindent megtanuljon, az alábbiak közül egyet vagy többet ajánlom:

A freeCodeCamp egy nonprofit szervezet, amely teljesen ingyenes oktatást kínál a törekvő webfejlesztők számára.

Tantervük egy átfogó tanfolyam-készletet kínál, az elejétől a végéig (Node és Express használatával) és így tovább!

Sokan teljes munkaidőben foglalkoztak a freeCodeCamp használatával. A nyílt forráskódú projektekhez a GitHub segítségével is hozzájárulhat.

A freeCodeCamp egyik legfontosabb szempontja, hogy nagyon közösség-központú, üzenőfalakkal és Facebook-csoportokkal, így sok támogatást kaphat tanulása közben.

Elolvashat néhány véleményt a freeCodeCampról a Quora és a Reddit webhelyen.

Colt Steele webfejlesztő Bootcamp (társult link / nem kapcsolt link)

Colt volt volt a kódoló bootcamp oktató, aki a teljes bootcamp-t akart kínálni az ár töredékéért.

Végül az egyik legnépszerűbb és legjobban értékelt webes fejlesztő tanfolyamot hozta létre az Udemy-n, jó indokokkal.

Tanfolyama az alapoktól kezdve a teljes verem fejlesztésén keresztül (a Node és az Express hátteret használja), sok tartalommal és gyakran frissítve.

Olvassa el az ő tanfolyamáról szóló értékeléseket az Udemy oldalon, valamint a freeCodeCamp fórumbejegyzésben.

Az Udacity ingyenes tanfolyamokat és fizetett programokat is kínál Nanodegrees néven.

A nanofokok felépítik az ingyenes tanfolyamokat - intenzív (heti 12 óra) programok, ahol portfólió projekteket készítenek, és több közösségi interakció és támogatás áll rendelkezésükre.

Nem olcsók, jelenleg 199 dollár / hónap, és az elkészítése 6-10 órát is igénybe vehet.

Ha érdekli, íme néhány áttekintés az Udacity Nanodegree programjáról a Quora és a Hacker News oldalról, és Quora válaszokat talál az Udacity ingyenes tanfolyamok és a Nanodegree közötti különbségről.

Egyéb források

A Team Treehouse nagyon népszerű weboldal a kódolás megtanulására. Nincs ingyenes tartalma, de előfizetési modellt használnak.

A Treehouse többszintű havi terveket kínál (jelenleg 25 vagy 55 dollár / hónap), és korlátlan kurzusokat vehet igénybe.

A tagságát is szüneteltetheti, ha néhány hónapra szünetet szeretne tartani, és később folytathatja, amikor készen áll.

Az egyes tanfolyamokon kívül strukturált pályáik is vannak, például a Java Web Development vagy a Front End Web Development, amelyek végigvezetik a kiválasztott tanfolyamok sorozatát.

Udemy (társult link / nem kapcsolt link)

Az Udemy az egyik legnagyobb online tanulási platform, és tanfolyamai vannak nemcsak a kódolás területén, hanem más szakmai és hobbi tevékenységek területén is.

Az egyes kurzusokért külön-külön fizet, és gyakran értékesítik őket, ahol a kurzusok mindegyike 10–20 dollárba kerül.

A tanfolyamok és oktatók nagy száma miatt természetesen eltérőek a minőségük, ezért vásárlás előtt meg kell vizsgálnia.

Azt javaslom, hogy ellenőrizze az értékeléseket és az értékeléseket mind az Udemy tanfolyam oldalán, mind másutt online.

Wes Bos egy webfejlesztési oktató, aki nagyon sok nagyon népszerű tanfolyamot készített.

Az egyik tanfolyam, amelyet határozottan megnézek, a JavaScript30 (affiliate link / non-affiliate link). Ez az ingyenes 30 napos vanília (azaz nincs keret vagy könyvtár) JavaScript-kódolási kihívása.

Prémium tanfolyamokat folytat a React, a Node és a fejlettebb JavaScriptekkel kapcsolatban a webhelyén.

Kíváncsi, itt van néhány vélemény a Redditről szóló tanfolyamairól és a freeCodeCamp fórumról.

A Microsoft Virtual Academy (MVA) ingyenes online tanfolyamok gyűjteményét kínálja, kezdve a C # -től és a Python-tól az SQL Server-ig és más területeken, például a játékfejlesztésig.

Néhány népszerű tanfolyamuk a Bevezetés a programozásba a Python, C # Fundamentals és SQL Database Fundamentals programokkal.

Íme néhány áttekintés az MVA tanfolyamokról a Reddit és a LinkedIn témában.

A SoloLearn egyedülálló megközelítést alkalmaz a kódolás megtanulására: nemcsak a saját webhelyüktől tanulhatnak, hanem ingyenes mobilalkalmazásukból is.

Néhány legnépszerűbb tanfolyamuk a Python, C ++ és Java.

Rendelkeznek egy StackOverflow típusú üzenőfalakkal is, amelyek meglehetősen aktívak kérdésekkel és megbeszélésekkel.

Kíváncsi, nézd meg a SoloLearn on Reddit és Quora véleményeit.

Könyvek

Ha szereti tanulni a könyvekből, vagy szeretne néhányat referenciaként, az alábbiakban bemutatjuk egy rövid listát azokról a könyvekről, amelyekről azt gondoltam, hogy jó a kezdőknek.

Néhányuk ingyenes és online olvasható, és mások hagyományos papírkönyvek.

HTML és CSS Jon Duckett (társult link / nem kapcsolt link)

JavaScript és JQuery: Jon Duckett (affiliate link / non-affiliate link)

Jon Duckett könyvei valószínűleg a legnépszerűbb könyvek a kezdő webfejlesztők számára.

Nem csupán egyszerű tankönyvek, hanem szépen megtervezett könyvek, amelyek fotókat és illusztrációkat használnak a kódolási fogalmak tanításához.

A Front-End fejlesztői kézikönyv egy ingyenes online könyv, amelyet a Frontend Masters készített, és Cody Lindley írta.

Évente frissül, és úgy gondolhatja, mint egy „front-end web fejlesztés állapotának útmutatóját”, amely tartalmazza a területtel kapcsolatos új információkat, forrásokat, trendeket és eszközöket.

Az Eloquent JavaScript egy kezdő könyve a programozásról, amely a JavaScriptre fókuszál.

Ingyenesen elolvashatja az interneten a weboldalon, ahol egy ügyes konzol eszköz található, ahol elolvashatja és kipróbálhatja a kódot olvasása közben.

Ha fizikai példányt szeretne, akkor a könyv az Amazon-on is elérhető (affiliate link / non-affiliate link).

Záró gondolatok

Meg lehet-e tanítani magának a webfejlesztést online forrásokkal? Úgy gondolom, hogy a válasz igen.

Ez azonban egyáltalán nem lesz könnyű. Bármi megtanulása és elsajátítása nehéz, és a kódolás megtanulása sem különbözik egymástól.

Tekintettel erre, ha akarsz menni ezen az úton, íme néhány tanács:

Koncentrálj.

Ha egyedül tanul, nagyon csábító lehet ugrani az oktatóprogramok között. Különösen akkor, amikor elkezdi az akadályokat.

Ennek eredményeként nagyon felületesen tanulhat, amikor valójában mélyebb ismeretekre van szüksége a készségekhez.

Próbáljon ragaszkodni ahhoz a tanfolyamhoz / könyvhez, amelyen dolgozik, kivéve, ha igazán nem tetszik. Az akadályok révén folytatott küzdelem segít az anyag teljesebb megértésében.

És minél több látszólag lehetetlen problémát kezel, annál jobban megszokja a kihívásokat.

Bármelyik tanfolyam egyszerűen az első lépés a tanulási útjában.

A bemutató vagy tanfolyam elvégzése nem azt jelenti, hogy a befejezéskor mester leszel. Sokszor meg kell tanulnia és gyakorolnia, mielőtt valóban „megszerezné”.

Próbálkozzon újra egy oktatóanyaggal, vagy akár ugyanazt az anyagot tanulja meg egy másik tanfolyammal vagy könyvvel.

Látni fogja, hogy a különböző emberek hogyan magyarázják ugyanazt a fogalmat, és ez segíthet a tudás jobb tapadásában az agyában.

És természetesen a gyakorlati tapasztalat nem helyettesíthető.

Amint megtanulod, próbáld meg saját maga gyakorolni azokat a képességeket, amelyeket megtanulsz. Építsen véletlenszerű projekteket, készítsen ingyenesen weboldalt egy barátjának vagy nonprofit szervezetnek. Minél többször old meg egy problémát, annál jobban megérti azt.

Köszönöm, hogy elolvasta!

Nagyon remélem, hogy hasznosnak találta ezt a cikket!

Nyugodtan hagyjon megjegyzést az alábbiakban bármilyen gondolattal vagy visszajelzéssel.

Ha jelenleg webfejlesztést tanul, akkor szeretnék hallani a következőkről is:

  • Mi a végső célja, és
  • Az első számú probléma, amelyet a tanulás során tapasztalt.

Többet akar? Egyéb olyan cikkeket írtam, amelyek érdekelhetnek:

Hogyan lehet szopni a kódolás során?

A kódolás megtanulása olyan, mint egy idegen nyelv tanulása

Szeretne kódolni? A kódolásról és a termelékenységről a webhelyemön, a coder-coder.com-ban írok.

Iratkozzon fel itt, hogy e-maileket kapjon az új cikkekről.