ReactJS – poznámky začátečníka

  • JS knihovna pro uživatelská rozhraní
  • components – základem je skladba z komponent
    • parametry komponenty se nazývají props (properties)
    • co má zobrazit je v render metodě (obsahuje popis toho, co má být vidět na obrazovce) – vrací React elementy
      • většina vývojářů používa JSX
    • controlled components – komponenty, které jsou pod plnou kontrolou předka
  • state – používá se k zapamatování věcí
    • k inizializace se používá konstruktor (u třídy, která rozšiřuje jinou, zde musí být vždy super(props); – aby mohla předat)
    • pokud se zavolá setState v komponentě – React automaticky aktualizuje i komponenty její potomků uvnitř
    • sbírání dat z více komponent nebo komunikace mezi nimi – je potřeba deklarovat sdílení stav v rodičovské komponentě – ta dokáže posílat stav zpátky k potomkům => udržuje synchronizaci potomků a rodičovských komponent
  • props
    • metody lze nazvat libovolně, ale v Reactu jsou zvykem tyto jmenné konvence
      • on[Event] – název pro vlastnosti reprezentující události
      • handle[Event] – název pro metody, které zpracovávají události
  • neměnnost je důležitá – 2 přístupy ke změně data
    1. změnit přímo hodnoty dat
    2. přepsat stará data novou kopií s požadovanými změnami – výhody
      1. stará data lze použít (např. krok zpět)
      2. sledování změn
      3. pure components (specialita Reactu) – sledování změn v datech kvůli určení, zda se má komponenta znovu renderovat
  • funkční komponenty
    • pouze render metoda
    • nemají vlastní state, pouze props
    • nerozšiřují React.Component
    • nepoužívá se this

Čerpáno z tutoriálu na ReactJS.org + se bude hodit i dokumentace k JavaScriptu.

Před pohovorem

Článek má titulek Před pohovorem, ale následující témata si oťukávám i ve chvílích menší pracovní reflexe (většinou to provází pocit, že je potřeba dělat věci trochu jinak :-)).

Situace na trhu práce

  • Jaká je situace na vývojářském trhu práce?
  • Kde je hlad po lidech? V jakém oboru? Jaké firmy nabírají a jaké mají nabídky?
  • Jaké jsou platy?

Technologie a práce

  • Co bych se rád naučil? Jakým směrem bych se chtěl vydat?
  • Co mě v práci baví (technologie, postupy, koncepty …) mě baví?
  • O čem bych mohl udělat jednoduchý kurz nebo tutoriál?
  • O jaké programovací jazyky a frameworky je zájem?

Co je pro mě důležité?

  • Kolik hodin týdně chci investovat do práce?
  • Jakou sumu peněz chci týdně/měsíčně vydělat?
  • Chci pracovat vzdáleně (například z hlediska dojíždění)?
  • Preferuji HPP nebo IČ a proč?

Historie

Vlastní zkušenost (úroveň)

  • Připadám si ve svém oboru jako začátečník, junior nebo senior?
  • Jaké můžu sdílet zkušenosti (nejen z technologického hlediska)?
  • Jaké jsou moje pracovní pády a neúspěchy – co jsem si z nich vzal?

Reflexe

  • Jak mojí úroveň vidí širší skupina lidí v mém oboru? Spolupracovníci? Klienti?
  • Co mi vytýkají a v čem mě chválí?
  • Co jsem se od koho z nich naučil?

Prezentace – co konkrétního mám v ruce?

  • Projekty
    • Na kterých jsem se podílel?
    • Inicioval jsem nějaký zajímavý projekt?
      • Kolik z vlastních projektů jsem mohl prodat?

Z mojí hlavy je to vše. Rád bych poukázal i na zajímavé postřeby Jakuba Kratiny ve videu Jak zvýšit svoji cenu při hledání práce. Na můj vkus bylo zbytečně dlouhé, tak přikládám, co jsem si z toho vzal k prezetanci:

  • vlastní extensions
    • složitější než CRUD
    • neprezentovat VIEW ale MODELY
    • ukázat kámošům – získat komentáře
    • testovat
  • blog o práci, livestream, …
  • pomáhej ostatním řešit problémy – Slack, Stack Overflow, ProWebmasters
  • LinkedIn – z vlastní zkušenosti můžu říct, že mi to již několikrát našlo práci 🙂
  • vlastní web – např. web.pikl.cz

Angular 5.0 – začínám

Tutoriál tour of heroes

  1. Na webu frameworku je docela pěkně popsaný tutoriál na seznámení s Angularem. Výsledná ukázka zde.

Co mě dál zajímalo?

Rychlost Angularu

Zde je porovnání na různých protokolech HTTP.

Indexace aplikací v prohlížečích

  1. Dokumentace – SSR – Server-side rendering
  2. Návod od Garyho Simona

Jak to skloubit s Twitter Bootstrap 4?

  • Návod od Loiane Groner na přídání TWB4 do Angular 5 aplikace. I přes skvěle napsaný tutoriál jsem se dostal k problémům s verzí TWB, pomohla následující diskuze.

