[RUBY] Erstellen Sie eine Instagram-Klon-App ③

Einführung

Wie der Titel schon sagt, werden wir eine vereinfachte Version der Instagram-App erstellen. Ich werde den Artikel in den folgenden Schritten schreiben, also hoffe ich, dass Sie ihn Schritt für Schritt lesen werden.

① App-Erstellung - Implementierung der Anmeldefunktion ② Implementierung der Fotoposting-Funktion ③ [Implementierung der Benutzerseite] (https://qiita.com/maca12vel/items/c716702b02f977303011) ← Imakoko ④ [Implementierung der Verfolgungsfunktion] (https://qiita.com/maca12vel/items/2760d33f3683fac91de5) ⑤ Implementierung der Post-Deletion-Funktion

Benutzer-Controller erstellen / bearbeiten

In Bezug auf die Namenskonvention ist der Modellname Singular und der Controller-Name Plural. Diesmal handelt es sich um einen Controllernamen, daher wird er als "Benutzer" pluralisiert.

• Im Folgenden im Anwendungsverzeichnis

rails g controller users

Vergessen Sie nicht, auch das Routing festzulegen.

routes.rb

Rails.application.routes.draw do
  root 'homes#index'

  devise_for :users

  resources :photos
  resources :users #← hier
end

Nach dem Festlegen bearbeiten Sie users_controller.rb.

users_controller.rb

class UsersController < ApplicationController
  def show
    @user = User.find(params[:id])
  end
end

Aktion anzeigen listet jetzt Benutzer auf.

Ansichtsdatei bearbeiten

Im vorherigen Artikel konnte ich die veröffentlichten Bilder und Texte auf dem Startbildschirm sehen. Dieses Mal werden wir es so bearbeiten, dass der veröffentlichte Inhalt auf jeder Benutzerseite angezeigt wird.

Zunächst aus der Erstellung der Benutzerseite. Erstellen und bearbeiten Sie "show.html.erb" in "app / views / users".

erb:app/views/users/show.html.erb

<h3><%= @user.email %></h3>

<% @user.photos.each do |photo| %>
  <div>
    <p><%= photo.caption %></p>
    <%= image_tag photo.image %>
  </div>
<% end %>

@ user.email ist eine Alternative zu Ihrem Benutzernamen. Und zeigen Sie den Inhalt des vorherigen Beitrags an <% current_user.photos.each do |photo| %> Wo ich war <% @user.photos.each do |photo| %> Es wurde gemacht.

Natürlich werden die auf dem Startbildschirm angezeigten Inhalte gelöscht.

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

<h3>home</h3>

<div>
  <%= link_to 'logout', destroy_user_session_path, method: :delete %>
</div>

<div>
  <%= link_to 'Poste ein Foto', new_photo_path %>
</div>

#↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ Löschen Sie unten von hier ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

<% current_user.photos.each do |photo| %>
  <div>
    <p><%= photo.caption %></p>
    <%= image_tag photo.image %>
  </div>
<% end %>

Zeigen Sie nach dem Löschen den Link zu jeder Benutzerseite an.

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

<h3>home</h3>

<div>
  <%= link_to 'logout', destroy_user_session_path, method: :delete %>
</div>

<div>
  <%= link_to 'Poste ein Foto', new_photo_path %>
</div>

#↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ Von hier unten hinzufügen ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

<% User.all.each do |user| %>
<div>
  <%= link_to user.email, user_path(user) %>
</div>
<% end %>

Die E-Mail-Adresse wird anstelle des Benutzernamens verwendet. Überprüfen Sie für "Benutzerpfad (Benutzer)" das Präfix "Schienenrouten". Dieses Mal müssen wir auch ** user id ** identifizieren, also brauchen wir (user).

• Gleiches gilt, wenn der Teil user_path (user) [user] ist.

Wenn der Startbildschirm wie folgt aussieht, sind Sie erfolgreich.

Das tatsächliche Verhalten ist wie folgt.

Wenn Sie auf die Seite "sample @ gmail.com" zugreifen, Der Benutzername wird oben angezeigt, gefolgt vom veröffentlichten Inhalt.

Wenn Sie auf die Seite "example @ gmail.com" zugreifen, Es wird nur der Benutzername angezeigt, da er noch nicht veröffentlicht wurde.

Übrigens, damit Sie auf die Seite jedes Benutzers zugreifen können, auch wenn Sie nicht angemeldet sind Sie haben before_action nicht auf users_controller gesetzt.

das ist alles. Danke für deine harte Arbeit.

Weiter → ④ [Implementierung der Verfolgungsfunktion] (https://qiita.com/maca12vel/items/2760d33f3683fac91de5)