ngParty / React-scaffold

An React Scaffold featuring React (Tests, Dev/Prod), ReactRouter, Jest, TypeScript, TsLint and Webpack2 by @ngParty Team
ISC License
0 stars 1 forks source link

create application structure #6

Open Hotell opened 8 years ago

Hotell commented 8 years ago

Take as inspiration angular.io styleguides

src/
 |--app/  * WebApp: folder, our source files that will be compiled to javascript
 |   |-- shared/  * Do put all shared files within a component feature in a shared folder
 |   |   |-- components/
 |   |   |   |-- Button/
 |   |   |   |   |-- Button(.spec).tsx
 |   |   |   |   |-- Button.css
 |   |   |-- services/
 |   |   |   |-- exception.service(.spec).ts
 |   |   |-- actions/ * put all global actions in here
 |   |   |-- reducers/ * put all global reducers in here
 |   |   |-- index.ts  * barrel file
 |   |-- dashboard/
 |   |   |-- index.ts   * barrel file
 |   |   |-- actions.ts
 |   |   |-- reducers.ts
 |   |   |-- Dashboard.tsx
 |   |-- +heroes/  * lazy loaded feature module
 |   |   |-- index.ts   * barrel file
 |   |   |-- actions.ts
 |   |   |-- reducers.ts
 |   |   |-- Heroes.tsx
 |   |   |   |-- hero/
 |   |   |   |   |-- Hero(.spec).tsx
 |   |   |   |-- hero-list/
 |   |   |   |   |-- HeroList(.spec).tsx
 |   |   |   |-- shared/   * shared funcionality for this module ( feature based )
 |   |-- +villains/   * lazy loaded feature module
 |   |   |-- index.ts   * barrel file
 |   |   |-- actions.ts
 |   |   |-- reducers.ts
 |   |   |-- Villains.tsx
 |   |-- App.tsx           * root component
 |   |-- App.spec.tsx  * a simple test of components in app.ts
 |   |-- index.ts           * barrel file 
 |
 |-- assets/               * static assets are served here
 |   |-- icon/              * our list of icons from www.favicon-generator.org
 |   |-- images/          * our custom app images
 |   |-- service-worker.js  * ignore this. Web App service worker that's not complete yet
 |   |-- robots.txt   * for search engines to crawl your website
 |   |-- human.txt   * for humans to know who the developers are
 |-- main.ts   * our entry file for our browser environment
 |   
 |-- index.html   * Index.html: where we generate our index page
 |   
 |-- polyfills.ts   * our polyfills file
 |   
 |-- vendor.ts   * our vendor file
 |
 |-- globals.d.ts   * our custom global type definitions
elmariofredo commented 8 years ago

add folder structure from angular.io first to doc/Structure.md file