devel.cz

Ahoj Luboši,
ještě budu reagovat na komentáře pod příspěvkem od Vaška.

Cesty jak dostat data do Reactu (nejde o React, ale obecně o Javascript) jsou dvě - "statická" cesta. Kdy si vyplivneš nějaký JSON do dokumentu, která vracíš. Takto nějak: https://gist.github.com/vojtatranta/ea9fcd3327f1dd689c7b1fefb4647485
TOhle je stejný postup jako navrhuje @prebijak, je jedno, jelsti si ten JSON vypíšeš do data atributu nějakého elementu nebo jako globální proměnnou do stránky - natahování do Reactu / reduxu bude vypadat stejně

TJ. v šabloně mám natvrdo vypsaný nějaký výchozí stav jako JS objekt, který mi předalo PHP ze serveru. To je jasný?

Druhá cesta je taková, že si při prvním načtením stránky stav natáhneš. Funguje to obdobně, akorát prostě zavoláš nějaké $.ajax() a natáhneš si JSON z endpointu, který pak předáš buďto přímo do createStore() nebo vytvoříš Redux action creator, která takový stav natáhne, mám napsat příklad nebo to je jasné?

Oba tyhle přístupy maj díru v tom, že nemyslí na případ, kdy uživatel nějak přechází mezi stránkama né klasickým stylem tj. server requst a HTML resopnse s novou stárnkou, ale má to fungovat jako SPA.

V takovém případě to můžeš udělat tak, že si dáš do PHP podmínku, že stránka vrátí HTML, pokud je accept hlavička nastavená jinak než na application/json. Pokud je ale hlavička application json, tak místo html šablony prostě vrátíš jenom json_encode($template_vars). Tj. nějaký kontext nebo proměnné, které tečou do šablony, jako kdyby měla být vypsáná v HTML a necháš React, aby tenhle JSON nějak zpracoval a vypsal. Tudíž pak stačí jenom poslouchat na změnu URL přes History api a pži každé změně url akorát udělat $.ajax() request s accept hlavičkou nastavenou na application/json a každá routa, kteoru máš v PHP ti normálně vrátí JSON, který pak můžeš vykreslit a nemusíš prakticky nic moc řešit.

To je jednoduchá situace.

Já osobně bych se radši vyhnul dvojímu routování, nechal bych routování buďto jenom na serveru nebo jenom na frontendu. Lepší je to asi nechat na serveru celé, ušetříš si s tím spoustu práce. Navíc nemusíš už řešit #js-router/ahoj/1 a použít prostě History API, která funguje pěkně a už ve velké části prohlížečů.