React Introduction Question
- How do you set up a React app?
The repo setup is complicated one, because he has multiple entry points to his app. In the exercises directory each subdirectory is one little app.
He's using Webpack. The entry point is in webpack.config.js:
// webpack.config.js
makeIndex();
module.exports = {
devtool: 'eval',
entry: fs.readdirSync(CODE).reduce(function (entries, dir) {
if (isDirectory(path.join(CODE, dir)))
entries[dir] = path.join(CODE, dir, 'app.js');
return entries;
}, {}),
output: {
path: 'excercises/__build__',
filename: '[name].js',
chunkFilename: '[id].chunk.js',
publicPath: '/__build__/'
},
..
}
The above reads dynamically the subdirectories and creates the entry points. Bundles dynamically the output files.
Uses the CommonsChunkPlugin to bundle all the common js files shared across all the apps (shared.js). Webpack figures out automatically which are the common js files.
- Webpack vs. Browserify?Suggests finding answer on Google
- What's with the loaded: true ?
(This is app.js from the previous note in
componentDidMount definition)It's just a way to split the UI. For example if the server is slow, it still shows something to the user, so that he knows the app is working. (
if (!this.state.loaded then show loading text)