S. Verona Lišková
Table of Contents
This post begins our look at James Vickery’s simple-mern repository.
./README.md, ./LICENSE
These are pretty self-explanatory, so I’ll ignore them.
./package.json
This is similar to the package.json generated automatically by create-react-app. I’ll split it up into three sections. The first section contains metadata for npm.
{
"name": "simple-mern",
"version": "0.2.0",
"description": "the simplest MERN (MongoDB, Express, React and Node) setup",
"main": "index.js",
"author": "James Vickery",
"license": "MIT",
}
The next section specifies custom shell commands to run with npm. For instance, npm start is an alias for nodemon index.js.
{
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "nodemon index.js",
"start:prod": "node index.js",
"build": "cd client && npm install && npm run build"
}
}
The final section specifies production and development dependencies.
{
"dependencies": {
"body-parser": "^1.18.3",
"express": "^4.16.4",
"mongoose": "^5.13.9",
"password-generator": "^2.3.2"
},
"devDependencies": {
"nodemon": "^2.0.13",
"prettier": "^1.19.1"
}
}
Production dependencies are the libraries actually called in by production code; they’re necessary to run the app at all. Development dependencies are needed to run things like the test harness. This StackOverflow explains this and the other types of dependencies it’s possible to specify.
A word on the actual dependencies, since many of them will appear again and again in actual projects:
body-parser is Express middleware that makes the body of POST routes available during routing. It’s used primarily for form validation.
If you’re reading this you should know what express is already. It’s a minimal web framework, similar to Python’s Flask.
mongoose is an object-document mapper; similar to SQLAlchemy or other object-relational mappers, but for MongoDB rather than a relational database.
password-generator is what it says on the tin.
nodemon is a file watcher and autocompiler. Most static site generators do this by default or make it available as a config option.
prettier is a code formatter, similar to Black.
package-lock.json
This is an autogenerated file containing the entire dependency tree of the project. It’s too large to show in its entirety, but part of it looks like:
{
"name": "simple-mern",
"version": "0.2.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"@sindresorhus/is": {
"version": "0.14.0",
"resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-0.14.0.tgz",
"integrity": "sha512-9NET910DNaIPngYnLLPeg+Ogzqsi9uM4mSboU5y6p8S5DzMTVEsJZrawi+BoDNUVBa2DhJqQYUFvMDfgU062LQ==",
"dev": true
},
...
}
}
In the next post we’ll discuss the Express and Mongo backend.