/es6-base-project

Base project to be used on ES6+ Projects

Primary LanguageJavaScript

es6 icon

GitHub Language Count GitHub Top Language GitHub Last Commit

Es6-base-project

Base project to be used on ES6+ Projects

Dev Stack:

My Skills

TECH LINK
Babel https://babeljs.io/
Jest https://jestjs.io/
Javascript https://developer.mozilla.org/en-US/docs/Web/JavaScript
VSCode https://code.visualstudio.com/
NPM https://www.npmjs.com/

Getting Started

git clone [this repo]
npm install

Front-End - Tailwind

image

Building Stuff

To build everything manually you can use npm run dev.

Running local webserver

npm server This brings up a local webserver from which you can view your changes in a browser.

Running tests and code coverage

npm test

Automatically Build & Refresh

npm dev For easily keep automatically building stuff.

Other packages suggestions:

  • Pm2
  • Gulp
  • Nodemon
  • Eslint

Manually Replicate the same Project (GCAS - GIT CLONE AVERSION SYNDROME)

mkdir es6plus
cd es6plus
npm init -y
git init
jest --init
  • create file ".babelrc":
"presets": ["@babel/preset-env"]
}
npm install i @babel/core @babel/cli @babel/preset-env --save-dev
  • node_modules/.bin/babel ./src/main.js -o ./public/bundle.js

  • node_modules/.bin/babel ./src/main.js -o ./public/bundle.js -w obs: to use npx -> node version > 5

  • npx babel ./src/main.js -o ./public/bundle.js -w

  • Scripts package.json:

"scripts": {
    "server": "http-server -o",
    "dev": "babel ./src/main.js -o ./public/bundle.js -w",
    "test": "jest --coverage",
    "test:watch": "jest --watch"
}
  • Execute Project and Tests:
npm run dev
npm test
  • create folder/file: public > index.html
  • create folder/file:criar pasta src > main.js