CODEWITHSUNDEEP
reactjsredux
choucavalier
choucavalier

Reputation: 2770

What's the standard folder structure of a React+Redux project?

What is the standard folder structure of a React+Redux project?

Where do you put the

When I look at react-redux-socketio-chat I feel like this is maybe too much. Is it standard?

Upvotes: 2

Views: 4239

Answers (3)

leLabrador
leLabrador

Reputation: 169

I have a boilerplate with basic setup of react redux following duck style. You can find it here: https://github.com/nlt2390/le-react-redux-duck

In general, this is how the folder structure looks like react redux file structure

  • components: react components
  • containers: where components are connected to redux using connect(Component)
  • pages: contains many "components" and "containers"
  • layouts: contains "pages" & "routes" in react-router with some html wrapped outside them.
  • utils: contains any functions, constants being used across the app, e.g convertStringToNumber(), apiUrl, etc
  • state: contains "actions", "reducers", data in redux store, like { post: [], postDetails: {title: 'lorem' } }

Upvotes: 1

Dmitry Shvedov
Dmitry Shvedov

Reputation: 3296

The structure suggested by Eni Arinde is aligned with what is suggested in the Redux documentation.

You may find this proposal interesting too: https://github.com/erikras/ducks-modular-redux

Basically you make modules by bundling your action creators and reducers together. That does make a lot of sense as you will find that they are coupled together quite a bit.

Upvotes: 4

Eni Arinde
Eni Arinde

Reputation: 565

There is no standard for how you structure you react+redux app, but there is a common pattern. This simple boilerplate simple-redux-boilerplate is a good example of the pattern commonly used.

Upvotes: 1

Related Questions