Files
blog-nationtech/articles/non-trivial-tuto-leptos/texte-fr.md

4.1 KiB

On est tellement fan de rust qu'on a même fait notre site web avec!

À NationTech, on est des vrai fan de rust!

On sait que c'est pas l'avis de tous... même que des fois il

On reste quand même pragmatique, et c'est pour ça qu'on y a bien réfléchi avant d'en faire le language principal de Harmony. Performance, stabilité, sécurité et un language en plein essor qui a fait déjà ses preuves (voir les bénéfices observés de l'usage de rust dans le kernel linux et l'effet de l'usage de rust à l'interne de google).

Alors, pour Harmony, un outil de gestion de Datacenters auto-hébergés, pour nous le choix était évident: Rust! Mais pour notre page web... Rust?

Dans le cas d'un site web, rust c'est un peu un ovni. N'empêche que leptos semblait très impressionnant. Alors, on l'a essayé et voici le résultat de quelques-unes de nos expériences.

Spoiler, on l'a adopté! Alors, si vous avez des commentaires ou des retours d'expérience, n'hésitez pas à venir nous les partager sur Discord.

Pour la section tutoriel (href) n'hésitez pas à consulter aussi le repo git (url)

La douce mélodie de Leptos

Un ovni qui rock (émoji d'alien et de musique)

[a recours aux approche les plus innovantes]

full-stack development with server-side rendering (SSR), hydration, and isomorphic server functions, allowing seamless integration of frontend and backend logic in Rust. This simplifies architecture and reduces the need for separate APIs.

CSR (client) vs SSR (server)

Web typé sans les joies (émoji rire) de TypeScript

On se sent bien, on se sent chez soi!

tuto sur ce qu'est leptos. Pourquoi c'est intéressant et comment ça marche.

Performance, promesse de Rust tenue par Leptos

" fine-grained reactivity, enabling high performance by updating only the exact parts of the DOM that change—often outperforming React, Svelte, and Vue in benchmarks. It eliminates the need for a virtual DOM, reducing overhead and improving speed."

Utilisez vore logique métier

Leptos en allegro

Maintenant, passons aux choses sérieuses et construisons un blog multilinque qui complémentera notre site web.

Fonctionnalités:

  • Définition de la structure des donnée des sections avec les struct rust
  • conversion bidirectionnelle entre markdown et le format fluent (.ftl) pour la traduction
  • une architecture ports et adapteurs avec des fonctionnalités de coeurs utilisables par un cli et par le site web
  • sections et pages
  • quelques routes pour la démo

et voilà!

Ce sera vite, ce sera joyeux: allegro!

Avant toute chose, un peu de boilerplate

# installe rust

# installe lib pour wasm
rustup target add wasm32-unknown-unknown

rustup, c'est...

cargo, c'est ...

trunk, c'est ...

On définit les structs

On définit les sections

Le style dès maintenant parce qu'on va pas au bal tout nu

Voilà notre première page (émoji de note de musique)

On traduit parce qu'on vise le marché international

On ajoute un core et un cli juste pour la démo

Pour ceux qui aiment les clis, on ne vous a pas oublié. Ici, on va ajouter un petit outil en support de la traduction.

On peut maintenant servir tous nos articles

Génération d'index.

Ajout des routes.

Conclusion

Deviez-vous changer de framework web pour leptos? Ça c'est vore affaire, on viendra pas vous dire quoi faire.

Mais nous, on s'amuse bien avec leptos. Ça nous rend heureux de pouvoir recycler nos skills et no tricks de rust un peu partout, alors pourquoi pas sur le web?

Venez en discuter sur le discord de NationTech. Et funky codage! (emoji de musique)