mean003

A JavaScript development environment starter kit built on the MEAN stack toolchain (Express, Webpack, Babel, Mocha). This project provides a preconfigured setup for building web applications with ES6+ support, hot-reloading, linting, automated testing, and production bundling.

What It Does

• Serves a simple web application using Express on port 3000
• Bundles JavaScript and CSS with Webpack (dev and production configs)
• Transpiles modern ES6+ syntax with Babel
• Lints code with ESLint (with watch mode)
• Runs unit tests with Mocha and Chai (with watch mode)
• Supports sharing your local dev server via localtunnel
• Supports deployment to Surge.sh for static hosting

Prerequisites

• Node.js (v10 or higher)
• npm (comes with Node.js)

Note: On Node.js 17+, the --openssl-legacy-provider flag is required for Webpack 4. This is already configured in the npm scripts.

Getting Started

1. Install dependencies:

   npm install

2. Start the development server:

   npm start

   This runs the following in parallel:

   • Opens the app at http://localhost:3000
   • Starts ESLint in watch mode
   • Starts Mocha tests in watch mode

3. Run linting manually:

   npm run lint

4. Run tests manually:

   npm test

Available Scripts

Script	Description
npm start	Start dev server, linter, and test watcher in parallel
npm run open:src	Start only the Express dev server with Webpack
npm run lint	Run ESLint on source and build scripts
npm run lint:watch	Run ESLint in watch mode
npm test	Run Mocha tests
npm run test:watch	Run Mocha tests in watch mode
npm run share	Start dev server and expose it via localtunnel
npm run surge	Deploy the src directory to Surge.sh
npm run deploy	Start dev server and deploy to Surge.sh in parallel

Project Structure

mean003/
buildScripts/ # Build and dev server scripts
srcServer.js # Express dev server with Webpack middleware
distServer.js # Express production server
build.js # Production build script
startMessage.js # Startup console message
testSetup.js # Mocha/Babel test configuration
generateMockData.js
mockDataSchema.js
src/ # Application source code
index.html # Main HTML page
index.js # Application entry point
index.css # Global styles
index.test.js # Unit tests
api/ # API-related modules
db.json # Mock database
webpack.config.dev.js # Webpack development configuration
webpack.config.prod.js # Webpack production configuration
package.json

License

MIT License - Copyright (c) 2020 Aaron Balaster