Support de présentation pour l'apprentissage du développement d'un blog avec Ruby on Rails

1. Je code mon blog
avec Ruby et Ruby on Rails

2. WIFI
SSID : OFAC_BUREAU1
Pwd : oFaC-wireless

3. Cédric Bousmanne (@akyrho)
Ruby on Rails developer depuis 2008
Freelance depuis 2010
● Pepper & Koffee (2008 - 2012)
● 2houses.com (fév. 2012 - mars 2014)
● Apptweak.com (depuis mars 2014)

4. Sondage d’opinion
Qui a déjà utilisé un langage de programmation
?
Si oui, le(s)quel(s) ?

5. Installation de Ruby
https://bitnami.com/stack/ruby/installer

6. Ruby vs. Ruby on Rails (RoR)
Langage de
programmation
interpreté, orienté
objet
Framework construit
sur Ruby

7. MVC
Modèle : traitement des données, interaction
BDD
Vue : Présente les résultats, recevoir les
actions de l’utilisateur
Contrôleur : Réception des événements,
enclenche les actions à effectuer

8. MVC par l’exemple
Je souhaite envoyer un commentaire
● La vue me présente un formulaire que je
rempli
● Le contrôleur réceptionne la requête
lorsque j’ai envoyé mon commentaire
● Le modèle valide les informations reçues
avant de les enregistrer

9. Philosophie de Ruby on Rails
DRY (Don’t Repeat Yourself)
Facilité par MVC et la métaprogrammation
Convention over configuration
Suivre les conventions plutôt que de les
préciser

10. Exemple de convention
Singulier vs. pluriel
Modèle : User
Controller : UsersController

11. Vérifier l’installation
cd C:/Bitnami/rubystack-2.0.0-20
use_ruby.bat
ruby -v
-> ruby 2.0.0p481

12. Editeur de texte
http://www.sublimetext.com/2

13. Créer un projet Rails
gem install rails # gem install <gem>
rails new blog # rails new <project>
cd blog

14. Architecture d’un projet rails
app
- assets
- controllers
- helpers
- mailers
- models
- views

15. Création du premier scafold
rails generate scaffold article title:string content:
text
invoke active_record
create db/migrate/20141009165133_create_articles.rb
create app/models/article.rb
invoke test_unit
create test/models/article_test.rb
create test/fixtures/articles.yml
invoke resource_route
route resources :articles
invoke scaffold_controller
create app/controllers/articles_controller.rb
(...)

16. Ce qu’il s’est passé
● Création d’une migration
● Création du modèle
● Création des routes
● Création du controlleur
● Création des vues
● Création des assets (js/css)
● Création des tests

17. Migration de la base de donnée
rake db:migrate
-- create_table(:articles)

18. Publier un article
http://localhost:3000/articles/new

19. Liste des articles
http://localhost:3000/articles

20. Les routes
fichier config/routes.rb
resources :articles
Prefix Verb URI Pattern Controller#Action
articles GET /articles articles#index
POST /articles articles#create
new_article GET /articles/new articles#new
edit_article GET /articles/:id/edit articles#edit
article GET /articles/:id articles#show
PUT /articles/:id articles#update
DELETE /articles/:id articles#destroy

21. Ajouter la route par défaut
config/routes.rb
resources :articles
root ‘articles#index’

22. Modifier l’index des articles
app/views/articles/index.html.erb
<% @articles.each do |article| %>
<%= render article %>
<% end %>
<%= link_to 'New Article', new_article_path %>
puis rafraîchir la page

23. Création du partiel
app/views/articles/_articles.html.erb
<section>
<h2><%= link_to article.title, article %></h2>
<%= article.content %>
</section>
<hr>

24. Un peu de style
app/assets/stylesheets/articles.css.scss
https://gist.githubusercontent.
com/cedricbousmanne/4b0a4bed2cb46a07a8fd/raw/cd8362e32e917c4648ed47b91870f91b6381e8b6
/articles.css.scss

25. Articles#show
app/views/articles/show.html.erb
<%= render @article %>
puis rafraîchir la page

26. Le layout
app/views/layouts/application.html.erb
<h1><%= link_to “My awesome blog”, root_path %></h1>
<%= yield %>
puis rafraîchir la page

27. Un peu d’ordre
app/models/article.rb
class Article < ActiveRecord::Base
default_scope { order(“created_at DESC”) }
end
puis rafraîchir la page

28. Valider la présence d’attributs
app/models/article.rb
class Article < ActiveRecord::Base
default_scope { order(“created_at DESC”) }
validates_presence_of :title
validates_presence_of :content
end
puis tenter d’ajouter un article sans titre et/ou sans contenu

29. Et après ?
● Déporter les actions create, destroy, update dans une
interface d’administration sécurisée
● Ajouter un système de commentaire
● Gérer la mise en page des articles
● Gérer l’ajout d’image/vidéo
● Implémenter un système de pagination
● Gestion multi-utilisateur
● Gestion d’état (en ligne/hors ligne)
● ...

30. Les gems
Rubygems est gestionnaire de paquets pour
ruby (~= plugins)
+/- 90,000 gems disponibles

31. Installation d’une gem
- En ligne de commande
$ gem install devise
- Via le Gemfile (recommandé)
Ajout d’une ligne dans le Gemfile
$ bundle install

32. Gems populaires
Devise Authentification / Gestion des
utilisateurs
Cancan Gestion des permissions
Kaminari Pagination
Capistrano Automatisation du déploiement
Carrierwave
Dragonfly
Upload / gestion d’image / fichier

33. Pour aller plus loin
● rubygems.org
● ruby-toolbox.com
● railscasts.com
● guides.rubyonrails.org

34. Des questions?
twitter : @akyrho
mail : cedric@studio-sept.be
Merci de votre participation !