Mint 🌿 programmeringsspråket for å skrive enkeltsideapplikasjoner (SPA)

Innledning

Hei! I dag vil jeg fortelle deg historien Om Mint lang, veldig ung (men interessant) programmeringsspråk fokusert på å bygge SPA (enkelt side applikasjoner). Den har alle verktøyene du trenger for å skrive feilfrie, lett lesbare og vedlikeholdbare applikasjoner på rekordtid.

Imponert? Jeg også! La oss håndtere dette sammen… 😉

📝 Innhold

• Hva er Mint lang egentlig?
  • Hvorfor Ikke JavaScript?
  • Hvorfor Ikke Elm?
• Hvorfor Mynte?
• Myntverktøy & økosystem
  • Redigeringsutvidelser
  • CLI
  • Desentralisert pakkehåndtering
  • Ruting
  • CSS Styling
• Endelig resultat

Hva Er Mint lang egentlig?

Først Av Alt, Mint skrevet På Krystall:

et generelt, objektorientert programmeringsspråk med syntaks inspirert Av Språket Ruby Det er et kompilert språk med statisk typekontroll, men det er generelt unødvendig å angi variabeltyper eller metodeargumenter.

– Wiki

Følg deretter Offisiell Mint guide:

Mint Er et språk spesielt opprettet for å skrive enkeltsideapplikasjoner. Det er en kompilator og et rammeverk kombinert for å gi god utvikler erfaring samtidig som å skrive trygt, lesbar og vedlikeholdsbar kode.

ja, det er sant! Ser på denne koden (beklager koden utheving):

// 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> }}

Svært lik et strengt typifisert språk, men med inkludert JSX-stil, ikke sant?

Det ble født ut av frustrasjonen Til JavaScript language and ecosystem (NPM) og Elm-språket, og det er ikke så åpen utviklingspraksis.

OK! 👌 La oss bestemme med en gang: hvorfor Ikke JavaScript og hva som er galt Med Elm.

Hvorfor Ikke JavaScript?

JavaScript Er ikke et sterkt skrevet språk som gjør Det vanskelig å skrive feilfri kode og fører til ikke så stor utvikleropplevelse.

det har heller Ikke verktøyene for å lage webapplikasjoner ut av boksen, du trenger rammer og kompilatorer og bygge verktøy som øker kompleksiteten.

Hvorfor Ikke Elm?

Elm har stor utvikleropplevelse, Men Det er et rent funksjonelt språk som fører til noe standardkode og gjør det vanskeligere å lære.

det er heller Ikke mulig å bidra eller påvirke språket på noen meningsfull måte.

Hvorfor Mint lang? 🤔

Mint har som mål å kombinere utvikleropplevelsen Av Elm og Uttrykksevnen Til React for å skape det perfekte språket for å bygge enkeltsideapplikasjoner.

Etter ett års utvikling Har Mint følgende funksjoner:

1. et godt typesystem
2. Fine feilmeldinger
3. Formatter
4. Komponenter for komposisjon
5. Lagrer for datalagring
6. Innebygd styling
7. Innebygd ruting
8. Flott JavaScript interoperabilitet
9. uforanderlige datastrukturer

Mint tools & økosystem

jeg ville ikke snakke om dette programmeringsspråket hvis det ikke hadde et økosystem for å starte og utvikle. Så! 😎

redigeringsutvidelser

• VS — Kode — legger til syntaksutheving og autofullfør støtte
• Emacs-legger til syntaksutheving og automatisk formatering ved hjelp av mint — format
• IntelliJ IDEA — legger til syntaksutheving
• Atom — legger til syntaksutheving
• Vim-veldig minimal (men fungerende) syntaks/ftdetect combo

cli

installere 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 nå, se alle kommandoer av call Mint med --help flagg:

$ 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━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

Desentralisert pakkehåndtering

denne siden inneholder pakkene du kan bruke i prosjektene dine:

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

Ruting

Ruter for et program er definert på øverste nivå med routes – blokken. Husk følgende ting:

• Ruter matches i den rekkefølgen de er definert fra topp til bunn
• Ruter kan bare ha en ruter blokk per program
• Ruter brukes til å angi tilstanden, for ikke å gjengi 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 stiler defineres med en identifikator, og deretter brukes PÅ HTML ved hjelp av identifikatoren som EN CSS-klasse.

en stil kan inneholde en rekke CSS definisjoner, sub regler, media spørringer, if og case setninger.

Eksempelkode:

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

Endelig resultat

etter mint build har du Produksjonsklar Preact SPA. Det er det! 🎉

bilde av

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

P. s.