⛔️ DEPRECATED - Boilerplate for getting started with MERN stack

Overview

⛔️ DEPRECATED

MERN is deprecated and is no longer actively maintained.

mern-starter

title PRs Welcome Discuss on Hashnode

MERN is a scaffolding tool which makes it easy to build isomorphic apps using Mongo, Express, React and NodeJS. It minimises the setup time and gets you up to speed using proven technologies.

Road to V3!

We're on our way towards V3, which will bring a few updates to MERN! We are tracking with the following milestones:

  • V2.4.0 -> Webpack 3 and many fixes Completed : list of changes
  • V2.5.0 -> React V16.x upgrade and propTypes fix
  • V2.6.0 -> React Router V4
  • V2.7.0 -> Webpack upgrade to V4
  • V2.8.0 -> database/mongo/mongoose updates/fixes
  • V2.9.0 -> Express/Server dependencies/code upgrade
  • V3.0.0 -> CLI/devtools optimization (docker, etc.)

Quickstart

  npm install -g mern-cli
  mern init your_new_app
  cd your_new_app
  npm install
  npm start

Note : Please make sure your MongoDB is running. For MongoDB installation guide see this. Also npm6 is required to install dependencies properly.

Available Commands

  1. npm run start - starts the development server with hot reloading enabled

  2. npm run bs - bundles the code and starts the production server

  3. npm run test - start the test runner

  4. npm run watch:test - start the test runner with watch mode

  5. npm run cover - generates test coverage report

  6. npm run lint - runs linter to check for lint errors

File Structure

Webpack Configs

MERN uses Webpack for bundling modules. There are four types of Webpack configs provided webpack.config.dev.js (for development), webpack.config.prod.js (for production), webpack.config.server.js (for bundling server in production) and webpack.config.babel.js (for babel-plugin-webpack-loaders for server rendering of assets included through webpack).

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

Server

MERN uses express web framework. Our app sits in server.js where we check for NODE_ENV.

If NODE_ENV is development, we apply Webpack middlewares for bundling and Hot Module Replacement.

Server Side Rendering

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

All the routes are defined in client/routes.js. React Router renders components according to route requested.

// Server Side Rendering based on routes matched by React-router.
app.use((req, res) => {
    match({
        routes,
        location: req.url
    }, (err, redirectLocation, renderProps) => {
        if (err) {
            return res.status(500).end('Internal server error');
        }

        if (!renderProps) {
            return res.status(404).end('Not found!');
        }

        const initialState = {
            posts: [],
            post: {}
        };

        const store = configureStore(initialState);

        fetchComponentData(store.dispatch, renderProps.components, renderProps.params).then(() => {
            const initialView = renderToString(
                <Provider store = {store} >
                  <RouterContext {...renderProps}/>
                </Provider>
            );

            const finalState = store.getState();

            res.status(200).end(renderFullPage(initialView, finalState));
        }).catch(() => {
            res.end(renderFullPage('Error', {}));
        });
    });
});

match takes two parameters, first is an object that contains routes, location and history and second is a callback function which is called when routes have been matched to a location.

If there's an error in matching we return 500 status code, if no matches are found we return 404 status code. If a match is found then, we need to create a new Redux Store instance.

Note: A new Redux Store has populated afresh on every request.

fetchComponentData is the essential function. It takes three params: first is a dispatch function of Redux store, the 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 the client for client-side rendering in window.__INITIAL_STATE__.

Client

Client directory contains all the shared components, routes, modules.

components

This folder contains all the common components which are used throughout the project.

index.js

Index.js simply does client side rendering using the data provided from window.__INITIAL_STATE__.

modules

Modules are the way of organising different domain-specific modules in the project. A typical module contains the following

