Skip to content

Commit 2682fc4

Browse files
committed
update docs
1 parent 981e90e commit 2682fc4

File tree

1 file changed

+48
-7
lines changed

1 file changed

+48
-7
lines changed

README.md

+48-7
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
![](http://res.cloudinary.com/hashnode/image/upload/w_200/v1455647564/static_imgs/mern/imgs/favicon-mern.png)
22

33
# mern-starter
4-
![title](https://travis-ci.org/Hashnode/mern-starter.svg?branch=master)
4+
![title](https://travis-ci.org/Hashnode/mern-starter.svg?branch=v2.0.0)
55
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
66

77

@@ -15,7 +15,7 @@ MERN is a scaffolding tool which makes it easy to build isomorphic apps using Mo
1515

1616
```
1717
npm install -g mern-cli
18-
mern your_new_app
18+
mern init your_new_app
1919
cd your_new_app
2020
npm install
2121
npm start
@@ -27,7 +27,7 @@ MERN is a scaffolding tool which makes it easy to build isomorphic apps using Mo
2727

2828
### Webpack Configs
2929

30-
MERN uses Webpack for bundling modules. There are two types of Webpack configs provided `webpack.config.dev.js` (for development) and `webpack.config.prod.js` (for production).
30+
MERN uses Webpack for bundling modules. There are three types of Webpack configs provided `webpack.config.dev.js` (for development), `webpack.config.prod.js` (for production) and `webpack.config.server.js` (for bundling server in production).
3131

3232
The Webpack configuration is minimal and beginner-friendly. You can customize and add more features to it for production build.
3333

@@ -41,7 +41,7 @@ If NODE_ENV is development we apply Webpack middlewares for bundling and Hot Mod
4141

4242
We use React Router's match function for handling all page requests so that browser history works.
4343

44-
All the routes are defined in `shared/routes.js`. React Router renders components according to route requested.
44+
All the routes are defined in `client/routes.js`. React Router renders components according to route requested.
4545

4646
```js
4747
// Server Side Rendering based on routes matched by React-router.
@@ -90,14 +90,55 @@ If there's an error in matching we return 500 status code, if no matches are fou
9090

9191
`fetchComponentData` is the key function. It takes three params : first is a dispatch function of Redux store, second is an array of components that should be rendered in current route and third is the route params. `fetchComponentData` collects all the needs (need is an array of actions that are required to be dispatched before rendering the component) of components in the current route. It returns a promise when all the required actions are dispatched. We render the page and send data to client for client-side rendering in `window.__INITIAL_STATE__`.
9292

93-
### Shared
93+
### Client
9494

95-
Shared directory contains all the components, routes, actions and reducers.
95+
Client directory contains all the shared components, routes, modules.
9696

97-
### Client
97+
#### components
98+
This folder contains all the shared components which is used throughout the project.
9899

100+
#### index.js
99101
Index.js simply does client side rendering using the data provided from `window.__INITIAL_STATE__`.
100102

103+
#### assets
104+
All the assets images, fonts goes here. All of these will be copied to `dist` folder while running in production and served from there.
105+
106+
#### modules
107+
Modules are way of organising different domain specific modules in the project. A typical module contains the following
108+
```
109+
| - Post
110+
| - __tests__ // all the tests for this module goes here
111+
| - components // Sub components of this module
112+
| - Post.spec.js
113+
| - PostList.spec.js
114+
| - PostItem.spec.js
115+
| - PostImage.spec.js
116+
| - pages
117+
| - PostPage.spec.js
118+
| - PostViewPage.spec.js
119+
| - PostReducer.spec.js
120+
| - PostActions.spec.js
121+
| - components // Sub components of this module
122+
| - Post.js
123+
| - PostList.js
124+
| - PostItem.js
125+
| - PostImage.js
126+
| - pages // React Router Pages from this module
127+
| - PostPage
128+
| - PostPage.js
129+
| - PostPage.css
130+
| - PostViewPage
131+
| - PostViewPage.js
132+
| - PostViewPage.css
133+
| - PostReducer.js
134+
| - PostActions.js
135+
```
136+
137+
## Misc
138+
139+
### ES6 support
140+
We use babel to transpile code in both server and client with `stage-0` plugin. So, you can use both ES6 and experimental ES7 features.
141+
101142
## Roadmap
102143

103144
The roadmap discussion thread for v2.0.0 can be found [here](https://github.com/Hashnode/mern-starter/issues/146).

0 commit comments

Comments
 (0)