Mint programming programovací jazyk pro psaní jednostránkových aplikací (SPA)

Úvod

Dobrý den! 👋 Dnes, řeknu vám příběh o tom, Máty lang, velmi mladé (ale zajímavé) programovací jazyk zaměřený na budování SPA (single page aplikace). Má všechny nástroje, které potřebujete k psaní bezchybných, snadno čitelných a udržovatelných aplikací v rekordním čase.

dojem? Já taky! Pojďme se s tím vypořádat společně… 😉

Table obsah

• co je vlastně Mint lang?
  • proč ne JavaScript?
  • proč ne jilm?
• Proč Máta?
• Máta nástroje & ekosystém
  • Editor rozšíření
  • CLI
  • Decentralizovaná správa balíků
  • Routing
  • CSS Styl
• Konečný výsledek

Co je Máta lang vlastně?

nejprve mincovna napsaná na krystalu:

univerzální, objektově orientovaný programovací jazyk, jehož syntaxe je inspirována jazykem Ruby je sestaven jazyk, s statické typové kontroly, ale s uvedením typů proměnné nebo argumenty metody je obvykle nepotřebné.

další, postupujte podle oficiální Mint guide:

Mint je jazyk speciálně vytvořený pro psaní jednostránkových aplikací. Jedná se o kompilátor a rámec v kombinaci poskytnout skvělé zkušenosti pro vývojáře a zároveň umožňuje psát bezpečné, čitelné a udržovatelné kód.

Ano, Je to pravda! Zdá tento kód (omlouvám se za zvýraznění kódu):

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

Velmi podobné přísně typické jazyce, ale s přiloženým JSX-styl, ne?

narodil se z frustrace jazyka JavaScript a ekosystému (NPM) a jazyka Elm a není to tak otevřené vývojové postupy.

OK! 👌 Pojďme se rozhodnout hned: proč ne JavaScript a co je špatného na Elm.

proč ne JavaScript?

JavaScript není silně napsaný jazyk, který ztěžuje psaní bezchybného kódu a vede k ne tak velkému zážitku pro vývojáře.

také nemá nástroje pro vytváření webových aplikací po vybalení z krabice, potřebujete rámce a kompilátory a vytvářet nástroje, které zvyšují složitost.

proč ne jilm?

Elm má skvělé zkušenosti s vývojáři, ale je to čistě funkční jazyk, který vede k nějakému kódu boilerplate a ztěžuje učení.

také není možné nějakým smysluplným způsobem přispívat nebo ovlivňovat jazyk.

proč Mint lang? 🤔

Mint si klade za cíl spojit zkušenosti vývojářů z Elm a expresivitu React a vytvořit dokonalý jazyk pro vytváření jednostránkových aplikací.

po jednom roce vývoje má mincovna následující vlastnosti:

1. dobrý typ systému
2. Pěkný chybové zprávy
3. Formatter
4. Komponenty pro složení
5. Obchody pro ukládání dat
6. Vestavěný styl
7. Built-in směrování
8. Skvělý JavaScript interoperability
9. Neměnné datové struktury

Máta nástroje & ekosystém

já bych nemluvil o tento programovací jazyk, kdyby neměl ekosystému pro zahájení a rozvoj. Takže! 😎

Editor rozšíření

• VS Kód — přidává zvýraznění syntaxe a automatické dokončování podpora
• Emacs — přidává zvýrazňování syntaxe a automatického formátování pomocí máty formátu
• IntelliJ IDEA — přidává zvýraznění syntaxe
• Atom — přidává zvýraznění syntaxe
• Vim — velmi minimální (ale pracovní) syntaxe/ftdetect combo

CLI

Instalace Máta CLI přes příkaz:

# 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

A teď, vidět všechny příkazy, volání Máty s --help vlajky:

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

Decentralizovaná správa balíků

Tato stránka obsahuje balíčky, které můžete použít ve svých projektech:

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

Směrování

Trasy aplikace jsou definovány v horní úrovni s routes blok. Mějte na paměti následující věci:

• Trasy jsou porovnány v pořadí, v jakém jsou definovány shora dolů
• Trasy může mít pouze jednoho tras zablokovat na žádost
• Tras slouží k nastavení stavu, ne k vykreslení věci

Příklad kódu:

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 Styl

V Mint components, styly lze definovat jako identifikátor, pak se aplikuje na HTML pomocí identifikátoru jako CSS třídy.

styl může obsahovat libovolný počet definic CSS, dílčích pravidel, mediálních dotazů, if a case příkazů.

Příklad kódu:

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

Konečný výsledek

Po mint build, máte výroby připraven Preact SPA. To je ono! 🎉

Foto

Ben Kolde https://unsplash.com/photos/H29h6a8j8QM
Máta autorů https://www.mint-lang.com
Anthony Fomin https://unsplash.com/photos/Hr6dzqNLzhw

P. S.