In this article, we are going to learn how to create a calendar with ruby on rails. Ruby on Rails already come with ready-made modules, plugins that help developers save time. Ruby On Rails is an open source framework under the MIT license that can be used to design a number of different applications. Calendar is a simple but effective app to learn RoR basics. It shows the fundamentals of the framework and also allows you to easily add your own functionality. Rails can work with multiple types of servers and database.
To start the application, you need to install rails installer on your system. You can download rails installer from http://railsinstaller.org/en and follow the instructions to install it on your system.
After completing the installation of railsinstaller, this will create sites folder on your C drive. Open the command prompt as an administrator and go to sites folder. Create an application using below command
rails new calendar
This command will create some plugins, models, views, etc. in your application as shown below:
Go to the calendar folder and run the command below to start the server
Rails s
You will see the server will start running on localhost:3000 as shown below.
Open “C:\Sites\calendar\lib” location and create “calendar.rb” file. Add the code below in the calendar.rb file. Save and Close.
class Calendar < Struct.new(:view, :date, :callback) HEADER = %w[Sunday Monday Tuesday Wednesday Thursday Friday Saturday] START_DAY = :sunday delegate :content_tag, to: :view def table content_tag :table, class: "calendar table table-bordered table-striped" do header + week_rows end end def header content_tag :tr do HEADER.map { |day| content_tag :th, day }.join.html_safe end end def week_rows weeks.map do |week| content_tag :tr do week.map { |day| day_cell(day) }.join.html_safe end end.join.html_safe end def day_cell(day) content_tag :td, view.capture(day, &callback), class: day_classes(day) end def day_classes(day) classes = [] classes << "today" if day == Date.today classes << "not-month" if day.month != date.month classes.empty? ? nil : classes.join(" ") end def weeks first = date.beginning_of_month.beginning_of_week(START_DAY) last = date.end_of_month.end_of_week(START_DAY) (first..last).to_a.in_groups_of(7) end end
Now, we need to change our project from config to file auto load.rb in the lib folder. Rails doesn’t do this by default.
To modify the application config file, open “C:\Sites\calendar\config location and you will see the application.rb” file. Open the application.rb file and add the code below.
require File.expand_path('../boot', __FILE__) require 'rails/all' # Require the gems listed in Gemfile, including any gems # you've limited to :test, :development, or :production. Bundler.require(:default, Rails.env) module CalendarExample class Application < Rails::Application config.autoload_paths += %W(#{config.root}/lib) # Settings in config/environments/* take precedence over those specified here. # Application configuration should go into files in config/initializers # -- all .rb files in that directory are automatically loaded. # Set Time.zone default to the specified zone and make Active Record auto-convert to this zone. # Run "rake -D time" for a list of tasks for finding time zone names. Default is UTC. # config.time_zone = 'Central Time (US & Canada)' # The default locale is :en and all translations from config/locales/*.rb,yml are auto loaded. # config.i18n.load_path += Dir[Rails.root.join('my', 'locales', '*.{rb,yml}').to_s] # config.i18n.default_locale = :de end end
Now, let’s include bootstrap to our application. In this application, we are loading bootstrap from Yandex’s CDN. You can also apply your own stylesheet for this application. Open the application.html.erb file from the “C:\Sites\calendar\app\views\layouts” location and modify the code.
<!DOCTYPE html> <html> <head> <title>CalendarExample</title> <%= stylesheet_link_tag "application", media: "all", "data-turbolinks-track" => true %> <%= javascript_include_tag "application", "data-turbolinks-track" => true %> <%= stylesheet_link_tag "http://yandex.st/bootstrap/3.0.2/css/bootstrap.min.css", media: "all" %> <%= javascript_include_tag "http://yandex.st/bootstrap/3.0.2/js/bootstrap.min.js" %> <%= csrf_meta_tags %> </head> <body> <div class="container"> <%= yield %> </div> </body> </html>
Let’s create a controller by using below rails command
rails g controller Calendar show
This command will generate a controller in your application. Open the “calendar_controller.rb” file in “C:\Sites\calendar\app\controllers” location and add the code below.
class CalendarController < ApplicationController def show @date = params[:date] ? Date.parse(params[:date]) : Date.today end end
Now modify your routes file, which is located in your config folder. Open routers.rb file and add the code given below.
CalendarExample::Application.routes.draw do resource :calendar, only: [:show], controller: :calendar root to: "calendar#show" end
Now to create a helper method for rendering the calendar, open “calendar_helper.rb” file from C:\Sites\calendar\app\helpers folder and add the code below.
module CalendarHelper def calendar(date = Date.today, &block) Calendar.new(self, date, block).table end end
Lets open the show view file – “show.html.erb” from “C:\Sites\calendar\app\views\calendar” location for adding a calendar controller and add the code given below:
<div class="row"> <div class="col-md-12 text-center"> <div class="well controls"> <%= link_to calendar_path(date: @date - 1.month), class: "btn btn-default" do %> <i class="glyphicon glyphicon-backward"></i> <% end %> <%= "#{@date.strftime("%B")} #{@date.year}" %> <%= link_to calendar_path(date: @date + 1.month), class: "btn btn-default" do %> <i class="glyphicon glyphicon-forward"></i> <% end %> </div> </div> </div> <div class="row"> <div class="col-md-12"> <%= calendar @date do |date| %> <%= date.day %> <% end %> </div> </div>
Now, go to Command prompt once again and run the server with rails command and refresh your browser. You will see the calendar below.
Rails s
In this blog, we will learn how to design a complete calendar from scratch on Ruby on Rails. While this is an extremely basic application, you can easily add more features to improve it’s functionality.