1.1.0 • Public • Published


Git guide

Getting started

Home Page

Step 1

> npm i reactrouter-parcel
> yarn add reactrouter-parcel

You may need to add full path like

> npm i c:\user\username\reactrouter-parcel

Step 2

> npm install
> yarn add

To install all the dependencies and Boom !!!

Start the server via

> npm start
> npm run dev

This is my very first package, let my know if their is any errors or suggestions. Thanks!

All the things mentioned below are done already for you by this package.

Setting up everything

>>> git init
>>> npm init

>>> npm install prettier
--- Make .prettierrc ---

>>> npm install -D eslint@7.18.0 eslint-config-prettier@8.1.0
--- Make .eslintrc.json ---
>>> npm install -D parcel@next
# >>> npm install -D parcel@1.12.3

>>> npm install react@17.0.1 react-dom@17.0.1

--- Make .babelrc ---
>>> npm install -D @babel/core @babel/cli @babel/preset-react
# >>> npm install -D @babel/core@7.12.16 @babel/present-react@7.12.13

--- Add browser list in package.json--

>>> npm install -D eslint-plugin-import@2.22.1 eslint-plugin-jsx-a11y@6.4.1 eslint-plugin-react@7.22.0

--- update .eslintrc.json ---

>>> npm install -D eslint-plugin-react-hooks@4.2.0
# consist of best pactices made by react team for react hooks

Don't forget to set package.json




  "extends": ["eslint:recommended", "prettier"],
  "plugins": [],
  "parserOptions": {
    "ecmaVersion": 2021,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true
  "env": {
    "es6": true,
    "browser": true,
    "node": true

You can also set "eslint:airbnb" and install plugins for that

In App.js if you write

/* global React ReactDOM */

It will so, oh okey you are expecting a global called react, I'm good with that :)


It's out bundler like webpack Set up entry point for it in package.json

# Under scripts
"dev": "parcel src/index.html",

We don't even need a config file for parcel Just look for parcel version parcel.

  "presets": [
        "runtime": "automatic"


Best pactices thing

# npm install -D eslint-plugin-react-hooks@4.2.0
"extends": [ "plugin:react-hooks/recommended"]

React development Environment

  • set NODE_ENV=development echo $NODE_ENV, parcel gives all that nice messages of errors automatically but with webpack we need to set that up

  • NODE_ENV=production is 4 times faster than development

you can set up env variables in start script or dev script

"start":  "NODE_ENV=development parcel src/index.html",

Set 'scrict' mode

just let you use only new features, important to let old unsafe stuff phase out

import { StrictMode }from react

Wrap <App/> component in <StrictMode></StrictMode>

React Dev tools

React Router

  • Here we are doing v5
>>> npm install react-router-dom@5.2.0
# There is also a version for react-native so make sure you do specify -dom

See how react router matches its path React Router does partial matches. The URL /teachers/jem/young will match the paths /, /teachers, /teachers/jem and /teachers/jem/young. It will not match /young, /jem/young, or /teachers/young.


DownloadsWeekly Downloads






Unpacked Size

249 kB

Total Files


Last publish


  • atulit