Mint Page

1. Mint Hello

1.1. Intitialize a project:

$ mint-lang init hello
$ cd hello
$ mint-lang start

open http://localhost:3000

be sure you see: Hello Mint!

1.2. Main Code

Main.mint is where Mint starts - this is what is looks like:

code/mint/src/hello/source/Main.mint
component Main {
  style base {
    font-family: sans;
    font-weight: bold;
    font-size: 50px;

    justify-content: center;
    align-items: center;
    display: flex;
    height: 100vh;
    width: 100vw;
  }

  fun render : Html {
    <div::base>
      <{ "Hello Mint!" }>
    </div>
  }
}

  • style blocks allow css formatting - so the style base is the base css for the app.

  • <div::base> - attaches the css style of base to that html block

  • <{ }> - allows execution and then to String conversion for output in html blocks.

Mint Page