https://github.com/mbchoa/react-ecosystem

Repo to explore React ecosystem libraries and developer tooling to bootstrap production grade React applicaiton
https://github.com/mbchoa/react-ecosystem

babel react react-hot-loader-3 webpack webpack-dev-server

Last synced: 8 days ago
JSON representation

Repo to explore React ecosystem libraries and developer tooling to bootstrap production grade React applicaiton

• Host: GitHub
• URL: https://github.com/mbchoa/react-ecosystem
• Owner: mbchoa
• License: mit
• Created: 2017-06-02T07:55:57.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2022-12-07T00:58:57.000Z (about 2 years ago)
• Last Synced: 2024-10-28T08:26:28.368Z (about 2 months ago)
• Topics: babel, react, react-hot-loader-3, webpack, webpack-dev-server
• Language: JavaScript
• Homepage:
• Size: 64.5 KB
• Stars: 1
• Watchers: 3
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# react-ecosystem

## Overview

This is a basic setup for a React app with the tools needed to get a development environment up and running.

## Technologies

- React

- Webpack

- Babel

- webpack-dev-server

- React Hot Loader 3

- Jest

- Enzyme

- ESLint

- Express

- TravisCI

## Directory Structure

```

.

├── /dist/                          # Folder destination for building bundles for production

├── /src/                           # Source files to be bundled by webpack

│    ├── /components/               # React views component package

│    └── index.js                   # App entry point

├── /tools/                         # Tooling folder containing scripts and config for development, building and deployment

│    ├── webpack.client.babel.js    # Webpack configuration file for bundling server-side code

│    ├── webpack.common.js          # Base Webpack configuration file

│    ├── webpack.dev.babel.js       # Webpack configuration file for adding development properties to client-side config

│    └── webpack.server.babel.js    # Webpack configuration file for bundling client-side code

├── .babelrc                        # Babel configuration file to define presets and plugins

├── .eslintrc                       # ESLint configuration file to specify linting rules

├── index-template.html             # HTML template used for HtmlWebpackPlugin

```

## Development

1. Clone repo to your machine and navigate to project

2. Run `npm install` to install npm modules

3. Run `npm run dev` to start the Webpack development server

## Production

1. Run `npm run build` to transpile client-side and server-side code

2. Run `npm start` to start up Express web server to serve React app

3. Navigate browser URL to `http://localhost:3000` to run React app