sunnydl / GamePerformanceTracker

Team project for CSE 115A in Fall 2021, UCSC
3 stars 0 forks source link

Refactor frontend structure #28

Closed sunnydl closed 3 years ago

sunnydl commented 3 years ago

Right now seems like there is too much stuff in app.tsx.

First, maybe we can try to move some state-related stuff such as the stuff in useEffect into redux, and replace it with a simple dispatch, just like how this article did it: https://blog.devgenius.io/async-api-fetching-with-redux-toolkit-2020-8623ff9da267.

Second, it would be great if we can move the whole AppBar component in app.tsx into a seperate folder, and import it from there. For example

|- components/
      |- AppBar/
      |- ...

Also I think we can move the component's declaration with style into a separate file called style.ts. For example

|- components/
      |- AppBar/
            |- AppBar.tsx
            |- style.ts
      |- ...

This structure will help people learn and understand code a bit better going forward in my opinion. Hopefully, it makes sense, and let me know if there are any other things that can be added to this structure, thanks!