#はじめに
お店のサイトで、イベントをカレンダーを用いて一覧表示にしました。
当初はfullcalendarを使用する予定でしたが、スクールで成果物の提出期限もあり学習コストがあまりかからない方法を考えた末simlpe_calendarを使用することに至りました。
数ヶ月後の自分の為にも、勇気を出してQiitaの初投稿とさせていただきます。
#完成イメージ

#前提
・予定投稿機能実装済(記事内ではScheduleモデル)
・言語はi18nによって日本語化済。本来であれば、曜日、月は英語表記になっていると思います。(エラーメッセージを日本語化したかっただけなのですが、意図せずこちらも変わっていました)

#simple_calendarインストール

Gemfile

gem "simple_calendar", "~> 2.0"

$ bundle install

#カレンダーのview作成
前提に書かせていただいているScheduleモデルのマイグレーションファイルはこちらです。
t.string :content は予定のタイトル、詳細画面で予定の詳細を表示したかったので t.text :plan で予定の詳しい文章を入れています。
開始日時のデータも欲しいので t.datetime :start_time が必要です。

db/migrate/..._create_schedules.rb

class CreateSchedules < ActiveRecord::Migration[5.2]
  def change
    create_table :schedules do |t|
      t.string :content
      t.text :plan
      t.datetime :start_time

      t.timestamps
    end
  end
end

カレンダーの見た目を整える為、下記を実行しviewファイルを作成します。

$ rails g simple_calendar:views

app/views/schedules/index.html.erb

<h1>Schedule</h1>
<%= month_calendar events: @schedules do |date, schedules| %>
　<%= date.day %>
　　<% schedules.each do |schedule| %><br />
　　　<%= schedule.start_time.strftime('%H:%M') %>　#スケジュールの開始時間を表示
　　　<%= link_to schedule.content,schedule_path(schedule) %>
　　<% end %>
<% end %>

スケジュールのタイトルからスケジュール詳細にリンクする仕様です。

simple_calendarのCSSを適用させるために、application.scssに追記します。

app/assets/stylesheets/application.scss

 *
 *= require simple_calendar #←ここに追記します
 *= require_tree .
 *= require_self
 */

月、曜日を日本語化にしているので不自然だった為少し修正を加えました。

app/views/simple_calender/_month_calendar.html.erb

 <div class="simple-calendar">
  <div class="calendar-heading">
    <%= link_to t('simple_calendar.previous', default: '<<先月'),  calendar.url_for_previous_view %>　#Previousを先月に変更
    <font size="5"><span class="calendar-title"><%= start_date.year %> <%= t('date.month_names')[start_date.month] %></span></font>
    <%= link_to t('simple_calendar.next', default: '次月>>'), calendar.url_for_next_view %>　#Nextを次月に変更
  </div>

  <table class="table table-striped">
    <thead>
      <tr>
        <% date_range.slice(0, 7).each do |day| %>
          <th><%= t('date.abbr_day_names')[day.wday] %></th>
        <% end %>
      </tr>
    </thead>
・
・
・

以上でsimple_calendarの導入が完了しました！

#参考
https://qiita.com/isaatsu0131/items/ad1d0a6130fe4fd339d0
https://github.com/excid3/simple_calendar

参考にさせていただきました。ありがとうございます。

#最後に
ここまでご覧くださった方、ありがとうございます。
初の投稿となりましたが、おかしな表現などあれば失礼致しました！
ではまた投稿させて頂きます！