O moderních webových aplikacích

#javascript #react #redux #immutable #nodejs #webpack

DžejEs

Vítejte! Zde se budou postupně objevovat články zaměřené na vývoj moderních interaktivních webovek, kde hlavní slovo má JavaScript, Node.js, React a Redux. V českém jazyce! Sdílejte a hvězdičkujte! Novinky budu šířit i na svém twitteru. Diskutovat pak můžeme na githubu. RSS.

Články 

JavaScript? Babel. 

JavaScript má oproti většině ostatních jazyků jedno specifikum. Je sám o sobě poměrně nepoužitelný. Na vině je především způsob, jakým dochází k uvádění jeho nových verzí. Jak si s tím poradit?

Nástroje 

Tak jako truhlář potřebuje hoblík, pilu nebo nebozez, tak i vývojář webovek se neobejde bez pořádných nástrojů. Když si vyberete ty správné a naučíte se s nimi pořádně zacházet, značně usnadní a zrychlí vaši práci.

První dev stack 

Hlavním hrdinou dnešního článku se stane bundlovací nástroj webpack. S jeho pomocí postavíme první jednoduchou "Hello world" aplikaci v Reactu, která bude například používat Babel a LESS. Ukážeme si sílu moderních JS nástrojů v praxi.

React - Úvod 

React je JavaScriptová knihovna pro vytváření webových komponent. V pomyslném MVC představuje "V" neboli view vrstvu. S Reactem nepíšeme kód, který něco mění, ale kód, který popisuje, jak má vypadat výsledek.

React - Props vs State 

React se točí kolem props a tak je nejvyšší čas si ukázat, co jsou zač. Povíme si, jak se props liší od state a jakým způsobem se používají. To vše si demonstrujeme na pokročilejším příkladě, který se bude skládat z více komponent.

React - JSX 

První věc, která nováčka v Reactu rozhodně praští do očí, je zápis XML (HTML) tagů přímo do JavaScriptového kódu bez apostrofů kolem. Takovýto zápis se ve světě Reactu nazývá JSX. Ukážeme si, co je pod jeho pokličkou a že se vlastně není čeho bát.

Pro koho jsou články určeny? 

Pro čtenáře, kteří již běžně programují webové aplikace, ale převážně pomocí serverových frameworků typu Nette. Mají však už i nějaké zkušenosti s JavaScriptem, kterým občas něco animují nebo posílají AJAXem. Dále také pro programátory, kteří používají JavaScriptové frameworky jako Angular, Ember či Meteor anebo knihovnu Google Closure. Jsou však zvědaví, proč je poslední dobou tolik povyku kolem Facebooku, Reactu a Reduxu. Zkrátka, pro všechny lidi s otevřenou hlavou, kteří nevěří na pomluvy a chtějí stavět i velké, robustní a výkonné aplikace běžící v prohlížeči.

Autor 

Mám za sebou spoustu let a webů v PHP (Nette). Před 2 roky jsem se pak trochu nečekaně stal front-end vývojářem a skočil po hlavě do světa Google Closure a CoffeeScriptu. Po prvotním zděšení jsem se naučil mít JavaScript ekosystém rád a opravdová láska pak přišla s objevem Reactu. Jinak také jsem, byl a budu studentem teoretické informatiky/informační bezpečnosti na několika školách (ČVUT, MSOE, Masdar Institute, Georgia Tech), takže některé z vás budu možná občas nudit i teoretizováním a přehnanou optimalizací.

Vojtěch Mikšů, twitter a kontakt, 2016

Díky patří Honzovi Žaloudkovi za nápad na hezkou českou doménu a Danu Abramovi za základ systému, který tyto stránky generuje.