Skip to content

Instantly share code, notes, and snippets.

@viniciusdacal
Last active February 9, 2018 20:22
Show Gist options
  • Save viniciusdacal/48ff23ad236be97bb5114316532d07e3 to your computer and use it in GitHub Desktop.
Save viniciusdacal/48ff23ad236be97bb5114316532d07e3 to your computer and use it in GitHub Desktop.
root-app-folder
  config
    webpack, build, jestconfig, etc...

  src
    components
      User // Split by features/modules
        Form
          Form.jsx // presentation const UsersForm
          container.js // all the logic using recompose
        List
          List.jsx // presentation
          container.js // all the logic using recompose
      Client
        Form
          Form.jsx // presentation
          container.js // all the logic using recompose

      UI // keep generic dumb components here
        Button
        Navbar
        Text
        Date
        Title

    screens
      Root.jsx // All routes defined here
      User
        List.jsx // ScreensUserList - simple dumb components that calls the container component
        Form.jsx // ScreensUserForm - simple dumb components that calls the container component

  .eslintrc
  package.json
  etc..
@viniciusdacal
Copy link
Author

viniciusdacal commented Feb 9, 2018

Also, The components are named accordingly to its place in the folder tree (ignoring "components" folder name)
eg:

components / User / Form/ Form.jsx
UserForm

screens / User / Form.jsx
ScreensUserForm

components / UI / Button / Button.jsx
UIButton

Then, it's very easier to know where a component is located, just looking at its name

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment