Project Structure - Tuong-Nguyen/JavaScript-Structure GitHub Wiki

  • services (wrap external dependencies)
  • selectors
  • common (used by many features)
    • reducers
    • actions/thunks
  • [feature] (ex: courses)
    • components:
      • presentation components (interface is Props):
        • <component>.js: Stateless React component
        • <component>.story.js: appearance of component with different values of Props
        • <component>.test.js: interaction test (ie: if button is clicked -> handler is called).
      • container components:
        • <component>Container.js: component which wraps Presentation component
        • <component>Container.test.js:
          • Test configuration: check that the Presentation components are configured with correct values.
          • Test handler methods.
          • Test logic of mapStateToProps method - This method can be refactored into Selectors functions.
    • reducers <component>Reducer.js
    • actions/thunks <component>Actions.js
  • ...
  • app.js
  • storeConfig.js
⚠️ **GitHub.com Fallback** ⚠️