Vše, co potřebujete vědět, abyste se mohli stát frontendovým vývojářem

Vše, co potřebujete vědět, abyste se mohli stát frontendovým webovým vývojářem!

Pokud se chcete naučit kódovat s cílem stát se front-endovým vývojářem, je třeba vědět mnoho věcí, abyste byli úspěšní a získali práci. Měli byste začít s pevným pochopením základů webového vývoje a poté rozšířit své dovednosti o další nástroje a prostředky, které většina webových vývojářů využívá.

Pokud jste provedli průzkum a jste si jisti, že front-end vývoj je způsob, jak jít za vás, podívejte se na tyto nástroje, které také musíte zvládnout. Znalost těchto nástrojů a zdrojů vám pomůže nejen s procesem vývoje webu, ale také vám pomůže při soutěži o práci vyrazit z vody konkurenci.

A konečně, pokud si nejste 100% jisti, zda se chcete naučit programovat, je něco, co chcete vyzkoušet, zde je 10 důvodů, proč byste se měli naučit programovat.

Co dělá front-endový vývojář

Nejprve musíte přesně vědět, co je front-end webový vývojář. Vývoj webu se obecně skládá ze tří segmentovaných typů pracovních míst:

1. Front-end vývojář. Tato osoba (nazývaná také front-end webový vývojář nebo front-end inženýr) je webový vývojář, který pracuje s front-endem webů a webových aplikací, což zahrnuje vše, co uživatel vidí a používá v prohlížeči webové stránky.. Front-end vývojáři jsou obvykle zaměřeni na design.
2. Back-end vývojář. Tato osoba je zodpovědná za back-end nebo na straně serveru webových stránek a webových aplikací. Na back-endu se manipuluje a aktualizují všechna data. Back-end vývojáři jsou obvykle logičtí myslitelé.
3. Full-Stack Developer. Tato osoba je speciální ninja, který je zručný jak na předním, tak na zadním konci. Pokud vás baví pracovat jak s „hezkými věcmi“, tak se „super techy“ věcmi, může být tato práce pro vás…

Také dávno v galaxii daleko, daleko… existoval název známý jako Web Designer. Webový designér se s učením kódování vůbec nemusel vypořádat a soustředil se výhradně na designové stránky webových stránek.

V dnešní době, protože webové stránky a webové aplikace se staly mnohem funkčnějšími a interaktivnějšími, vyžaduje trh práce služby lidí, kteří vědí, jak navrhovat a kódovat.

Pro webové designéry jsou stále k dispozici některé pracovní pozice, ale většina webových designérů se snaží naučit se kódovat pro lepší příležitosti, výplatu a jistotu zaměstnání. V mnoha ohledech lze na práci front-end vývojáře pohlížet jako na webového designéra, který ovládá programovací jazyk, pravděpodobně JavaScript.

HTML je kostra webových stránek, CSS je vzhled a JavaScript je mozek.

Zvládněte základy

Bezpochyby musíte důkladně pochopit tři základní technologie používané při vývoji webu, jsou to:

• HTML: toto je první základní stavební kámen všech webových stránek, dává strukturu webovým stránkám. HTML je kódovací jazyk, ale není to plnohodnotný programovací jazyk, místo toho je to značkovací jazyk. Značkovací jazyky vám umožňují „označit“ text pro účely zpracování.
• CSS: toto je druhý základní stavební kámen všech webových stránek, je zodpovědný za „vzhled a chování“ webových stránek. CSS také není programovací jazyk.
• JavaScript: je třetím stavebním kamenem a vůbec prvním skutečným programovacím jazykem, který se většina webových vývojářů učí. JavaScript běží v prohlížeči počítače a umožňuje funkčnost webové stránky.

Pokud si představíte tři stavební kameny vývoje webu tak, jak si představujete člověka, můžete si to představit takto: HTML je kost a kostra webových stránek, CSS poskytuje vzhled a JavaScript je mozek.

Právě teď se můžete naučit programovat, můžete absolvovat rychlokurz HTML od Brada Traversyho, který je WHIZ ve výuce technologií pro vývoj webových aplikací:

Základní nástroje pro vývoj webu

• Textový editor: kód píšeme pomocí textového editoru a musíte si ho vybrat a dobře se seznámit se všemi jeho schopnostmi. Mezi dnes oblíbené textové editory patří: Atom, Sublime Text, Brackets, Visual Studio Code a starý dobrý MS Notepad a Mac Text Edit.
• Nástroje pro vývojáře prohlížeče: Google Chrome a Mozilla Firefox jsou vybaveny interními nástroji pro vývojáře, které vám umožňují prohlížet a manipulovat s kódem libovolného webu ve vašem prohlížeči.
• Tyto nástroje jsou samozřejmě vhodné pro účely ladění… jste jediní, kdo může zobrazit změny, které na webu provedete pomocí nástrojů pro vývojáře, protože s webem manipulujete pouze tak, jak se zobrazuje ve vašem vlastním prohlížeči.
• Systémy pro správu verzí: Systémy pro správu verzí vám umožňují spravovat změny vašich webových projektů. To vám umožní vrátit se k různým verzím projektu, aniž byste zasahovali do nasazeného projektu, dokud nedokončíte tu, na které pracujete. Používá se několik systémů pro správu verzí, ale Git je zdaleka nejdominantnější.
• Příkazový řádek (terminál): Pro profesionální vývoj webu je nutné důkladné zvládnutí příkazového řádku. Příkazový řádek vypadá strašidelně, ale usnadňuje nahrávání nových softwarových balíků a také usnadňuje procházení souborů a složek. Můžete se naučit zvládnout příkazový řádek za den.

Základní technologie podporující vývoj webu

• CSS Preprocessor: díky této technologii je psaní a údržba CSS hračkou. Zdaleka nejběžnějším preprocesorem CSS je SASS a dá se to naučit za den
• Rámečky CSS: Pokud jde o vytváření složitějších úkolů CSS, jejichž vytváření je časově méně náročné, budete potřebovat vědět, že rámec CSS je Twitter Bootstrap.
• CSS Flexbox a CSS Grid: Jedná se o obě rozvržení webového modelu CSS, která významně pomáhají reagovat na vaše mobilní webové stránky.
• Svazování Tools: Webpack a Browserify s Culpa jsou použity na pomoc zatížení stránku rychleji do prohlížeče. Tyto nástroje slouží k minifikaci nebo zúžení obsahu pro rychlejší načítání.
• Knihovny a rámce JavaScriptu: Knihovny a rámce vám umožňují rychle, snadněji a efektivněji přidávat interakce JavaScriptu na webové stránky. Pomáhají také zjednodušit složitější aspekty JavaScriptu. Mezi oblíbené knihovny a rámce patří: JQuery, React a Angular.

Jak vidíte, je třeba se hodně naučit, abyste se stali front-endovým webovým vývojářem. Dobrou zprávou je, že VŠECHNY tyto nástroje, zdroje a technologie se lze naučit zdarma. Už nyní vidíte, že na YouTube existuje spousta bezplatných zdrojů…

Pokud potřebujete komplexnější učení, můžete se všechny tyto nástroje naučit téměř bez použití online výukových zdrojů, jako je Team Treehouse. K dispozici jsou také jednotlivé kurzy, jako je kurz The Complete Front-End Development nebo Modern React on Udemy.