【Ruby on Rails】簡単な掲示板を作成しました

Ruby on Railsで簡単な掲示板を作りました。

こんな感じです

今回の掲示板作成において基礎から学ぶ Ruby on Rails: 1週間の短期間講座!楽しく学ぶRailsの新しい入門書という本を参考にさせてもらいました。

この本ではAWS cloud 9というサービス上でRailsを実行しているのですが、このようにCentOS7でも問題なく作れましたし、内容も非常にわかりやすいのでとてもおすすめです(kindle unlimitedに加入していれば無料で読めます!)

環境

  • CentOS7
  • Apache

作り方

まずは掲示板を作るためのデータベース(モデル)を作ります。

$ rails g model Log title:string name:string content:text

これでLogというモデルが作成されました。簡単な掲示板なのでtitle(タイトル)とname(名前)とcontent(本文)だけです。型指定ですが、stringは255字までの制限があるため、本文となるcontentの型はtext(文字数制限なし)にしています。

次に以下のコマンドを実行してデータベースへの変更を反映させます。

$ rails db:migrate

次にapp/views/layouts/application.html.erbを編集します。

デザインはBootstrapを使わせてもらうので、CSSのリンク部分を以下の通りにします。

<%= stylesheet_link_tag ‘application’, media: ‘all’, ‘data-turbolinks-track’: ‘reload’ %>の直前に記述

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">

app/views/にbbsというフォルダを作ります。

作成したbbsフォルダの中にindex.html.erbというファイルを作成してコードを書いていきます。

ちなみにデザインはBootstrapのCardを使わせてもらってます。

<h1 align="center">BBS</h1>
<p>
<h4>新規投稿</h4>

<%= form_with model:@log, local: true do |f| %>
  
  <div class="form-group">
    <label>タイトル</label>
    <%= f.text_field :title, class: "form-control" %>
  </div>

  <div class="form-group">
    <label>名前</label>
    <%= f.text_field :name, class: "form-control" %>
  </div>


  <div class="form-group">
    <label>本文</label>
    <%= f.text_area :content, class: "form-control" %>
  </div>
  
  <%= f.submit "新規投稿", class: "btn btn-success"%><br>
<% end %>

<br><br>
  <% @log_all.reverse.each do |log| %>
<div class="card">
  <h5 class="card-header"><%= log.title %></h5>
  <div class="card-body">
  投稿者:<%= log.name %> 投稿日:<%= log.created_at %>
    <h5 class="card-title"></h5>
    <p class="card-text"><%= log.content %></p>
  </div>
</div></p>
 <% end %>

app/controllers/にlog_controller.rbというファイルを作り、以下の通り編集します。

class LogController < ApplicationController
  
    def index
      @log_all = Log.all
      @logs = Log.new
    end

    def create
      book_params = params.permit(:title, :content, :name)
      @log = Log.new(book_params)
      @log.save
      redirect_to bbs_path
    end

  end

configの中にあるroutes.rbを編集します

Rails.application.routes.draw do
  get "/bbs", to: "log#index"
  post "/bbs", to: "log#create"
end

これで完成です!

rails s -b 0.0.0.0してhttp://(VPSのアドレス):3000/bbsにアクセスすれば内容を確認できるはずです。

コメント

タイトルとURLをコピーしました