Mint Kurt programmeringssproget til at skrive enkelt side applikationer (SPA)

introduktion

Hej! I dag vil jeg fortælle dig historien om Mint lang, meget ung (men interessant) programmeringssprog fokuseret på at opbygge SPA (enkelt side applikationer). Det har alle værktøjer, du har brug for til at skrive fejlfri, letlæselige og vedligeholdelige applikationer på rekordtid.

imponeret? Også mig! Lad os håndtere dette sammen… Ret

ret Indholdsfortegnelse

• hvad er Mint lang faktisk?
  • hvorfor ikke JavaScript?
  • hvorfor ikke Elm?
• Hvorfor Mynte?
• Mint tools & ecosystem
  • Redigeringsudvidelser
  • CLI
  • decentraliseret pakkehåndtering
  • Routing
  • CSS Styling
• endeligt resultat

hvad er Mint lang faktisk?

først og fremmest Mint skrevet på Krystal:

et generelt formål, objektorienteret programmeringssprog med syntaks inspireret af sproget Ruby det er et kompileret sprog med statisk typekontrol, men det er generelt unødvendigt at specificere typerne af variabler eller metodeargumenter.

— Viki

næste, følg officielle Mint guide:

Mint er et sprog, der er specielt oprettet til at skrive applikationer på en side. Det er en kompilator og en ramme kombineret for at give stor udvikleroplevelse, samtidig med at man kan skrive sikker, læsbar og vedligeholdelig kode.

Ja, det er sandt! Ser til denne kode (undskyld for koden fremhævning):

// src/App.mintcomponent Counter { state counter : Number = 0 fun increment : Promise(Never, Void) { next { counter = counter + 1 } } fun decrement : Promise(Never, Void) { next { counter = counter - 1 } } fun render : Html { <div> <button onClick={decrement}> "Decrement" </button> <span> <{ Number.toString(counter) }> </span> <button onClick={increment}> "Increment" </button> </div> }}

meget ligner et strengt typificeret sprog, men med inkluderet JS-stil, ikke?

det blev født ud af frustrationen af JavaScript-sproget og økosystemet (NPM) og Elm-sproget, og det er ikke så åben udviklingspraksis.

okay! Lad os beslutte med det samme: hvorfor ikke JavaScript og hvad er der galt med Elm.

hvorfor ikke JavaScript?

JavaScript er ikke et stærkt skrevet sprog, der gør det vanskeligt at skrive fejlfri kode og fører til ikke så stor udvikleroplevelse.

det har heller ikke værktøjerne til at oprette internetapplikationer ud af boksen, du har brug for rammer og kompilatorer og bygger værktøjer, der øger kompleksiteten.

hvorfor ikke Elm?

Elm har stor udvikler erfaring, men det er et rent funktionelt sprog fører til nogle standardtekst kode og gør det sværere at lære.

det er heller ikke muligt at bidrage eller påvirke sproget på nogen meningsfuld måde.

hvorfor Mint lang? 🤔

Mint sigter mod at kombinere udvikleroplevelsen af Elm og React ‘ s udtryksevne for at skabe det perfekte sprog til opbygning af applikationer på en side.

efter et års udvikling har Mint følgende funktioner:

1. en god type system
2. Nice fejlmeddelelser
3. formaterer
4. komponenter til sammensætning
5. butikker til datalagring
6. indbygget styling
7. indbygget routing
8. fantastisk JavaScript interoperabilitet
9. uforanderlige datastrukturer

Mint tools & ecosystem

jeg ville ikke tale om dette programmeringssprog, hvis det ikke havde et økosystem til start og udvikling. Så!

Editor udvidelser

• VS kode — tilføjer syntaksfremhævning og autofuldførelse støtte
• Emacs — tilføjer syntaksfremhævning og auto-formatering ved hjælp af mint format
• IntelliJ IDEA — tilføjer syntaksfremhævning
• Atom — tilføjer syntaksfremhævning
• Vim — meget minimal (men arbejder) syntaks/ftdetect combo

cli

installation af Mint CLI via kommando:

# For macOS:$ brew tap homebrew-community/alpha$ brew install mint-lang# For Linux:$ wget --no-verbose -O mint https://mint-lang.s3-eu-west-1.amazonaws.com/mint-latest-linux$ chmod +x ./mint$ sudo mv ./mint /usr/local/bin/mint

og nu, se alle kommandoer af call Mint med --help flag:

$ mint --helpMint - Help━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━Usage: mint MintFlags: --env, -e (default: "") # Loads the given .env file --help # Displays help for the current command.Subcommands: build # Builds the project for production docs # Starts the documentation server format # Formats source files init # Initializes a new project install # Installs dependencies loc # Counts Lines of Code start # Starts the development server test # Runs the tests version # Shows version━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

decentraliseret pakkehåndtering

denne side indeholder de pakker, du kan bruge i dine projekter:

• https://www.mint-lang.com/packages

Routing

ruter for en applikation er defineret på øverste niveau med routes – blokken. Husk følgende ting:

• ruter Matches i den rækkefølge, de er defineret fra top til bund
• ruter kan kun have en ruteblok pr. applikation
• ruter bruges til at indstille tilstanden, ikke til at gengive ting

eksempelkode:

routes { / { Application.setPage("index") } /users/:id (id: Number) { sequence { Application.setPage("show") Application.loadUser(id) } } /blog { Application.setPage("blog") } /blog/:slug (slug: String) { sequence { Application.setPage("post") Application.loadPost(slug) } }}

CSS Styling

i Mint-komponenter kan stilarter defineres med en identifikator og derefter anvendes på HTML ved hjælp af identifikatoren som en CSS-klasse.

en typografi kan indeholde et vilkårligt antal CSS-definitioner, underregler, medieforespørgsler, if og case udsagn.

eksempelkode:

component Main { style button { background: red; color: white; border: 0; } fun render : Html { <button::button> "Click ME!" </button> }}

slutresultat

efter mint build har du produktionsklar Preact SPA. Sådan! Venstre

foto af

Ben Kolde https://unsplash.com/photos/H29h6a8j8QM
Mint forfattere https://www.mint-lang.com
Anthony Fomin https://unsplash.com/photos/Hr6dzqNLzhw

P. S.