[RUBY] Implementieren Sie die Produktkategoriefunktion mit Abstammung ① (Vorbereitung)

Einführung

・ Ich habe eine Frima-App durch Teamentwicklung einer bestimmten Programmierschule erstellt.

• Da es sehr schwierig war, die Produktkategoriefunktion zu implementieren, werde ich sie als Memorandum schreiben. ・ Da ich viel zu tun habe, werde ich es mehrmals schreiben. ・ Ich bin sehr zuversichtlich. Ich hoffe, dass es für Anfänger in der gleichen Situation hilfreich ist, also schreibe ich es als Artikel. ・ Ich würde mich freuen, wenn Sie auf Fehler hinweisen könnten.

Dies ist das ausgefüllte Formular

• Wenn Sie eine übergeordnete Kategorie auswählen, wird die untergeordnete Kategorie angezeigt. Wenn Sie eine untergeordnete Kategorie auswählen, wird die Enkelkategorie angezeigt. Bei größenbezogenen Elementen wird bei Auswahl der Enkelkategorie die Größe angezeigt. https://gyazo.com/97e3bdfac114bcced73aa3840f02801c

Übrigens, was ist Abstammung

Offizielle Dokumentation https://github.com/stefankroes/ancestry [Übersetzung] Offizielles Dokument von Gem Ancestry https://qiita.com/Rubyist_SOTA/items/49383aa7f60c42141871

Ancestry ist ein Juwel, mit dem Sie die Datensätze des ActiveRecord-Modells von Ruby on Rails als Baumstruktur (Hierarchie) organisieren können.

Dieses Mal werden wir Vorfahren verwenden, um eine mehrstufige Kategorie zu implementieren.

Definition der Fertigstellung

・ Sie können bis zur Kategorie Enkel auswählen ・ Größe kann ausgewählt werden ・ Sie können Produkte auflisten ← Dies ist wichtig

Dieses Mal werde ich eine Mini-App machen

Machen Sie zuerst "Rails New" im Terminal. Wenn danach der Dateiname nicht im Codeblock angezeigt wird, handelt es sich um eine Operation im Terminal.

$ rails _6.0.0_ new ancestry_app -d mysql
$ cd ancestry_app/

Installiere einige Edelsteine. Unten beschrieben.

Gemfile

gem 'haml-rails'
gem 'jquery-rails'
gem 'ancestry'

gem'haml-Rails' verwendet die Haml-Notation, "gem'jquery-Rails" dient zur Implementierung von Ajax in jQuery. "gem'ancestry" ist die Implementierung von Kategoriefunktionalität ", Du brauchst jeden.

Ändern Sie das Datenspeicherformat.

config/database.yml

# encoding: utf8mb4
encoding: utf8

Geben Sie als Nächstes die folgenden Befehle der Reihe nach in das Terminal ein.

$ bundle install
$ rails db:create
$ rails haml:erb2haml

Edelstein aktivieren, Erstellen Sie eine Datenbank, Konvertieren Sie die in erb beschriebene Datei in die Haml-Notation (geben Sie y ein, wenn Sie unterwegs zur Befehlseingabe aufgefordert werden, ENTER). Es ist ein Fluss.

Erstellen Sie eine Artikeltabelle (damit Artikel aufgelistet werden können)

$ rails g model item

Im Modellverzeichnis befindet sich eine Modelldatei mit dem Namen "item.rb" Im Verzeichnis db / migrate befindet sich eine Migrationsdatei mit dem Namen "20200815022617_create_items.rb". Jeder wurde erstellt. (Die Nummer im Dateinamen der Migrationsdatei gibt Datum und Uhrzeit der Generierung an.)

Ändern Sie die Migrationsdatei.

20200815022617_create_items.rb

class CreateItems < ActiveRecord::Migration[6.0]
  def change
    create_table :items do |t|
      #Dieses Mal erstellen wir eine Spalte mit dem Namen eines Zeichenfolgentyps. Schreiben Sie sie also wie folgt.
      t.string :name, null: false

      t.timestamps
    end
  end
end

Wenn "null: false" hinzugefügt wird, können Produktdaten nur registriert werden, wenn die Namensspalte eingegeben wird (keine Null-Einschränkung). Wenn Sie einfach "t.string: name" verwenden, können Sie Produktdaten registrieren, auch wenn die Namensspalte leer ist. Jetzt erstellen wir eine Artikeltabelle.

$ rails db:migrate

Sie haben jetzt eine Artikeltabelle. Betrachten Sie den Inhalt der Tabelle mit Sequel Pro ・ ID-Spalte ・ Namensspalte -Created_at Spalte -Updated_at Spalte Es sollte geben.

Erstellen Sie einen Artikel-Controller (erstellen Sie auch eine Ansicht).

Dieses Mal implementieren wir die Kategoriefunktion auf dem Produktlistenbildschirm. Sie benötigen also einen Bildschirm mit "localhost: 3000 / items / new". Neben dem Erstellen eines Controllers erstelle ich auch eine Ansicht der neuen Aktion.

$ rails g controller items new

Ein Controller namens "app / controller / items_controller.rb" und Eine Ansichtsdatei mit dem Namen "app / views / new.html.haml" Jeder wurde erstellt.

routes.rb

Rails.application.routes.draw do
  # get 'items/new'
  resources :items
end

Dieses Mal ist es eine Mini-App, also werde ich das Routing vorerst so machen. Verwenden Sie ursprünglich die einzige Option.

Wenn Sie nun den Server starten, sollten Sie auf localhost: 3000 / items / new zugreifen können. Ich konnte vorerst den Produktlistenbildschirm erreichen.

① ist bis hierher. Das nächste Mal erstellen wir zunächst eine "Kategorietabelle".

Zusammenfassung

Zum Schluss noch die Zusammenfassung.

-Erstellen Sie eine Anwendung mit "Rails New" ・ Installieren Sie Edelsteine und erstellen Sie Datenbanken ・ Erstellen Sie einen Produktlistenbildschirm

das ist alles. Es wird bis zum nächsten fortgesetzt. Wir werden nach Bedarf Korrekturen und Ergänzungen vornehmen.

Referenz

Offizielle Dokumentation https://github.com/stefankroes/ancestry [Übersetzung] Offizielles Dokument von Gem Ancestry https://qiita.com/Rubyist_SOTA/items/49383aa7f60c42141871 Implementierung der Funktionsfunktion [Rails] gem ancestry category https://qiita.com/k_suke_ja/items/aee192b5174402b6e8ca