.
└── Post
    ├── __tests__                    // all the tests for this module goes here
    |   ├── components               // Sub components of this module
    |   |   ├── Post.spec.js
    |   |   ├── PostList.spec.js
    |   |   ├── PostItem.spec.js
    |   |   └── PostImage.spec.js
    |   ├── pages
    |   |   ├── PostPage.spec.js
    |   |   └── PostViewPage.spec.js
    |   ├── PostReducer.spec.js
    |   └── PostActions.spec.js
    ├── components                   // Sub components of this module
    |   ├── Post.js
    |   ├── PostList.js
    |   ├── PostItem.js
    |   └── PostImage.js
    ├── pages                        // React Router Pages from this module
    |   ├── PostPage
    |   |   ├── PostPage.js
    |   |   └── PostPage.css
    |   └── PostViewPage
    |       ├── PostViewPage.js
    |       └── PostViewPage.css
    ├── PostReducer.js
    └── PostActions.js

Misc

Importing Assets

Assets can be kept where you want and can be imported into your js files or css files. Those fill be served by webpack in development mode and copied to the dist folder during production.

ES6 support

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.

Docker

There are docker configurations for both development and production.

To run docker for development:

docker-compose build # re-run after changing dependencies
docker-compose up

or, if you want to override the web port:

WEB_PORT=<your_custom_port> docker-compose up

To run docker for production:

docker-compose -f docker-compose-production.yml up --build

To reset the database:

docker-compose down --volumes

Make your MERN

In this version, we enabled the mern-cli to clone not only this project but also the variants of mern-starter like one project with MaterialUI or JWT auth. To make your version of MERN, follow these steps

  1. Clone this project

    git clone https://github.com/Hashnode/mern-starter
  2. Make your changes. Add a package, add authentication, modify the file structure, replace Redux with MobX or anything else.

  3. In this version, we also added code generators. Blueprints for those generators are located at config/blueprints, and config is located at mern.json. Make sure to edit them if necessary after your made modifications in the previous step. There is a section below which explains how to modify generators.

  4. Next clone mern-cli project

    git clone https://github.com/Hashnode/mern-cli
  5. Add your project details to variants.json in the cloned project and send a pull request.

Modifying Generators

mern.json

It contains a blueprints array. Each object in it is the config for a generator. A blueprint config contains the name, description, usage, and files array. An example blueprint config

{
  "name": "dumb-s",
  "description": "Generates a dumb react component in shared components",
  "usage": "dumb-s [component-name]",
  "files": [
    {
      "blueprint-path": "config/blueprints/dumb-component.ejs",
      "target-path": "client/components/<%= helpers.capitalize(name) %>.js"
    }
  ]
}

A file object contains

  1. blueprint-path - location of the blueprint file

  2. target-path - location where the file should be generated

  3. parent-path - optional parameter, used if you want to generate the file inside an already existing folder in your project.

Also, target-path supports ejs and the following variables will be passed while rendering,

  1. name - <component-name> input from user

  2. parent - in particular special cases where you need to generate files inside an already existing folder, you can obtain this parent variable from the user. A config using that will look like,

    {
      "name": "dumb-m",
      "description": "Generates a dumb react component in a module directory",
      "usage": "dumb-m <module-name>/<component-name>",
      "files": [
        {
          "blueprint-path": "config/blueprints/dumb-component.ejs",
          "parent-path": "client/modules/<%= helpers.capitalize(parent) %>",
          "target-path": "components/<%= helpers.capitalize(name) %>/<%= helpers.capitalize(name) %>.js"
        }
      ]
    }

    Here, notice the usage. In <module-name>/<component-name>, <module-name> will be passed as parent and <component-name> will be passed as <name>.

  3. helpers - an helper object is passed which include common utility functions. For now, it contains capitalize. If you want to add more, send a PR to mern-cli.

Blueprint files

Blueprints are basically ejs templates which are rendered with the same three variables (name, optional parent and helpers object) as above.

Caveats

FOUC (Flash of Unstyled Content)

To make the hot reloading of CSS work, we are not extracting CSS in development. Ideally, during server rendering, we will be extracting CSS, and we will get a .css file, and we can use it in the html template. That's what we are doing in production.

In development, after all scripts get loaded, react loads the CSS as BLOBs. That's why there is a second of FOUC in development.

Client and Server Markup Mismatch

This warning is visible only on development and totally harmless. This occurs to hash difference in react-router. To solve it, react router docs asks you to use match function. If we use match, react-hot-reloader stops working.

License

MERN is released under the MIT License.

