Try Install Learn Blog API Packages GitHub
Posts

Getting Started Wednesday, April 17th, 2019

This is the first in the series introducing Mint and it's features.

Why use Mint?

The following list should provide a nice incentive ๐Ÿ™‚

  • Strongly typed, JavaScript like syntax
  • Immutable data structures and functional programming elements
  • HTML like syntax for HTML elements and components
  • Everything included:
    • routing
    • support for components
    • styling with CSS
    • standard library
    • data store (like Redux)
    • development server
    • formatter
    • environment variable handling
    • test runner
    • documentation server
    • JavaScript interoperability
    • Progressive Web Application support
  • Optimized output (minified, mangled)
  • Dead code elimination
  • A single binary which contains the whole toolchain
  • Uses React a Platform
  • and more awesome features...

Installation

Mint comes as a single binary file: mint. To install it please follow the instructions on the install page (basically download the binary and add it to the PATH).

Creating a new project

Once you have Mint installed you can create a new project with the mint init command:

mint init my-awesome-project

If successful you should see this:

Mint - Initializing a new project
โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”
โš™ Creating directory structure...
โš™ Writing initial files...

There are no dependencies!

There is nothing to do!
โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”
All done in 2.231ms!
This creates the following directory / file structure:
my-awesome-project
โ”œโ”€โ”€ source
โ”‚   โ””โ”€โ”€ Main.mint
โ”œโ”€โ”€ tests
โ”‚   โ””โ”€โ”€ Main.mint
โ”œโ”€โ”€ .gitignore
โ””โ”€โ”€ mint.json

Development server

Mint comes with a built-in development server which recompiles the code (and reloads the browser) when something changes, to start it go into the project directory and run the mint start command:

If successful you should see this:

Mint - Running the development server
โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”โ”
โš™ Ensuring dependencies... 181ฮผs
โš™ Parsing files... 2.608ms
โš™ Development server started on http://127.0.0.1:3000/

Now you can open the running project on http://127.0.0.1:3000/ or http://localhost:3000/

If the project is running you should see this:

Now you are up and running with a Mint project locally ๐ŸŽ‰

Online Playground

If you just want to mess around without installing, you can use the sandbox on the website.