Postřehy z devíti měsíců půlúvazku na volné noze | ČÁST 2.

… pokračování článku zde.

Nečekej, že zakázky přijdou sami

Práci musíš jít naproti. Před některou budeš pak chtít i uhnout pryč. Pozor na zahlcení poptávkou, zaregistroval jsem se do několik služeb, které zasílaly poptávky a pak jsem nestíhal mazat (z některých byl velký problém se odhlásit).

Dost to souvisí s tím, zjistit kdo je moje cílová skupina?

O kom se ví, o toho je zájem

Jakými cestami chci zviditelňovat to, co nabízím? Cest je mnoho: web, blog, reklamní plachta, video, událost… nechat mluvit především klienty a vlastní práci je mnohdy nejlepší řešení.

Ku pomoci jsou i různé akce pro podnikatele, kde můžete předat během řeči třeba vizitku.

Finanční strop

Je potřeba průběžně sledovat, aby vycházela zakázka a šlo udávat tempo.

Vývoj zadání v průběhu práce

Varování k iniciativě – změny za které chci peníze, nejdříve nechat odsouhlasit.

Rezervy – čas & finance

  • Dovolenou si naplánovat.
  • Našetřit na placenou dovolenou 25 dní, nemocenskou 25 dní – nejlépe odkládat alespoň desetinu průměrného měsíčního výdělku.

Oťukej vlastní hodinovku

Jak rychle pracuješ? Kolik ti zabere úkol času?

Pro představu. Trošku trvá než v tomhle člověk pozná sám sebe a cenu vlastního času. I vlastní štědrost a štědrost druhých.

Do ceny zahrnout i kalkulace, návrhy, čas cesty tam a zpět, schůzka. Když nevíš co všechno tam zahrnout – zaplatil bys za to někomu jinému?

Investuj do sebe – vzdělání a pomůcek. I odpočinek a prostředí jsou důležité.

Nepřeceňuj,

ale ani nepodceňuj dokumentace.

Nauč se mazat a ztrácet

Piš. Kresli. Zaznamenávej si. Zachytíš mnoho nápadů, velkou spoustu z nich pak skartuješ.

Podnikání není …

I přestože se může odehrávat v krásném prostředí zeleného lesa, útulné kavárny či Bůh ví kde, není to koníček ani dovolená.

Ale koníčky i dovolená, jsou přitom důležité.

Testování – předání práce

Před vypuštěním díla projít prezentaci s klientem a proklikat… klidně přes Skype, neva …

Cíl? Zjistit spokojenost a vyvarovat se bazírování na detailech, které nejsou okaté a lze je operativně doladit.

„klientovy rozmary“

Během vývoje klientovy dojde, že tam chce ještě tohle nebo že tamto je zbytečné. Oznam mu, na kolik ty změny vyjdou. I něco skrýt nebo smazat je práce.

Stanovte si kalkulaci na zhotovení díla + hodinovku, za kterou se účtují připomínky a okrajové práce.

Než něco vypustíš k zákazníkovi, dvakrát měř

„vlastní rozmary“

Ego má velké cíle, věřím, že člověk dokáže velké věci, ale i velká cesta lze ujít jen přes obyčejné malé kroky.

Nečekej uznání a nečekej, že to půjde tak, jak sis vymyslel – realita je vždy o kousek jinde.

Když si nařídíš budík, vstaň. Buď to nasere tebe nebo někoho kolem tebe :-).

Občas propočítej na kolik tě vychází cesta, po které jdeš a ta která tě láká. Jen tak pro přehled.

Nemusíš se živit vším, co umíš a co tě baví, něco z toho vyber a udělej nabídku, zbytek si nech na volný čas – pro sebe. To je úskalí našeho digitálního věku. Umět upravovat fotografie, dělat webdesign, kódovat, optimalizovat, psát back-end, psát front-end. Kluk pro všechno lehko ztratí specializaci. Někdy se to hodí, někdy ne, záleží, jakou chceš jít cestou. Komplexně nebo specializace?

Následující text nechávám necenzurovaný, jako důkaz, že může přijít i deprese 🙂 …

Zahleděnost v sobě

Už seru sám sebe. S tím, jak si jen stěžuju. Rozebírám, co je jak komplikovaný a nejdu dál. Neděláš rád doma? Tak tam nedělej, vole!

Nebaví tě ta práce co teď děláš? Hledej chvilku, co tě baví, pak se k tomu vrať, až najdeš chuť. Zkus se aspoň projít kolem bloku a trošku se vydejchat.

Seš v izolaci? Koníčky a lidi a lidi a lidi…!

Závěrem

Stay HungryStay Foolish. ~ Steve Jobs 🙂 (Na Applu sice nejedu, ačkoliv proti němu nic nemám. Ale tohle motto sedí ;-)) Držím palce všem podnikavým lidem.

JS – tipy na zdroje informací

Obecně

Asynchronní vs. synchronní request / response

Frameworky