Front-End Web Starter Pack

This is my bootstrap for building modern web applications. Formulated purely based on personal needs. But if it suits you, feel free to use it.

In this project I minimized the use of frameworks, either CSS or JavaScript. But I use many tools to make development easier. Here are the details.

Tools Stack

Module Bundler: I use webpack 4 for bundling a module. I used some extra loader and plugin to supports SCSS, TypeScript, and Progressive Web Apps.
UI Components: I like Web Component, especially because it is a native API. So I decided to include LitElement.
Testing: I use Jest for testing framework. I've integrated Jest with Puppeteer so that it can be used to test the front end. I also used @open-wc/testing and jest-environment-jsdom-sixteen to help test Web Component.
Linting: My code style based on AirBnB style. I use ESLint for linting.

To use this starter pack is quite easy. Download or Clone this repository. Then run the command npm run install. Start coding!

npm run start-dev for running a project in development mode.
npm run start-dev-sw same as above, but with Service Worker (work offline capability).
npm run build-local building a project in production mode with BundleWebpackAnalyzer.
npm run build build a project in production mode with test validation.
npm run test running test.

Name		Name	Last commit message	Last commit date
Latest commit History 19 Commits
__e2e__		__e2e__
__mocks__		__mocks__
__test__		__test__
src		src
.eslintrc.json		.eslintrc.json
.gitignore		.gitignore
README.md		README.md
babel.config.js		babel.config.js
declaration.d.ts		declaration.d.ts
jest-puppeteer.config.js		jest-puppeteer.config.js
jest.config.js		jest.config.js
package.json		package.json
tsconfig.json		tsconfig.json
webpack.common.js		webpack.common.js
webpack.dev.js		webpack.dev.js
webpack.dev.sw.js		webpack.dev.sw.js
webpack.prod.analyzer.js		webpack.prod.analyzer.js
webpack.prod.js		webpack.prod.js