[RUBY] Créer un site EC avec Rails5 ② ~ Paramètres Bootstrap4, définition du contrôleur / action ~

introduction

Il s'agit d'une suite de la série "Créer un site EC avec Rails 5 (1)" (https://qiita.com/GreenFingers_tk/items/71e2fa8f5d8b7333d75a), qui crée un site EC sur lequel vous pouvez faire vos achats dans une boulangerie fictive. Alignez le contrôleur et la vue requis, écrivez uniquement la définition de l'action et activez la transition de page minimale.

Code source

https://github.com/Sn16799/bakeryFUMIZUKI

Controller Créez un contrôleur à la fois. Les actions qui accompagnent également View sont créées ensemble ici.

Site client

$ rails g devise:controllers admins
$ rails g devise:controllers customers
$ rails g controller addresses edit index
$ rails g controller cart_items index
$ rails g controller customers edit show withdraw
$ rails g controller genres index show
$ rails g controller homes about top
$ rails g controller order_items index
$ rails g controller orders confirm index new show thanks
$ rails g controller products index show

Site d'administration

$ rails g controller admins::customers edit index show
$ rails g controller admins::genres edit index
$ rails g controller admins::homes top
$ rails g controller admins::order_items
$ rails g controller admins::orders index show
$ rails g controller admins::products edit index new show
$ rails g controller admins::searches search

action

Écrivez des actions sans vue dans le fichier Controller. J'écrirai les détails plus tard, donc pour l'instant, je donnerai la priorité à la définition des actions et des transitions de page.

Site client

app/controllers/addresses_controller.rb

  def create
  end

  def update
  end

  def destroy
  end

app/controllers/cart_items_controller.rb

  def create
  end

  def update
  end

  def destroy
  end

  def destroy_all
  end

app/controllers/customers_controller.rb

  def udpate
  end

  def withdraw_done
  end

app/controllers/order_items_controller.rb

  def new
  end

app/controllers/orders_controller.rb

  def create
  end

Site d'administration

app/controllers/admins/customers_controller.rb

  def update
  end

app/controllers/admins/genres_controller.rb

  def create
  end

  def update
  end

app/controllers/admins/order_items_controller.rb

  def update
  end

app/controllers/admins/orders_controller.rb

  def update
  end

app/controllers/admins/products_controller.rb

  def create
  end

  def update
  end

Chargement de Bootstrap4

J'omettrai l'installation de gem (bootstrap, jquery-rails) parce que je l'ai fait précédent.

Renommez ** app / assets / stylesheets / application.css ** en ** application.scss **. Décrivez le chargement de Bootstrap dans ce fichier.

appseets/stylesheets/application.scss

@import 'bootstrap';

Faites la même description dans le fichier javascript.

app/assets/javascripts/application.js

//= require rails-ujs
//= require activestorage
--------------------------------
//= require jquery3
//= require popper             　　 #Ajouter ici
//= require bootstrap-sprockets
--------------------------------
//= require_tree .

Vous pouvez maintenant utiliser Bootstrap. Essayons-le dans un endroit approprié.

html:app/views/homes/top.html.erb

<h1>Homes#top</h1>
<p>Find me in app/views/homes/top.html.erb</p>

<%= link_to 'ABOUT', homes_about_path, class: 'btn btn-info' %>

localhost:3000/homes/top

La page s'affichait correctement et le lien intitulé «À PROPOS» est devenu un bouton! Bootstrap est correctement appliqué. Je n'ai pas encore défini de cadre tel que le conteneur, donc je suis terriblement proche de la fin dans son ensemble. Je vais le réparer plus tard, mais pour l'instant je m'en fiche.

Postscript

Depuis que j'ai créé Routage et Contrôleur pour le moment, je peux afficher toutes les pages nécessaires. Dès le prochain article, il semble que nous nous mettrons dans l'implémentation de fonctions spécifiques. Au fait, je me demande toujours à quoi ressemblera la conception de la page. En gros, je prévois de le concevoir pour une réactivité basée sur Bootstrap, mais je pense que ce n'est pas mal d'essayer le CSS à la mode ... Même maintenant, ** «L'image chaleureuse d'une boulangerie» et «Élégant site moderne» ne sont pas du tout liés, et je sens que j'ai fait une erreur en choisissant le thème **, mais j'ai déjà le matériel photo sous la main. Je procéderai tel quel. Est-il possible de terminer le site Web sans aucune gêne? Continuez vers La prochaine fois!