Giter Club home page Giter Club logo

qeasy-web's Introduction

React boiler plate

Core

Unit Testing

Linting

Command Line Commands

Initialization

Development

npm run start

Starts the development server running on http://localhost:3000

Generators

npm run generate

Allows you to auto-generate boilerplate code for common parts of your application, specifically components, and containers. You can also run npm run generate <part> to skip the first selection. (e.g. npm run generate container)

Server

Development

npm start

Starts the development server and makes your application accessible at localhost:3000. Changes in the application code will be hot-reloaded.

Production

npm run start:production
  • Runs tests (see npm test)
  • Builds your app (see npm run build)
  • Starts the production server (see npm run start:prod)

The app is built for optimal performance: assets are minified and served gzipped.

Host and Port

To change the host and/or port the app is accessible at, pass the --host and/or --port option to the command with --. E.g. to make the app visible at my-local-hostname:5000, run the following: npm start -- --host my-local-hostname --port 5000

Building

npm run build

Preps your app for deployment (does not run tests). Optimizes and minifies all files, piping them to the build folder.

Upload the contents of build to your web server to see your work live!

Testing

See the testing documentation for detailed information about our testing setup!

Unit testing

npm test

Tests your application with the unit tests specified in the **/tests/*.js files throughout the application.
All the test commands allow an optional -- [string] argument to filter the tests run by Jest. Useful if you need to run a specific test only.

# Run only the Button component tests
npm test -- Button

Watching

npm run test:watch

Watches changes to your application and re-runs tests whenever a file changes.

Remote testing

npm run start:tunnel

Starts the development server and tunnels it with ngrok, making the website available worldwide. Useful for testing on different devices in different locations!

Dependency size test

npm run analyze

This command will generate a stats.json file from your production build, which you can upload to the webpack analyzer or Webpack Visualizer. This analyzer will visualize your dependencies and chunks with detailed statistics about the bundle size.

Linting

npm run lint

Lints your JavaScript and your CSS.

npm run lint:eslint:fix -- .

Lints your code and tries to fix any errors it finds.

qeasy-web's People

Contributors

oguzerol avatar

Watchers

 avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.