Comments
  • MERN V2

    MERN V2

    For the past few weeks, we were busy with the development of Hashnode. That's why couldn't give more time to MERN. We are sorry for those pending issues and pull requests. We will close those issues ASAP.

    In upcoming weeks, we are planning to release the next version of MERN. This is a discussion thread for what should go in MERN v2. I'm adding a rough list of things what we think would be a great addition to MERN. If you think something should not be there or something else should be there, feel free to comment.

    • [x] Improve file structure (#90)
    • [x] Add PostCSS with CSS Modules (#89)
    • [x] Update deps
    • [x] Upgrade to webpack 2 and implement tree shaking
    • [x] Code splitting with react-router
    • [x] Add react-hot-loader 3
    • [x] Add ava and enzyme for testing with code coverage (#143)
    • [x] Create server bundle for production (#48)
    • [x] Commenting code (#39)
    • [x] Add docker
    • [x] Add react-intl (#54)
    • [x] Update documentation

    Note: I'll be creating a v2 branch, please make all future PRs against that branch.

    discussion 
    opened by somus 29
  • "Cannot find module" when running npm start for v2.0.0 on Windows 10

    Hi all, I am running Node v6.2.2 and npm 3.9.6 on Windows 10 Preview build 14366.

    I did a clean install of the starter repo - both by cloning the repo and also using the CLI, which apparently now uses v2.0.0. When I hit "npm start" I get the following error. It seems like there is some issue with how file paths are setup.

    I'm new to the JavaScript tooling space so I'm not sure how to debug. Any thoughts or workarounds would be appreciated.

    
    module.js:442
        throw err;
        ^
    
    Error: Cannot find module 'C:\Users\Jacob\OneDrive\Documents\mern-app\C\:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\webpack\bin\webpack.js'
        at Function.Module._resolveFilename (module.js:440:15)
        at Function.Module._load (module.js:388:25)
        at Module.runMain (module.js:575:10)
        at run (node.js:348:7)
        at startup (node.js:140:9)
        at node.js:463:3
    C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-core\lib\transformation\file\index.js:591
          throw err;
          ^
    
    Error: C:/Users/Jacob/OneDrive/Documents/mern-app/client/modules/App/App.js: Command failed: node C\:\\Users\\Jacob\\OneDrive\\Documents\\mern-app\\node_modules\\webpack\\bin\\webpack.js C\:\\Users\\Jacob\\OneDrive\\Documents\\mern-app\\client\\modules\\App\\App.css C\:\\Users\\Jacob\\AppData\\Local\\Temp\\.webpack.res.1466494094898_296377.js --config ./webpack.config.babel.js --bail
    module.js:442
        throw err;
        ^
    
    Error: Cannot find module 'C:\Users\Jacob\OneDrive\Documents\mern-app\C\:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\webpack\bin\webpack.js'
        at Function.Module._resolveFilename (module.js:440:15)
        at Function.Module._load (module.js:388:25)
        at Module.runMain (module.js:575:10)
        at run (node.js:348:7)
        at startup (node.js:140:9)
        at node.js:463:3
    
        at checkExecSyncError (child_process.js:486:13)
        at execSync (child_process.js:526:13)
        at exports.default (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-plugin-webpack-loaders\lib\runWebPackSync.js:41:51)
        at PluginPass.CallExpression (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-plugin-webpack-loaders\lib\plugin.js:93:60)
        at newFn (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\visitors.js:310:19)
        at NodePath._call (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\path\context.js:78:18)
        at NodePath.call (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\path\context.js:49:17)
        at NodePath.visit (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\path\context.js:108:12)
        at TraversalContext.visitQueue (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\context.js:174:16)
        at TraversalContext.visitSingle (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\context.js:124:19)
        at TraversalContext.visit (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\context.js:219:19)
        at Function.traverse.node (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\index.js:171:17)
        at NodePath.visit (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\path\context.js:118:43)
        at TraversalContext.visitQueue (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\context.js:174:16)
        at TraversalContext.visitMultiple (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\context.js:119:17)
        at TraversalContext.visit (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\context.js:217:19)
        at Function.traverse.node (C:\Users\Jacob\OneDrive\Documents\mern-app\node_modules\babel-traverse\lib\index.js:171:17)
    
    opened by jacobstern 23
  • Chunk.entry was removed. Use hasRuntime()

    Chunk.entry was removed. Use hasRuntime()

    When I run bs to build my project I got this error

    ERROR in chunk vendor [entry]
    app.49e93b4e8d0733ad1108.js
    Chunk.entry was removed. Use hasRuntime()
    

    I tried to update webpack@^2.1.0-beta.17 + extract-text-webpack-plugin@^2.0.0-beta which talked in this webpack issue I still get this error.

    opened by colinshen 17
  • Error upon initializing

    Error upon initializing

    Love what you guys have done here.

    Getting these three errors in browser console when the following is run: npm install -g mern-cli mern test cd test npm install npm start

    -Required prop posts was not specified in PostContainer. Check the render method of Connect(PostContainer). -Required prop posts was not specified in PostListView. Check the render method of Connect(PostListView). -Cannot read property 'map' of undefined

    OSX version: 10.10.5 node version: v4.2.1 npm version: 2.14.7

    opened by sirrodgepodge 17
  • mern init mernApp

    mern init mernApp

    module.js:538 throw err; ^

    Error: Cannot find module '../lib/commands/main.js' at Function.Module._resolveFilename (module.js:536:15) at Function.Module._load (module.js:466:25) at Module.require (module.js:579:17) at require (internal/module.js:11:18) at Object. (C:\Users\Jhon\AppData\Roaming\npm\node_modules\mern-cli\bin\mern.js:3:1) at Module._compile (module.js:635:30) at Object.Module._extensions..js (module.js:646:10) at Module.load (module.js:554:32) at tryModuleLoad (module.js:497:12) at Function.Module._load (module.js:489:3)

    opened by fatirjhon 15
  • add scss support and make nodemon development server

    add scss support and make nodemon development server

    SCSS support in development and production.

    In dev, works by bundling with the javascript so that it works with the HMR. In production, works by generating app.css using sass command then minifying to app.min.css and inserting into client/index.js.

    To test:

    • confirm npm start works as intended
    • confirm npm run-script start:prod works as intended
    opened by evansendra 14
  • unable to test (win 10)

    unable to test (win 10)

    Created a fresh new app and was unable to run "npm test" (Windows 10)

    mern init newAPP
    cd newApp
    npm install
    

    it looks like it tries to run a linux script in (\node_modules.bin\acorn)

    the error:

    D:\development\newAPP>npm test
    
    > [email protected] test D:\development\newAPP
    > cross-env NODE_ENV=test PORT=8080 MONGO_URL=mongodb://localhost:27017/mern-test node_modules/.bin/nyc node --harmony-proxies node_modules/.bin/ava
    
    D:\development\newAPP\node_modules\.bin\ava:2
    basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
              ^^^^^^^
    
    SyntaxError: missing ) after argument list
        at exports.runInThisContext (vm.js:53:16)
        at Module._compile (module.js:373:25)
        at Module.replacementCompile (D:\development\newAPP\node_modules\nyc\node_modules\append-transform\index.js:58:13)
        at module.exports (D:\development\newAPP\node_modules\nyc\node_modules\default-require-extensions\js.js:8:9)
        at Object.<anonymous> (D:\development\newAPP\node_modules\nyc\node_modules\append-transform\index.js:62:4)
        at Module.load (module.js:343:32)
        at Function.Module._load (module.js:300:12)
        at Function.Module.runMain (module.js:441:10)
        at Function.runMain (C:\Users\ozkey\.node-spawn-wrap-3376-b97e9a32b699\node:40:10)
        at Object.<anonymous> (D:\development\newAPP\node_modules\nyc\bin\wrap.js:19:4)
     ----------|----------|----------|----------|----------|----------------|
    File      |  % Stmts | % Branch |  % Funcs |  % Lines |Uncovered Lines |
    ----------|----------|----------|----------|----------|----------------|
    ----------|----------|----------|----------|----------|----------------|
    All files |      100 |      100 |      100 |      100 |                |
    ----------|----------|----------|----------|----------|----------------|
    
    npm ERR! Test failed.  See above for more details.
    
    D:\development\newAPP>
    
    opened by ozkey 11
  • importing .scss files

    importing .scss files

    Hi there,

    i have installed sass-loader and node-sass to my project and added this line into my webpack.config.babel.js and webpack.config.dev.js

          {
            test: /\.scss$/,
            loader: 'style-loader!css-loader?localIdentName=[name]__[local]__[hash:base64:5]&modules&importLoaders=1&sourceMap!postcss-loader!sass-loader'
          },
    

    but I am always getting this error when importing .scss file:

    /Users/mmintel/Projekte/writr/node_modules/react-toolbox/lib/app_bar/theme.scss:1
    (function (exports, require, module, __filename, __dirname) { @import "../colors";
                                                                  ^
    
    SyntaxError: Unexpected token ILLEGAL
    

    What's wrong with it?

    opened by mmintel 11
  • Some problems with

    Some problems with "...\msbuild.exe` failed with exit code: 1"

    C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\src\win_delay_load_hook.c(34): error C2373: '__pfnDliNotifyHook2': redefinition; different type modifiers [C:\Users\Nagibator\WebstormProjects\DotaItems\node_modules\nodejieba\build\nodejieba.vcxproj] C:\Program Files (x86)\Microsoft Visual Studio 14.0\VC\include\delayimp.h(134): note: see declaration of '__pfnDliNotifyHook2' gyp ERR! build error gyp ERR! stack Error: C:\Program Files (x86)\MSBuild\14.0\bin\msbuild.exe failed with exit code: 1 gyp ERR! stack at ChildProcess.onExit (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\build.js:276:23) gyp ERR! stack at emitTwo (events.js:106:13) gyp ERR! stack at ChildProcess.emit (events.js:191:7) gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:204:12) gyp ERR! System Windows_NT 6.1.7601 gyp ERR! command "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js" "rebuild" gyp ERR! cwd C:\Users\Nagibator\WebstormProjects\DotaItems\node_modules\nodejieba gyp ERR! node -v v6.2.0 gyp ERR! node-gyp -v v3.3.1 gyp ERR! not ok

    ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// I want to know what does it mean and how fix it? Anyway mern-starter continue install and finish with //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

    npm WARN optional Skipping failed optional dependency /chokidar/fsevents: npm WARN notsup Not compatible with your operating system or architecture: [email protected] npm WARN [email protected] requires a peer of webpack@>=1.12.9 <3.0.0 but none was installed. npm WARN [email protected] requires a peer of webpack@^1.4.0-beta6 but none was installed. npm WARN [email protected] requires a peer of webpack@^1.9.11 but none was installed.

    opened by Amigos466 11
  • cross-env not found

    cross-env not found

    I followed the instructions to run docker for development. I ran docker-compose -f docker-compose-development.yml build and it succeeded, but then docker-compose -f docker-compose-development.yml up failed because one of the npm scripts was looking for cross-env and couldn't find it. Here's the trace:

    Williams-MacBook-Pro:mern-starter William$ docker-compose -f docker-compose-development.yml up
    Starting mernstarter_db_1
    Creating mernstarter_web_1
    Attaching to mernstarter_db_1, mernstarter_web_1
    db_1   | 2016-06-22T17:42:58.921+0000 I CONTROL  [initandlisten] MongoDB starting : pid=1 port=27017 dbpath=/data/db 64-bit host=e0f5427f51b1
    db_1   | 2016-06-22T17:42:58.922+0000 I CONTROL  [initandlisten] db version v3.2.7
    db_1   | 2016-06-22T17:42:58.922+0000 I CONTROL  [initandlisten] git version: 4249c1d2b5999ebbf1fdf3bc0e0e3b3ff5c0aaf2
    db_1   | 2016-06-22T17:42:58.922+0000 I CONTROL  [initandlisten] OpenSSL version: OpenSSL 1.0.1e 11 Feb 2013
    db_1   | 2016-06-22T17:42:58.922+0000 I CONTROL  [initandlisten] allocator: tcmalloc
    db_1   | 2016-06-22T17:42:58.922+0000 I CONTROL  [initandlisten] modules: none
    db_1   | 2016-06-22T17:42:58.922+0000 I CONTROL  [initandlisten] build environment:
    db_1   | 2016-06-22T17:42:58.922+0000 I CONTROL  [initandlisten]     distmod: debian71
    db_1   | 2016-06-22T17:42:58.922+0000 I CONTROL  [initandlisten]     distarch: x86_64
    db_1   | 2016-06-22T17:42:58.922+0000 I CONTROL  [initandlisten]     target_arch: x86_64
    db_1   | 2016-06-22T17:42:58.922+0000 I CONTROL  [initandlisten] options: {}
    db_1   | 2016-06-22T17:42:58.926+0000 I STORAGE  [initandlisten] wiredtiger_open config: create,cache_size=1G,session_max=20000,eviction=(threads_max=4),config_base=false,statistics=(fast),log=(enabled=true,archive=true,path=journal,compressor=snappy),file_manager=(close_idle_time=100000),checkpoint=(wait=60,log_size=2GB),statistics_log=(wait=0),
    db_1   | 2016-06-22T17:42:58.975+0000 I CONTROL  [initandlisten]
    db_1   | 2016-06-22T17:42:58.975+0000 I CONTROL  [initandlisten] ** WARNING: /sys/kernel/mm/transparent_hugepage/enabled is 'always'.
    db_1   | 2016-06-22T17:42:58.975+0000 I CONTROL  [initandlisten] **        We suggest setting it to 'never'
    db_1   | 2016-06-22T17:42:58.975+0000 I CONTROL  [initandlisten]
    db_1   | 2016-06-22T17:42:58.975+0000 I CONTROL  [initandlisten] ** WARNING: /sys/kernel/mm/transparent_hugepage/defrag is 'always'.
    db_1   | 2016-06-22T17:42:58.975+0000 I CONTROL  [initandlisten] **        We suggest setting it to 'never'
    db_1   | 2016-06-22T17:42:58.975+0000 I CONTROL  [initandlisten]
    db_1   | 2016-06-22T17:42:58.976+0000 I FTDC     [initandlisten] Initializing full-time diagnostic data capture with directory '/data/db/diagnostic.data'
    db_1   | 2016-06-22T17:42:58.976+0000 I NETWORK  [HostnameCanonicalizationWorker] Starting hostname canonicalization worker
    db_1   | 2016-06-22T17:42:58.990+0000 I NETWORK  [initandlisten] waiting for connections on port 27017
    web_1  | npm info it worked if it ends with ok
    web_1  | npm info using [email protected]
    web_1  | npm info using [email protected]
    web_1  | npm info lifecycle [email protected]~prestart: [email protected]
    web_1  | npm info lifecycle [email protected]~start: [email protected]
    web_1  |
    web_1  | > [email protected] start /usr/src/app
    web_1  | > cross-env BABEL_DISABLE_CACHE=1 NODE_ENV=development nodemon index.js
    web_1  |
    web_1  | sh: 1: cross-env: not found
    web_1  |
    web_1  | npm info lifecycle [email protected]~start: Failed to exec start script
    web_1  | npm ERR! Linux 4.4.13-moby
    web_1  | npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "start"
    web_1  | npm ERR! node v6.2.2
    web_1  | npm ERR! npm  v3.9.5
    web_1  | npm ERR! file sh
    web_1  | npm ERR! code ELIFECYCLE
    web_1  | npm ERR! errno ENOENT
    web_1  | npm ERR! syscall spawn
    web_1  | npm ERR! [email protected] start: `cross-env BABEL_DISABLE_CACHE=1 NODE_ENV=development nodemon index.js`
    web_1  | npm ERR! spawn ENOENT
    web_1  | npm ERR!
    web_1  | npm ERR! Failed at the [email protected] start script 'cross-env BABEL_DISABLE_CACHE=1 NODE_ENV=development nodemon index.js'.
    web_1  | npm ERR! Make sure you have the latest version of node.js and npm installed.
    web_1  | npm ERR! If you do, this is most likely a problem with the mern-starter package,
    web_1  | npm ERR! not with npm itself.
    web_1  | npm ERR! Tell the author that this fails on your system:
    web_1  | npm ERR!     cross-env BABEL_DISABLE_CACHE=1 NODE_ENV=development nodemon index.js
    web_1  | npm ERR! You can get information on how to open an issue for this project with:
    web_1  | npm ERR!     npm bugs mern-starter
    web_1  | npm ERR! Or if that isn't available, you can get their info via:
    web_1  | npm ERR!     npm owner ls mern-starter
    web_1  | npm ERR! There is likely additional logging output above.
    web_1  | npm WARN Local package.json exists, but node_modules missing, did you mean to install?
    web_1  |
    web_1  | npm ERR! Please include the following file with any support request:
    web_1  | npm ERR!     /usr/src/app/npm-debug.log
    db_1   | 2016-06-22T17:43:00.260+0000 I NETWORK  [initandlisten] connection accepted from 172.17.0.1:50694 #1 (1 connection now open)
    mernstarter_web_1 exited with code 1
    
    bug V2.5.0 
    opened by wdhorton 11
  • npm test broken out of the box

    npm test broken out of the box

    After installing MERN, running npm test results in 4 errors which look like the following

    3. Unhandled Rejection ValidationError: Pathslugis required.

    bug V2.5.0 
    opened by SpicyPete 10
Releases(2.4.0)
  • 2.4.0(Jun 4, 2018)

    • Fix test runner windows
    • Updated to webpack 3
    • Use .dockerignore to increase speed of building Docker image (no need to copy files to Docker build context).
    • Use npm@6 and add package-lock.json.
    • Update versions of nodejs used for testing in Travis (only LTS / actively maintained versions - no more node@4!!).
    • Use a single Dockerfile w/ build targets, to greatly speed up building of Docker image.
    • Swap default Docker environment from production to development, to improve DX.
    • Eliminate production-mode inclusion of devDependencies, to keep production Docker image as light as possible and lower production-mode memory usage.
    • Explicitly volume-map all files into Docker container when in dev-mode.
    • Removed the --harmony-proxies flag from npm test, as it is no longer supported by nodejs.
    • Eliminate different markup warning between client/server during dev
    Source code(tar.gz)
    Source code(zip)
  • v2.0(Jun 21, 2016)

    Healthy & good nature cats. Require very little grooming

    Release Notes

    • Improved file structure
    • Webpack 2 with Tree Shaking
    • Hot Reloading of react components and assets
    • Ava test runner
    • Internationalization support
    • Code Splitting with React Router
    • Code Generation through mern-cli
    • Docker support
    • Now you can make you own version of MERN. To know more, go here
    Source code(tar.gz)
    Source code(zip)
Owner
Hashnode
A one-stop platform to start blogging as a developer!
Hashnode
🍔 A Node.js Serverless Framework for front-end/full-stack developers. Build the application for next decade. Works on AWS, Alibaba Cloud, Tencent Cloud and traditional VM/Container. Super easy integrate with React and Vue. 🌈

Midway - 一个面向未来的云端一体 Node.js 框架 English | 简体中文 ?? 欢迎观看 Midway Serverless 2.0 发布会回放: https://www.bilibili.com/video/BV17A411T7Md 《Midway Serverless 发布

Midway.js 6.3k Jan 8, 2023
This is MERN Stack Ecommerce Project Made to Teach MERN Stack on YouTube

MERN E-COMMERCE TUTORIAL Hi! My name is Abhishek Singh, I have created this tutorial to teach MERN Stack for free on YouTube. Prerequisite Must have b

Abhishek Singh 558 Jan 5, 2023
Source code for the deprecated expo-google-app-auth package. Deprecated in favor of expo-auth-session.

expo-google-app-auth Source code for the deprecated expo-google-app-auth package. Expo Google App Auth API wrapped the deprecated expo-app-auth packag

Expo 4 Nov 2, 2022
This is a full-stack exercise tracker web application built using the MERN (MongoDB, ExpressJS, ReactJS, NodeJS) stack. You can easily track your exercises with this Full-Stack Web Application.

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

WMouton 2 Dec 25, 2021
Functions Recipes is a library of examples to help you getting started with Salesforce Functions and get used to their main features.

Functions Recipes Introduction Salesforce Functions lets you use the Salesforce Platform for building event-driven, elastically scalable apps and expe

Trailhead Apps 172 Dec 29, 2022
Grupprojekt för kurserna 'Javascript med Ramverk' och 'Agil Utveckling'

JavaScript-med-Ramverk-Laboration-3 Grupprojektet för kurserna Javascript med Ramverk och Agil Utveckling. Utvecklingsguide För information om hur utv

Svante Jonsson IT-Högskolan 3 May 18, 2022
Hemsida för personer i Sverige som kan och vill erbjuda boende till människor på flykt

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

null 4 May 3, 2022
Kurs-repo för kursen Webbserver och Databaser

Webbserver och databaser This repository is meant for CME students to access exercises and codealongs that happen throughout the course. I hope you wi

null 14 Jan 3, 2023
A secure MERN Stack boilerplate ready for Production that uses Docker & Nginx.

A production ready & secure boilerplate for the MERN Stack that uses Docker & Nginx. Focus on the product and not the setup. You can directly start wo

Karan Jagtiani 34 Dec 23, 2022
Online Inventory Control System for an apparel manufacturing company "CASANOVA" (Pvt) Ltd. Technology stack: Node.js, Express.js, MongoDB Atlas, React.js (MERN Stack).

Project Name - Online Inventory Control System for an apparel manufacturing company "CASANOVA". The project was given a "A" grade. Group Leader - IT20

Pasindu Rukshan 1 Dec 26, 2021
Full-Stack Instgram Clone using MERN Stack and Socket.io

Instagram MERN Full-Stack Instgram Clone using MERN Stack and Socket.io Visit Now ?? ??️ Tech Stack Frontend: Backend: Realtime Communication: Cloud S

Jigar Sable 326 Dec 27, 2022
It is a solo Project and In this repo I try to build a E-Commerce full-stack website with MERN stack technologies. For Practice purpose.

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Alok Kumar 5 Aug 3, 2022
Boilerplate to get started building React-based interfaces for Crestron using CH5

Getting Started with Crestron UI This project was bootstrapped with Create React App. Example component communicating with the Crestron-CH5 library: i

Mukund Salia 3 Apr 25, 2022
A MERN boilerplate repository with RBAC feature, following all production best practices.

Welcome to the RBAC MERN Boilerplate project A MERN boilerplate repository with RBAC feature, following all production best practices. In this reposit

Foyzul Karim 268 Dec 27, 2022
BookAttic is an online bookstore made using the MERN stack.

BookAttic is an online bookstore made using the MERN stack. Link to the website. Table of contents General info Technologies Setup General info This p

Chirag Datwani 32 Nov 19, 2022
A Netflix clone created with the MERN Stack

X-Netflix X-Netflix is a streaming platform based on Netflix UI: built with ReactJS in frontend and nodeJS in backend. Built with FrontEnd: React.JS,

Mehdi BHA 52 Aug 19, 2022
This is my first attempt in creating a mern stack ecommerce website. Hope you like it!!

MERN E-COMMERCE PROJECT Hi! My name is Suhrrid Banerjee, This is my first attempt in creating a MERN stack e-commerce website. Prerequisite Nil Env Va

Suhrrid Banerjee 1 Jan 8, 2022
MERN stack application which serves as an online map journal where users can mark and rate the places they've been to.

PlaceRate PlaceRate is a MERN stack application which serves as an online map journal where users can mark and rate the places they've been to. You ca

Yuvraj Virdi 0 May 17, 2022
MERN stack travel app using mapbox API, Travel and drop pin , share reviews and rate the location

MERN-Travel-Map Travel Map Pin A single page application built with MERN Stack from scratch (MongoDB + Mongoose, Express, React & NodeJs) Table of Con

Bùi Quốc Trọng 11 Dec 29, 2022
It consists of a recreation of Twitter, to put into practice both Front-end and Back-end knowledge by implementing the MERN Stack together with other technologies to add more value to the project.

Twitter-Clone_Back-end ✨ Demo. ?? About the project. ?? Descriptions. It consists of a recreation of Twitter, to put into practice knowledge of both F

Mario Quirós Luna 5 Apr 12, 2022