Hogyan lesz egy web-programozó nulláról

Front-end fejlesztő megosztja tapasztalatait.

Először is hadd bemutatkozzam: Sergey Garsiya (Sergei Garcia). I teljes munkaidőben front end - a fejlesztő, 2 éves tapasztalat. Ez idő alatt dolgozott, mint tanácsadó cég a listáról Forbes 500, és egy kis cég.

Talán úgy érzi, hogy ez egy kis tapasztalat, de a működésének második évében volt egy fontos mérföldkő. Nem volt igazi élmény a web fejlesztés területén, nem volt sok tapasztalata programozás általában. Van egy alapvető ismeretekkel a C # és Java kapott több online tanfolyamok. Azt is volt a diploma vezetője IT-projektek, nem pedig programozó.

Soha nem írt a tapasztalat, annak ellenére, hogy segítséget kapott a csodálatos források, mint a közepes, Veremtúlcsordulás és vöröses. Ma úgy döntött, hogy változtatni, és elmondani, hogy mi volt a baj, és mi nem. Tehát, ha megy ezen az úton, akkor jobb szerencse, mint én.

Tudom, ebben a témában, írt számos cikket, de nem sokan tárgyalt ez a folyamat egy retrospektív két év tapasztalat.

Elkezdem az utazást. Megfordulok, és nem erről volt szó. Ha érdekel az én ajánlások a legrövidebb utat webfejlesztés az alapoktól kezdve, nyugodtan hagyja az utolsó rész: A legrövidebb út.

Tehát minden további nélkül, kezdjük!

alapjai

Úgy döntött, hogy nem webes fejlesztés, megkérdeztem az első kérdést: „Mit tanulni?”. Miután egy sor keresések, én terveztem a képzési út követelmények alapján a legtöbb belépő szintű webfejlesztők:

Amikor ez megtörtént.

tanulhatnak jQuery (bár én nem ajánlom, erről bővebben később), ha szükséges. Ön is felfedezheti azt CodeSchool, Próbálja jQuery természetesen.

Hasonló természetesen HTML CSS átadhassák Codecademy, hogy hasonló eredményeket. Ha készen áll, hogy folytassa a hívást ráta Udacitynél Bevezetés a HTML és CSS. Azt nehezebb.

Bónusz: Szerezd meg a könyvet Dzhona Daketta (Jon Duckett) HTML és CSS: Tervezés és weblapok (HTML és CSS tervezése és a honlap design) - szilárd kiindulópontot tanulási HTML és CSS. Nagyra értékelték az Amazon (4,7 / 5). Egy alapos bevezetés a világ a webes fejlesztés. Egy gyönyörű könyv, tiszta design, nagy betűkkel, színes oldalakon. Gyakran visszatérni. Félelmetes.

Azoknak ismeretlen, LessSass - ez transpilyatory CSS. CSS írhatunk elegánsabb. Ezek lehetővé teszik, hogy a dolgokat, amelyek általában nem támogatott, mint például a CSS szabályok mellékleteket. Ezek trancpilyatory „lefordítani” a kódot, és átalakítani, hogy a rendszeres CSS.

Jelenleg 2 fő transpilyatora CSS: Kevesebb és Sass. Sass népszerű. Rájöttem, hogy az első könnyebb tanulmányozni Less. Mivel Sass igényel telepítése Ruby, ami nem voltam boldog.

Gyors és átfogó áttekintést Kevesebb, kódmintákat - winless.org/online-less-compiler. Próbálja Sass online sassmeister.com (nem tartalmazza a minta kód).

Nem számít, mit tanulni vagy kevesebb Sass. Ezek nagyon hasonlóak. Ha megtanulod, tudod, és azt jelenti, egy másik. Kiváló összehasonlítása Kevesebb és Sass - összehasonlítása LESSSASS.

Mintegy adaptív kialakítású Bootstrap és tanultam során Codeschool - HTML CSS útját. Nemrégiben találtam egy tanfolyamot Udacitynél Google Érzékeny Web Design alapjai (Fundamentals of reagáló web-design). Félelmetes lefedi az alapokat és azon túl. Hatalmasabb, mint Codeschool.

