https://github.com/itsmunim/simple-react-template

A simple enough react boilerplate; built using webpack, served by webpack-serve, comes with lodash, axios and jquery.
https://github.com/itsmunim/simple-react-template

boilerplate boilerplate-template bootstrap enzyme font-awesome jest jquery lodash react react-axios react-scaffold react-template reactjs simple webpack

Last synced: about 2 hours ago
JSON representation

A simple enough react boilerplate; built using webpack, served by webpack-serve, comes with lodash, axios and jquery.

• Host: GitHub
• URL: https://github.com/itsmunim/simple-react-template
• Owner: itsmunim
• License: mit
• Created: 2018-04-10T10:14:41.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2019-04-02T08:24:59.000Z (over 5 years ago)
• Last Synced: 2024-02-23T09:43:04.922Z (9 months ago)
• Topics: boilerplate, boilerplate-template, bootstrap, enzyme, font-awesome, jest, jquery, lodash, react, react-axios, react-scaffold, react-template, reactjs, simple, webpack
• Language: JavaScript
• Homepage:
• Size: 244 KB
• Stars: 16
• Watchers: 2
• Forks: 3
• Open Issues: 0
• Metadata Files:
  • Readme: ReadMe.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
### Simple React Template

A simple enough react boilerplate; built using `webpack`, served by

`webpack-dev-server`, comes with `lodash`, `axios` and `jquery`.

## Setup

- `npm install`

- Build for dev- `npm run build-dev`

- Build for prod- `npm run build-prod`

- Running Tests- `npm run test`

- Run in localhost:3000 & open in browser(auto watch)- `npm start`

## What's included

- `webpack` is used to build and bundle

- `scss` is used as `css` pre-processor

- `babel` is used to transpile `es6`-> `es5`

- `eslint` is used for linting

- `axios` is included as http request framework

- `jquery` is included

- `lodash` is included

- `bootstrap` is used for basic component styling & structure

- `font-awesome` is used for icon fonts

## How it's structured and should be

   ```

   |-- src

      |-- components

         |-- main (the component that's responsible for view switching based on route)

            |-- main.js

         |-- another.component

            |-- component.js

            |-- _component.scss

         |-- _components.scss (all the .scss partials defined in different components are referenced here)

      |-- views

          |-- home.js (or can be a directory of a view)

          |-- another.view

              |-- another.view.js

              |-- _another.view.scss

          |-- _views.scss (all the .scss partials defined in different views are referenced here)

      |-- config.js (contains different configurations and routes for different views)

      |-- index.scss (refers _components.scss, _views.scss and any other .scss partials)

      |-- index.js (the entry point where the app renders the main component and which eventually renders the views based on selected route; which it knows via the routes from config.js)

   ```