Customiser son template rails

Rails arrive avec beaucoup de choses dans la boite mais vous voulez peut-être changer quelques options par défaut Voici quelques unes de mes modifications.

Hypothèses

Les essentiels

SASS

Run

  ./bin/bundle add dartsass-rails
  ./bin/rails dartsass:install

Tailwind CSS

Run

  ./bin/bundle add tailwindcss-rails
  ./bin/rails tailwindcss:install

warning : a faire avant de mettre haml et d’effacer application.html.erb

Redis pour Turbo

Turbo est maintenant configuré de base dans une app Rails 7.
Si vous voulez découvrir : Turbo
Vous pouvez utiliser Redis pour TurboStream, qui utilise ActionCable. (le Pourquoi : Turbo-Rails)

run rails turbo:install:redis

Il faut alors aussi lancer Redis avec votre Procfile

  # Procfile.dev
  redis: redis-server /usr/local/etc/redis.conf

J’assume que vous avez déjà Redis installé. Sinon c’est ici

HAML à la place de ERB

Ajouter le gem haml à votre gemfile

  ./bin/bundle add haml-rails

les fichiers en .html.haml sont automatiquement reconnus et transcrit

ViewComponent

  ./bin/bundle add view_component

et pour creer vos component

  ./bin/rails generate component MyComponent --stimulus --sidecar

personnellement j’utilise ces deux options pour :

il faut penser a modifier config/tailwind.config.js pour prendre en compte les view dans les components

  module.exports = {
    content: [
      './app/helpers/**/*.rb',
      './app/javascript/**/*.js',
      './app/views/**/*',
      './app/components/**/*'
    ],

Ajouter des librairies javascript

rails 7 vient avec le nouveau concept d’importmap pour remplacer les differents webpack, rollup et autres. toutes les explications ici : (https://github.com/rails/importmap-rails) c’est un changement radical dans la gestion de vos packages. si comme moi vous n’êtes pas un spécialiste, c’est beaucoup beaucoup beaucoup moins de travail pour configurer une app optimisée. pour resumer, vous voulez par exemple ajouter swiper.js pour faire de beaux carousels et l’initialiser dans un controller stimulus

  ./bin/importmap pin swiper

va ajouter swiper dans votre importmap des que vous en avez besoin dans votre controller ou votre js

  import Swiper from "swiper"

et voila le tour est joué. pas besoin de babel, uglify et autre.

attention,

  1. le package doit être ESM

  2. le browser en face doit etre compatible ESM

###Sidekiq ajouter sidekiq a votre gemfile

  ./bin/bundle add sidekiq

Il y a deux façons de créer des jobs

  1. A la sidekiq
  rails generate sidekiq:job hard

le getting started (https://github.com/mperham/sidekiq/wiki/Getting-Started)

  1. A la action job
  ./bin/rails generate job mon_job

il faut alors penser a configurer le backend en ajoutant

  # config/application.rb`
  config.active_job.queue_adapter = :sidekiq

le détail ici : (https://github.com/mperham/sidekiq/wiki/Active-Job) L’avantage pour moi est la possibilité d’utiliser le Global ID. On peut alors passer des objets en argument alors qu’on est limité à des chaines de caracteres dans la version sidekiq.

Dans tous les cas il faudra lancer sidekiq dans votre procfile en y ajoutant quelque chose du genre

  # Procfile.dev
  sidekiq: RAILS_MAX_THREADS=3 bundle exec sidekiq

Les Bonus

Kredis

décocher le gem dans votre fichier Gemfile

  ./bin/bundle add kredis
  ./bin/bundle install
  ./bin/rails kredis:install

(https://github.com/rails/kredis)

Rubocop

(https://github.com/rubocop/rubocop) Le fond c’est d’avoir une app qui fonctionne, la forme c’est qu’elle soit ‘maintenable’ et ‘performante’.
Rubocop réalise une analyse statique de votre code en accord avec les règles de style Ruby et Rails (et plus).
D’ailleurs si vous programmez en Ruby, je vous conseille de lire (https://rubystyle.guide/)
C’est une mine d’information.

FriendlyId

(https://github.com/norman/friendly_id) Si vous voulez des liens qui soient compréhensibles par le commun des mortels et pas des users/230984/dashboard/13480-fajlsed9.
Alors ce gem est pour vous.

StimulusReflex

ViewComponentReflex

Templates

DaisyUI

(https://daisyui.com/)
C’est une librairie CSS de composants basée sur tailwindcss. C’en est d’ailleurs un plugin.
Pour l’instant (le 28/02/2022) si vous avez fait le choix des importmap dans Rails 7 et de tailwind, comme décrit plus haut, vous ne pourrez pas customiser votre config tailwind avec d’autres plugins venant de npm. Il faut faire une installation classique avec transpiler / compiler qui va associer le tout :(. Cela veut dire installer webpack ou vite…
L’idéal (pour moi) serait donc de reconstruire une librairie de composants sous forme de ViewComponent. (affaire à suivre)

Tailwind UI Kit

(https://www.tailwind-kit.com/) Autre librairie de composants.
C’est du pur tailwind / html. Vous allez sur le site et vous copiez/collez le composant qui vous plait. Pas de problème d’importmap ici.

(https://hackernoon.com/a-template-for-starting-new-projects-on-ruby-on-rails-t66c36iz)