戻る

Rails5.0


動画学習サイトの構築 Rails5.0

  (0)
1,000円

タスク5-2   マイプロジェクトページ

このタスクについて


タスクの内容を一部抜粋します。
プロジェクトを購入していただくとこのタスクの内容の全てを読みやすい表示で見ることができます。
プログラムコードが色分けされて見やすくなります。
プログラムコードに行番号が付きます。
本文が色分けされて見やすくなります。
そしてこのアプリケーションのフルコードをダウンロードすることが可能になります。




購入したプロジェクトを表示するページを作成します。


「app\controllers\project_controller.rb」ファイルに以下の記述を追加します。


記述追加 app\controllers\project_controller.rb(3行目)
before_action :authenticate_user!, only: [:list]



app\controllers\project_controller.rb
 
class ProjectController < ApplicationController 

  before_action :authenticate_user!, only: [:list] 

  def index 
  	@projects = Project.all 
  end 

  def show 
  	@project = Project.find(params[:id]) 
  	@tasks = @project.tasks.order(:tag) 
    @joined = false 
    if !current_user.nil? && !current_user.projects.nil? 
      @joined = current_user.projects.include?(@project) 
    end 
    @users = @project.users.order('created_at desc').first(10) 
  end 

  def list 
    if !current_user.nil? 
      @projects = current_user.projects 
    end 
  end 
end 



「app\views\project」フォルダに「list.html.erb」ファイルを新規作成します。


app\views\project\list.html.erb(新規作成したファイル)
 
<section class="section"> 
    <div class="container"> 
        <div class="columns"> 
        
            <!-- 左側 --> 
            <div class="column is-one-third"> 
                <div class="columns is-multiline"> 
                    <!-- 上部 --> 
                    <div class="column is-full"> 
                        <div class="card"> 
                            <!-- アバター --> 
                            <div class="card-content is-horizontal-center is-flex"> 
                                <figure class="image is-256x256"> 
                                    <%= image_tag current_user.gravatar_url, class: "is-rounded" %> 
                                </figure> 
                            </div> 
                            
                            <div class="card-content"> 
                               
                                <!-- メンバー --> 
                                <article class="media"> 
                                    <div class="media-content">アカウント登録日</div> 
                                    <div class="media-right"> 
                                        <strong><%= I18n.l(current_user.created_at, format: :full_date) %></strong> 
                                    </div> 
                                </article> 
                            </div> 
                        </div> 
                    </div> 
                    <!-- 認証 --> 
                    <div class="column is-full"> 
                        <div class="card"> 
                            <div class="card-content"> 
                                
                                <!-- Googleの認証 --> 
                                <article class="media"> 
                                    <div class="content"> 
                                        <p> 
                                            <strong>アカウント連携</strong><br/> 
                                            <% if current_user.provider %> 
                                                <span class="has-text-success">googleアカウントでログイン中</span> 
                                            <% end %> 
                                        </p> 
                                    </div> 
                                </article> 
                            </div> 
                        </div> 
                    </div> 
                </div> 
            </div> 
            <!-- 右側 --> 
            <div class="column"> 
                <div class="columns is-multiline"> 
                        <% if @projects.count > 0 %> 
                            <% @projects.each do |project| %> 
                                <%= link_to project do %> 
                                    <div class="column is-one-third"> 
                                        <div class="card"> 
                                            <div class="card-image"> 
                                                <%= link_to project_path(project) do %> 
                                                    <figure class="image is-4by3"> 
                                                        <%= image_tag project.image %> 
                                                    </figure> 
                                                <% end %> 
                                            </div> 
                                            <div class="card-content p-t-5 p-b-5"> 
                                                <h4 class="title is-6" style="color: black; margin: 10px;"><%= project.name %></h4> 
          
                                            </div> 
                                            <div class="card-content p-t-5 p-b-5"> 
                                                <h4 class="title is-6" style="color: black; margin: 5px;">タスク&nbsp;&nbsp;<i class="far fa-clock"></i> <%= project.tasks.count %></h4> 
          
                                            </div> 
                                            <footer class="card-footer"> 
                                                <div  style="margin-top: 10px; margin-bottom: 10px;"> 
                                                &nbsp;&nbsp;<%= link_to  "このプロジェクトを始める", project_path(project), class: "button is-success" %> 
                                                </div> 
                                            </footer>  
                                            
                                        </div> 
                                    </div> 
                                <% end %> 
                            <% end %> 
                        <% else %> 
                            <div class="center"> 
                                <h5>購入したプロジェクトはありません。</h5> 
                                <%= link_to "プロジェクトの一覧", project_index_path, class: "button is-success" %> 
                            </div> 
                        <% end %> 
                    </div> 
                </div> 
            </div> 
        </div> 
    </div> 
</section> 






この続きはプロジェクトを購入していただくことで見ることができます。
プロジェクトを購入していただくとこのタスクの内容の全てを読みやすい表示で見ることができます。
プログラムコードが色分けされて見やすくなります。
プログラムコードに行番号が付きます。
本文が色分けされて見やすくなります。
そしてプロジェクトを購入するとこのアプリケーションのフルコードをダウンロードすることができます。

まだレビューはありません。

動画学習サイトの構築 Rails5.0

1,000円

動画で学べるサイトを構築するプロジェクトです。プロジェクトを登録し、そのプロジェクトに動画を登録できます。プロジェクトはクレジットカードで購入でき、購入後すぐに動画を見ることができます。写真のアップロード、レビュー機能の実装、Google認証、アマゾンS3の利用方法も解説。ActiveAdminの実装、Gメールの設定、 HEROKUへのデプロイ方法を解説。 フルコードのダウンロード可能。

タスク数: 100