SSR dla istniejącego projektu React w Express.js

Question

Cześć, napisałem prostą apkę w React i chciałbym teraz przekształcić ją, tak aby była generowana po stronie serwera (Express).

Zrobiłem na początku trochę gafę i w moim repozytorium mam po prostu folder 'frontend', a w nim całą Reactową aplikację z skonfigurowanym typescriptem, babelem i webpackiem.
Nie bawiłem się jeszcze w SSR, dlatego jestem ciekaw, czy jeśli chciałbym zrobić taki serwer i mieć jego plik w katalogu obok folderu frontend, to musiałbym w tym "głównym" poinstalować i poustawiać wszystkie zależności jakie porobiłem w środku folderu "frontend", a dopiero potem stworzyć plik server.js ?

Wtedy w środku "frontend/src" miałbym 2 pliki - index.tsx (z metodą React.render()), bo chciałbym mieć możliwość uruchamiania aplikacji też bez serwera. I 2 plik to byłby indexServer.tsx z metodą React.hydrate(), który by szedł do pliku server.js (czyli byłby do generowania aplikacji przez serwer). Czy taka koncepcja ma rację bytu ?

Link do repo: https://github.com/poldeeek/spider-game

Comments

dlaczego nie użyjesz next.js?

---

Bo chcę się najpierw nauczyć jak skonfigurować i połączyć takiego istniejącego już Reactowego klienta z serwerem w Express, który używa Webpacka

Answer 1

https://www.youtube.com/watch?v=ngc9gnGgUdA&list=PL6QREj8te1P7VSwhrMf3D3Xt4V6_SRkhu

tutaj możesz podpatrzeć jak Tworzy się coś większego ...

Facet moim zdaniem ma to super poukładane..Struktura katalogów plików przede wszystkim...

Powodzenia myślę że ze się przyda, długie ale bardzo pouczające...

 

Comments

Niezupełnie o to mi chodziło w pytaniu. Tutaj z tego co widzę jest klient i serwer pracujące równolegle na różnych portach. Ja chciałbym stworzyć prosty serwer z funkcją server-side-rendering. Czyli, aby była opcja uruchomienia samego serwera,  który na podstawie folderu (w moim przypadku "frontend") wygeneruje aplikację Reactową (wciąż po stronie serwera) i zwróci klientowi plik .html z tą ów wygenerowaną stroną.