React frontend

[OmTheTurtle]

A magyar leírás lent található

English description

By now the app's frontend got too complex for the erb templates. So the next logical thing to do is to move to a separate fontend. This migration should be done incrementally starting with simple pages then gradually replacing everything.

---

Magyar leírás

Mára a frontend elérte azt a komplexitást, hogy ideje átállni szeparált frontend-backend architektúrára. Ezt az átállást inkrementálisan, az egyszerű oldalakkal kezdve kell megtenni.

[balintkiraly]

I will gladly create the basics of this. Should we create a new repository for this or just use a monorepo with some webpack solution? What do you thinks? @OmTheTurtle @emanreyalp @salierri @falusi94 @SepsiLaszlo

[OmTheTurtle]

I think the two most important things to look for is maintainability and how hard it is to test the app. And in this case having a separate repo for the UI is much better (you can develop, test, and deploy the two things independently).

---

Another thing I didn't mention in the issue is that if we really take the approach to separate the UI into React, that our team members who want to join developing PéK, should be at least familiar with front-end frameworks (that said, learning how advanced Rails templating works could be a lot too). This raises questions whether we want to hold FE courses for the newcomers? I think we should also get in contact with schdesign to see if they're interested in this project.

[falusi94]

I'd not recommend to mix the frontend and backend if you want to build a whole independent frontend application. It can bring much more complexity to webpack config (which is not initialized to the current app), and I suspect it requires ejecting react too, which I wouldn't recommend neither. Here my advice is to create a frontend repo, implement the very basics, like token handling, navigation bar and then you can migrate pages one by one and use nginx to redirect to the proper app according to the page.

If you would like to migrate only some complex pages I can imagine a different approach too. In this case I'd create packages from them and just import it in the current app. Though the full separation seems to be much more clearer and easier to be handled in the long term.