Tudod teremt egy adaptív tervezés nélkül további kereteket, de ez sokkal könnyebb a segítségével egy olyan érzékeny keret Bootstrap. Hivatalos dokumentáció bootstrap jól megírt, kezdje vele.

Amikor elkezdtem, fogalmam sem volt, hogy mit AngularJS. Sokan azt mondták, hogy ha azt akarjuk, hogy a fejlesztő felfedezni azt.

Először úgy döntöttem, hogy tanulmányozza AngularJS a hivatalos dokumentációt, de ez egy szörnyű ötlet. Dokumentáció nem volt könnyű a kezdők számára, és rendezett formában megnehezítette elolvasni és megérteni.

Keresés a fórumok, rábukkantam Egghead.io (ingyenes / fizetett), több volt szerencsés. A tanfolyam anyaga volt világosabb, rövidebb és teljesebb. Amellett, hogy kurzusokat 2-5 perces órák olyan fontos kérdésekkel. (Például: Mi az adatkezelő Mi a szűrő Mi $ hatálya Ez az egyszerűsített megértését alapjait ???.

Design Patterns - újrafelhasználható szoftver megoldásokat lehet újra felhasználni, hogy megoldja a közös szoftver problémákat. Ismerve az alapokat, akkor lesz versenyképes szoftverfejlesztő bármilyen programozási nyelv. Megértésének elősegítése a kódot mások. Akkor gyorsan melyik tervezési minta használta őket kódot.

Az egyik leghatásosabb eszköze a webfejlesztők számára. Minél hamarabb rendelkeznek, annál több időt takarít később. Ingyenes tanfolyam Codeschool feltárása és Mester Chrome DevTools nagy mesél alkalmazás.

Ah, Git - olyan eszköz, amelyről nem ismert, amíg kinyitotta a képességeit. Git pályák módosításokat hajtott végre a kódot. Ha valami elromlik akkor képes lesz arra, hogy visszatérjen az előző alkalommal. Szintén ez lehetővé teszi, hogy a kódot történetében.

Találtam egy ingyenes tanfolyam Próbáld Github CodeSchool. Atlassian a Git képzés tökéletesen megvilágítja a rendelkezésre álló parancsokat. Codeschool a Git tanulási útvonal is nagy felfedezésére Git alapokat.

Próbáltam tanfolyamok csomópont Codeschool, de rájött, hogy hiányzik belőlük tartalmat. NodeSchool.io sokkal jobb tanár alapjait, és nem unalmas! Tetszett a gyakorlati megközelítést, hasonló Codeschool és Codecademy, de további javulásra.

Task Launcher (Grunt korty)

Grunt és Culp jön a nagy meglepetés, mert nem tudni ezeket az eszközöket, de nem voltam elégedett a képességeiket! Alapvetően ezek lehetővé teszik, hogy automatizálja a közös feladatokat. Emlékezz Kevesebb / Sass?

Vannak 2 fő: Grunt és Culp. Annak ellenére, hogy az identitás, máshogy működik.

A tudás NodeJS segítsen írni jobb Grunt és Culp fájlokat, mert mindkét munka NodeJS. Válassza ki, hogyan szeretné, de rájöttem, hogy Culp sokkal könnyebb. Még jobban szeretem, mert a minimalista megközelítést.

Megtaláltam a tanfolyamok Grunt és Culp a Scotch.io. Ők a legjobb.

A nehézségek találkoztam az első munkahely

A két nagy hibákat:

  • A kudarctól való félelem. Mivel én elsőéves voltam, állandóan félt, hogy a kód hibás, vagy rosszul megírt, így a kiadások egy csomó időt, hogy még egyszer ellenőrizze és tartsa be a legjobb szabályokat kódot írni. Emiatt ritkán kipróbált, hogy új megoldásokat félelem a gyarlóság. Ez gyakorlatilag zárva a vágyam, hogy megismerjék az új dolgokat.
  • Ehhez mert «X», jobban tudja, mint én. Eleinte én. Bár ez nem teljesen rossz, tenni valamit egy bizonyos módon, csak azért, mert egy szakértő azt mondta, így «X» a kérdésben. Nem tudta, miért úgynevezett cseppentve bennem, hogy én tényleg nem tudom, hogyan működik minden. Hamar rájöttem, mindenhol vannak kivételek. Mindig meg kell tudni az oka a gyakorlatban.

Szerencsére a munka során az első projekt volt tisztában csoportvezető, aki segített leküzdeni ezeket a problémákat. Állandóan arra ösztökélt, hogy új dolgokat kipróbálni, akkor is, ha valami elromlott.

Idővel megtanultam a leckét. Azóta várom, hogy új dolgokat. Mindig próbálja megérteni, hogy miért vannak a legjobb gyakorlatokat. ha igazak, és ha ez nem alkalmazható az adott helyzetben.

Alkalmazás AngularJS igazi projekt is bebizonyította, hogy van egy nagy probléma. Főleg azért, mert én nem értem, hogy egy csomó, amit csinálok. Azt hittem, hogy a „mágikus Szög».

Sokszor azt kívántam, nem tudja, hogyan kell igazán működik szögletes, de félt, hogy vizsgálja meg a dokumentációt.

A végén, rábukkantam egy félelmetes könyvet építsünk saját AngularJS. Minden nem olvasta. Miután elolvasta a részben a Célzók és Watchers, és nagyon nyitott, hogy a mágia szögletes, nem igazán varázslatos. És az egyetlen értelmes módja annak, hogy az adatok kötelező felhasználásával vizsgálati adatok változhatnak. Azt javasoljuk a könyvet mindenkinek, aki meg akarja érteni a AngularJS.

A másik probléma, hogy én szembe egy évvel később - a gyors fejlődés az ipar. Miután elsajátította AngularJS és Grunt, büszke és erős. Hamarosan világossá vált, hogy a horizonton, és Nyelő ReactJS. Egy évvel később kezdett lendületbe Webpack. Meg kellett tanítani neki. Ahogy értem, én leginkább csalódott gyors elavulása tudásom. De hamarosan az egyik kollégám már világosított fel, és mondott valamit, hogy megváltozott a látásom a könyvtárak és freyvorkov örökre:

A könyvtárak és keretek elavultak lehetnek, de a koncepciók és megoldások által kínált számukra ellenáll az idő próbáját.

Igaza volt. Angularjs talán elavult, de a megértés a mágia mögött segített, hogy jobban megértsék a Web architektúra komponensek a reagált, amelyet javítani összhangban Szög a irányelveknek. Ő is segített megérteni, hogy ReactJS szerzett annyi népszerűsége, valamint a jövőben.

Nem emlékszem, hogy szembe más súlyos problémák a későbbi projektek. De azt mondani, hogy ez alatt a 2 év. Az első dolog, ami segített abban, hogy sikerül (a véleményét kollégám) - ez az én lelkesedés és elkötelezettség a folyamatos keresés az új. Hamarosan rájöttem, hogy webfejlesztés egy nyerő kombináció, a dolgok változnak, nagyon, nagyon gyors: mindig vannak új minták és könyvtárak.

A másik dolog, hogy sokat segített - értik, amit nem tanult Fontos volt, a folyamat egyre jobb webfejlesztő.

Nagy ötlet, hogy egy egyszerű hello world alkalmazást, hogy a képességeit a platform. Majd lépni. De még mindig jobb, hogy összpontosítani kell a projekt. Eleinte úgy tűnhet, nehéz, de szerencsére vannak kiváló források Veremtúlcsordulás, közepes és vöröses. Ott lesz talál hasznos megbeszéléseket keretek és megtudja, mi is alkalmas egy adott alkalmazás.

megy előre

CSS lehet egy rendetlen és szervezetlen nagyon gyorsan. Azt javasolta, számos különböző módszerek írásához tiszta CSS, de állni 2, ami azt javasoljuk, hogy olvassa el ASAP versenyképesség:

  • SMACSS: skálázható és moduláris felépítésű CSS. A rugalmas útmutató a kis és a nagy telek.
  • BEM: egy módszert, amely segít biztosítani az újrahasználható alkatrészek és járatmegosztások a front-end.

Személy szerint én inkább SMACSS miatt tisztább megjelenés, de néhány vállalat és CSS keretrendszerek még mindig a BEM, ezért szükséges, hogy tudja mind a kettőt.

Két fő játékos:

  • Browserify: lehetővé teszi, hogy telepíteni modulok a böngésző, amely egyesíti az összes függőség.
  • Webpack: elsősorban Browserify a szteroidok. Nehezebb beállításához és telepítéséhez.

Mini-tanfolyam Scotch.io az első lépések Browserify segít elkezdeni a Browserify.

Személy szerint én töltöttem egy kis időt, hogy működjön együtt webpack. De abban az időben dolgoztam vele, és azt kell mondanom: ő egy félelmetes, annak ellenére, hogy a nehéz környezetben. Ha csak most kezdik el, kezdődik Browserify, könnyebb beállítani. Tartsuk szem előtt, hogy webpack - ez a jövő, akkor elkezdi használni a nagy volumenű projektek.

ReactJS egyre népszerűbb, és úgy tűnik, hogy nem vágja vissza.

Természetesen a Schech.io Learning React.js: Első lépések és fogalmak egy komplett áttekintést reagálni. Hogyan adja át, folytassa reagálni alapjai. ugyanazon erőforrás. Ez segít létrehozni egy teljes munkanapon ReactJS alkalmazást, majd átadja azt az ES6 szintaxis. Láthatjuk a hivatalos dokumentumok ReactJS. Jól megírt, könnyen megtanulni.

Mivel reagál - ez csak néző, erősen ajánlott, hogy tanulmányozza Redux. Véleményem legtöbb Redux tanfolyamok egy kicsit bonyolult, de CSS trükkök Önterülő Up reagálni: Redux tökéletesen ötvözi az egyszerűséget és informativitást.

Lehet, hogy hallott Flux, ha kíváncsi, hogy miért érdemes használni Redux, ahelyett, Flux, nézd Veremtúlcsordulás. Miért használja Redux felett Facebook Flux? Ezt a kérdést válaszol alkotója Redux!

Visszatekintve a hibák: mit tanultam?

Ez furcsa, hogy nem gyakran mondják ezt. Nem mindig vigyázni írás tiszta kódot, de hogy őszinte legyek, büszke vagyok, hogy megtanulták azt. Ez azért van, mert mindenki szereti panaszkodnak, hogy az utolsó feladat volt az egyik legrosszabb és legrondább kódot bázisok a világon. Szóval miért senki nem mondja, hogy milyen jó volt a kód?

Szeretném megváltoztatni ezt a tendenciát. Törekedjen arra, hogy értelmes nevet változók és függvények angol, akkor is, ha azt szeretnénk, hogy sokat írnak. Ennek elmulasztása vezet a manuális dokumentáció a jövőben tisztább érzékelés. Az is, hogy értik a alapkód az új fejlesztők és te. Igen, te. Miért? Mert ha nem írok tiszta kódot, hogy majd a kollégái csinálni?

Talán néhányan észrevették, hogy nem tettem, különös tekintettel a jQuery. Ez annak köszönhető, hogy az én tapasztalatom. Rájöttem, hogy a jQuery többet árt nekem, mint hasznot. Néhányan talán nem értenek egyet, de kérem, hadd magyarázzam meg. Amikor először hallottam róla, rájöttem, hogy jQuery használják mindenhol, és szinte mindent. Így kezdtem a jQuery szinte semmit, minden probléma, hogy stolkivaetsya. Keresem a megoldást alapján jQuery.

Érts meg rendesen, jQuery fantasztikus volt, amikor én használtam. Így lenyűgöző, hogy én vakon figyelmen kívül hagyni azt a tényt, hogy 90% általam készített a jQuery, amit tehetünk natívan a modern böngészők ugyanazzal az egyszerű szintaxis.

Ön kérheti, „Akkor mi a baj? JQuery könnyű és csökkenti a kódot. JQuery, inkább, mint a natív API-felület nem volt probléma. A probléma az volt, hogy az én egész gondolkodásmód, és az összes megoldást a közös problémák szüksége a jQuery. Ez lett a hatalmas probléma, amikor megkaptam az első projekt, és azt mondták, hogy jQuery - ez nem okoz függőséget.

JQuery engem tehetetlen. Teljesen figyelmen kívül hagyta a saját módszerek és megoldások. Saját megoldások váltak kevésbé hordozható.

Azóta próbáltam nem a jQuery, ha nem feltétlenül szükséges, és nem nyújt jelentős növekedése a hatékonyság és olvashatóságát kódunk bázis (például nehéz manipuláció a DOM).

Ami az anyagot. Sok tanfolyam CodeSchool csodálatos (különösen a HTML és CSS fi), ide nem értve a hibás keretek (AngularJS, BackboneJS és t.).

Átmentem egy csomó tanfolyamok Pluralsight. ezek nem említettem, mert a végén arra a következtetésre jutott, hogy az a hely, a rossz és megbízhatatlan ötlet. Kurzusok célja a tanárok, akik nem mindig (véleményem szerint) egy jó magyarázat. minősége a tanfolyamok változhat vadul, mert nincsenek minőségi előírásoknak. Vettem tanfolyamok, ami megmagyarázza hangzott itt, itt alszik. Őszintén szólva, lehetetlen, hogy a figyelmet a 6-10 órás tanfolyam. És sokan közülük tart, amíg, ha nem tovább.

Töltöttem 80-100 órás képzés Pluralsight, és őszintén szeretnénk, hogy a visszatérés. Ne érts félre, én ment keresztül számos kiváló tanfolyamok Pluralsight. Száma uralkodó minősége felett késztetett az időmet. Tanulhattam sokkal ha elfogadják nyelvtanfolyamok a legjobb forrásokból, mint például Egghead.io és CodeSchool, ahol értékelik mennyiségi helyett a minőségi.

Az egyetlen ok, hogy tanfolyamok Pluralsight, ha nincs más forrásból (például Installshield vagy Xamarin), vagy menjen egy nagyon speciális kurzusok, amelyek jól árazott (például John Papa Szög alapjai).

Általában, ha a használni kívánt Pluralsight, biztos, hogy adja át a tanfolyamok már eltelt valaki, és akik úgy kiváló minőségű és hasznos.

Word útdíjakat

Úgy érzem, hogy szükség van azt mondják: sokan úgy vélik, hogy ez lehet tanulni programozás nélkül fizet egy fillért sem, és versenyezni azokkal, akik letették a díjtételek mértékében. Ez igaz, de hangsúlyozom, hogy az érték a helyes utat be van állítva. Persze, sok értékes anyagot, amelyet írtam, - ingyenes, de sokan fizetik.

Ha megfelelően használja a lehetőséget, fizet 1-2 hónap bármely őket, akkor könnyen kap egy tudat, hogy kapnánk csak egy év az olvasás számtalan cikket és blogbejegyzések. Ezek meglehetősen jó.

Tehát igen, fizetett tanfolyamok nem szükséges, de ha megengedheti magának, legalább egy hónappal, az biztos, hogy az Ön számára egy erős előny.

A titok siker szósz

2 éve találkoztam sok fejlesztő. Úton találkoztam egy fejlesztő, aki nagyon különbözik - ők egyértelműen a saját bajnokságban. Ezek egyenlő mindenki, beleértve engem is. Azt találtuk, hogy volt egy közös vonás. Ó, hogy megmondja, most. Véleményem titkos szósz sikeres webfejlesztő:

Hű, ez volt legalább hat órán át kell írni ezt a cikket. Majdnem kész! Talán kíváncsi, „Rendben, hűvös történet, de hol van a legrövidebb út?” Itt van.

Azt elintézte neki, mintha ő mehet vissza, és használják azt. Enjoy!

Kapcsolódó cikkek