Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Elixir, remède fonctionnel pour le développement web

Elixir, remède fonctionnel pour le développement web

Présentation du langage, des configurations et des outils utilisés chez Mirego pour nos projets Web dans le cadre de la première édition de CABANE.io.

Guillaume Cauchon

January 19, 2019
Tweet

More Decks by Guillaume Cauchon

Other Decks in Programming

Transcript

  1. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB Avant de commencer

    ... 2 Guillaume Cauchon @gcauchon • Développeur chez Mirego • Fondateur de À la garderie • OpenCode • Web à Québec • Meetup Elixir, Montréal Expériences passées
  2. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 3 Agenda .

    Beaucoup de contenu, 40 minutes 1 Elixir, le language P 4 2 iex > shell interactif P 10 3 Configurations d’un projet web P 13 4 GraphQL P 18 5 Web Sockets P 22 6 OTP P 23 7 Tests P 25 8 Déploiement P 26
  3. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB Language iex Configuration

    GraphQL Web Socket OTP Tests Déploiement “Elixir is a dynamic, functional language designed for building scalable and maintainable applications.” Elixir . 4 • Syntaxe verbale et opinionated inspirée de ruby. • Concepts d’extensibilité (protocol, behaviour) inspirés, entre autre, de Clojure. • Code compilé en byte code pour BEAM, la VM Erlang. • OTP, des outils facilitant le développement d’application web distribuée.
  4. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB Language iex Configuration

    GraphQL Web Socket OTP Tests Déploiement “Elixir is a dynamic, functional language designed for building scalable and maintainable applications.” Elixir . 5 • Fonctions pures. • Structures immuables. • Flow de donnée naturel avec l’opérateur pipe : |> • Pattern matching et guards : simplifier les code paths. • mix, one tool to rule them all ◦ dépendances, build, test, release, etc… • iex, un shell interactif (ie REPL).
  5. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 6 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement Elixir .
  6. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 7 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement Elixir . Elixir Conf 2018, opening keynote by José Valim “If we need a major version to change the language then we failed to build an extensible language!” https://youtu.be/suOzNeMJXl0 Elixir: A Mini-Documentary by Honeypot Get ready to explore the origins of the Elixir programming language, the manner in which it handles concurrency and the speed with which it has grown since its creation back in 2011. https://youtu.be/lxYFOM3UJzo
  7. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 8 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement Elixir . Elixir Forum Oui; un forum en 2019! Et fort probablement une des meilleure source d’information sur le langage, la communauté et les projets qui s’y développent. https://elixirforum.com Elixir School Elixir School is the premier destination for people looking to learn and master the Elixir programming language. https://elixirschool.com Conférences Toutes les conférences principales sont disponibles sur YouTube; habituellement en moins d’une semaine! • Elixir Conf - https://elixirconf.com • Code Sync - https://codesync.global/conferences • Lonestar Elixir - https://lonestarelixir.com • Empex - http://empex.co • etc…
  8. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 9 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement Elixir . Accent, open-source le 5 avril 2018 par Simon Prévost Le premier outil de traduction pensé par/pour les développeurs. https://www.accent.reviews https://github.com/mirego/accent Donner l’exemple
  9. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB Language iex Configuration

    GraphQL Web Socket OTP Tests Déploiement iex . 10 Interactive Elixir est un REPL qui permet de développer de façon interactive et itérative, sans avoir à redémarrer votre serveur. * * sauf si vous changez les configurations.
  10. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 11 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement iex . Fonctionnalités • Autocomplete • Helpers ◦ h - documentation d’un module, d’une fonction ◦ i - documentation d’un type de donnée (ie struct) ◦ r - compilation et swap en mémoire du module ◦ t - documentation des types définis dans un module Il est simple et utile d’utiliser iex dans une release OTP, déployée sur la PAAS de votre choix; plus de détails plus tard…
  11. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 12 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement iex .
  12. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB Language iex Configuration

    GraphQL Web Socket OTP Tests Déploiement Configuration . 13 Les configurations d’un projet sont contenus dans 3 fichiers : 1.mix.exs (et son lock file) 2.config/config.exs 3.config/$MIX_ENV.exs À l’image de ruby et rails, elixir profite d’un écosystème de librairies en forte expansion avec l’adoption du langage.
  13. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 14 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement Configuration . • Phoenix → framework web • Ecto → Repo, Schema, Changeset et Query • Absinthe → client GraphQL+++ • OTP: processes, GenServer, Agent, Task, etc… • Distillery → release OTP standalone
  14. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 15 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement Configuration . > git clone https://github.com/gcauchon/cabane.io__web_remedy > cd cabane.io__web_remedy > cp .env.dev .env … > docker-compose up -d postgresql > mix deps.get … > mix phx.server [info] Running RemedyWeb.Endpoint with cowboy 2.6.1 at http://localhost:5000
  15. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 16 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement Configuration . Makefile Des workflows clairs et documentés pour le développement, les tests et le déploiement. Un outils qui simplifie grandement le onboarding, la maintenance et la pérennité du codebase. Bonus!
  16. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB Language iex Configuration

    GraphQL Web Socket OTP Tests Déploiement Configuration . 17 Un objectif de notre équipe pour 2019 est de rendre open-source plusieurs projets boilerplates pour phoenix, ember et react! Leak!
  17. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB Language iex Configuration

    GraphQL Web Socket OTP Tests Déploiement GraphQL . 18 • Séparation des concerns entre le transport et les données • Schema typé et validé par l’engin à l’entrée et la sortie • Découplement entre l’api et les modèles de persistance ◦ Lecture → query / Écriture → mutation • Résolution du graph : ◦ Chaque field est résolu de façon unitaire ◦ Orchestration de plusieurs contextes • Payload malléable qui s’adapte aux besoins du client • Documentation: 1st class citizen A query language for your API
  18. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 19 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement GraphQL . Absinthe permet même d’inclure GraphiQL, un IDE in-browser pour GraphQL, directement dans votre environnement de développement! • Auto-complete • Documentation (queries, mutations, types, etc…) • Partage
  19. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 20 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement GraphQL . Pas de magie, les fonctions utilisées pour résoudre les fields peuvent être utilisées directement dans iex, aussi simplement que celle du contexte : iex(1)> alias Remedy.Account Remedy.Account iex(2)> Account.find("3865005d-abe1-4998-a61d-87a4b73c06ff") %Remedy.Account.Presenter{ __meta__: #Ecto.Schema.Metadata<:loaded, "presenters">, company: "Mirego", handle: nil, id: "3865005d-abe1-4998-a61d-87a4b73c06ff", inserted_at: ~N[2019-01-18 05:43:37], name: "Guillaume Cauchon", title: "ELIXIR, REMÈDE FONCTIONNEL AU WEB", updated_at: ~N[2019-01-18 05:43:37] }
  20. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 21 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement GraphQL . La fonction responsable de résoudre le field : iex(1)> alias Remedy.GraphQL.Resolvers Remedy.GraphQL.Resolvers iex(2)> Resolvers.Account.presenters(nil, %{id: "3865005d-abe1-4998-a61d-87a4b73c06ff"}, nil) {:ok, %Remedy.Account.Presenter{ __meta__: #Ecto.Schema.Metadata<:loaded, "presenters">, company: "Mirego", handle: nil, id: "3865005d-abe1-4998-a61d-87a4b73c06ff", inserted_at: ~N[2019-01-18 05:43:37], name: "Guillaume Cauchon", title: "ELIXIR, REMÈDE FONCTIONNEL AU WEB", updated_at: ~N[2019-01-18 05:43:37] }}
  21. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB Language iex Configuration

    GraphQL Web Socket OTP Tests Déploiement Web Socket . 22 • 1st-class citizen dans Phoenix. • Utilisé en développement pour le live-reload des assets dans le browser. • Utilisé dans GraphQL pour les requêtes de type subscribe. • Phoenix.Presence, un data-store distribué qui permet de stocker du metadata sur le socket. aka Channels
  22. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB Language iex Configuration

    GraphQL Web Socket OTP Tests Déploiement OTP . 23 OTP stands for Open Telecom Platform, although it’s not that much about telecom anymore (…) If half of Erlang’s greatness comes from its concurrency and distribution and the other half comes from its error handling capabilities, then the OTP framework is the third half of it. Fred Hébert, https://learnyousomeerlang.com/what-is-otp Survol
  23. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 24 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement OTP . • Process + Supervision • GenServer ◦ Agent ◦ Task • ETS - Erlang Term Storage
  24. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB Language iex Configuration

    GraphQL Web Socket OTP Tests Déploiement Tests . 25 • Fonctions pures et données immuable, donc les tests sont extrêment simple et légers. • mix test --stale • ExMachina (ex_machina) • @behaviour + Mox (mox) ◦ Simuler une librairie tierce en quelques lignes. • Coveralls (excoveralls) ◦ mix coveralls.details présente un diff des code paths couverts et manqués par les tests! Survol
  25. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB Language iex Configuration

    GraphQL Web Socket OTP Tests Déploiement Déploiement . 26 • Une release OTP est platform specific. • Principes Twelve-Factor App. ◦ Configuration basée sur les variables d’environnement ◦ Même image en, QA, Staging et Production • Multi-stage build avec Docker ◦ Build sur une image elixir basée sur Alpine Linux. ◦ Copier la release OTP sur une image Alpine Linux.
  26. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 27 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement Déploiement . > make build […] Successfully tagged remedy:latest > docker tag remedy registry.heroku.com/elixir-web-remedy/web > docker push registry.heroku.com/elixir-web-remedy/web […] 7dde40161858: Pushed 26fcbb90328a: Pushed […] latest: digest: sha256:d50b1c0010… size: 1784 > heroku container:release web --app elixir-web-remedy Releasing images web to elixir-web-remedy... done
  27. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 28 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement Déploiement . Live sur Heroku en quelques secondes!
  28. ELIXIR, REMÈDE FONCTIONNEL POUR LE DÉVELOPPEMENT WEB 29 Language iex

    Configuration GraphQL Web Socket OTP Tests Déploiement Déploiement . Et en plus, on peut utiliser iex sur les containers!