Developers have evolved a long list of approaches to modules, testing, and above all, front-end frameworks to tackle maintainable JavaScript projects. But in 2020, standards including ES6 modules and custom elements provide most of what is needed. This repo demonstrates one such approach with vanilla JavaScript, supported in all modern browsers.
Of course, "best practices" never are, with new innovations and improvements constantly moving the target on what is "best". But having grown tired of framework opinionation and convention, this repo represents a simple and sensible approach from the perspective of reusable JavaScript for both browsers and NodeJS with minimal dependencies.
-
Clone the repo.
% git clone https://github.com/dannybrian/best-practices.git
-
Install dependencies. You might need root permissions.
% npm install -g local-web-server browserify uglify-es
% cd best-practices/; npm install
-
Run the tests.
% npm test
-
Build the app.
% npm run build
% npm run build-prod
-
Run the app.
% npm run serve
-
Explore the code:
tests/
- stubs for unit testssrc/index.js
- the entry-point for the build, containing importssrc/OurWidget.js
- the ES6 class for a component, imported byindex.js
web/index.html
- the HTMLweb/build.js
- the built JavaScriptweb/build.min.js
- the minified JavaScript