monodrom

Javascript web application development and distribution framework.

The goal of this project is to provide comfortable and continuous development and distribution environment to javascript developers.

Documentation is not complete.

Main Features

The features listed below and many other small ones are configurable. We choosed each one according to the best practices in its area.

⭐️ Ease development environment

Source and build directories are separate from each other. Monodrom spawns a simple node.js server and opens a Chrome instance independent from your browser as you start developing. The browser tab automatically refreshes itself as you make changes in the source thanks to programmable Chromium software and puppeteer package.

⭐️ New in every build with hashed assets

Each file in the build contains a hash logo.93243ce98643.png in its filename which computed based on its content. That way you can extend caching lifetime of your assets such as Cache-Control: max-age=315360000 or Cache-Control: immutable.

⭐️ Optimized and Performant CSS with PostCSS and CSS Modules

Both javascript and CSS had a lot of new features over the last years. Modern javascript developers even tried to apply stylesheets over javascript which is called css-in-js. Although the technique looks promising, CSS already has great tools built by older communities which gives you greater abilities while styling your app. That's why CSS processors such as PostCSS, CSS Modules and Autoprefixer preferred.

⭐️ Javascript code compiling and bundling

Monodrom uses babel to compile your javascript code and to add necessary polyfills. After compiling, rollup.js used to create a bundle.

⭐️ Use FrondJS frontend framework

We use frondjs in all of our javascript based web apps and integrated it to monodrom. While you can use any type of frontend framework in monodrom some features may be unavailable if you choose something other than frondjs.

⭐️ Server side rendering (SSR)

Leverage search engine optimization, social media integration and rendering performance. Static html pages (and proper meta tags) automatically generated upon build.

⭐️ Automated Versioning and Changelog

Monodrom supports semver and calver versioning schemes. You just specify which one you would like to use upon project creation and versioning, changelogs, release emails will be handled automatically.

⭐️ Automated Lighthouse Tests

In each release, Monodrom runs Lighthouse audit and puts scores inside the release email.

⭐️ Unlimited Deployment Options

The build created by Monodrom is just a bunch of static files. You can put them to any server that is capable of serving static web files. You can also bootstrap your own monodrom server and automate the deployment process.

Use

1. Install with npm:

npm i -g monodrom

2. Create a GIT repository and clone it into your computer.

3. Get available commands:

> monodrom --help

Usage: monodrom <command> [options]

Commands:
  monodrom bootstrap-server   Installs and configures a monodrom server.
  monodrom bootstrap-project  Setup monodrom project.
  monodrom create             Creates a new project.
  monodrom code               Launches a simple dev server and a browser window
                              and roll the updates as you code.
  monodrom build              Generates a new build.
  monodrom localize           Generates translation files.
  monodrom test               Run tests.
  monodrom commit             Commits the codebase into the remote repository.
  monodrom deploy             Deploys to a server
  monodrom deliver            Build, test and deploy to a server.

Options:
  --help         Show help                                             [boolean]
  -v, --version  Shows the monodrom version.                           [boolean]