Reagovat

Bylo to vzrušujících posledních pár týdnů nacpat můj mozek všemi úžasnými věcmi, které můžete dělat s Reactem (nemluvě o ohromujícím pracovním toku pomocí Redux). Chtěl jsem napsat rychlý užitečný článek s několika útržky užitečných informací.

Kontejnerové VS prezentační komponenty

Jsem si jistý, že všichni profesionálové Reactu jsou si vědomi síly komponent. Ať už se jedná o plnohodnotné komponenty třídy se stavem, více metodami a spoustou logiky nebo jen jednoduchou funkční komponentu, která jednoduše vrací element HTML, komponenty jsou tím, o čem React je. I když existují nové/jiné způsoby, jak navrhnout aplikaci React (háky mi připadají docela cool), pro projekt na Flatiron School potřebujeme vytvořit kontejnerové komponenty a prezentační (nebo bezstavové) komponenty. Je to docela cool přemýšlet o designu naší aplikace tímto způsobem. Chceme, aby naše jednoduché komponenty byly dětmi složitějších rodičů, kteří dělají všechny těžké zvedání, včetně posílání rekvizit.

MAPA

Pokud nejste obeznámeni s mapou, jednou z mých oblíbených funkcí vyššího řádu, doporučoval bych si ji prohlédnout. Map je volána na poli a je jí poskytnuta funkce zpětného volání a vrací nové pole na základě výsledků poskytnuté funkce. V Reactu toho využíváte tuny.

{this.props.stacks.included.map( card => {
  if (card.relationships.stack.data.id === this.props.id)
    return (
      <div key={card.id}>
        < Question front={card.attributes.front} id={card.id} configureColor={this.configureColor} handleChange={this.handleChange}/>
      </div>
           )
      }
})}

I když to může vypadat zastrašující, vše, co mapa dělá, je procházení pole stacks.included a kontrola ID každé karty a vykreslení komponenty Question se správnými předávanými rekvizitami.

Podmínky Redux

Akce ::prostý objekt JS s typem klíče a potenciálně užitečným zatížením dat
Reduktor ::čistá funkce (vždy vrací stejnou hodnotu, když jsou zadány stejné argumenty), která má příkaz switch, který kontroluje typ naší akce a vrací nový stav
PAMATUJTE redukce nikdy neaktualizují předchozí stav, vytvářejí zcela nový objekt stavu.
O Reduxu se toho dá říct mnohem víc. Plánuji napsat samostatný článek.

Dále

Toto znamená konec mé cesty Flatiron, ale budu se dál učit, tvořit a psát! Těším se na to, co nás čeká!