Статьи

Создание приложения, управляемого данными с помощью Sinatra

Декабрь 6, 2018

Создание простых веб-приложений с помощью Sinatra — это быстро и, что ж, просто. В этой статье мы собираемся создать простое приложение Sinatra, которое подключается к базе данных для хранения сообщений в блоге. Не только это, но мы собираемся построить его с учетом развертывания в Heroku. Давайте начнем…

Сначала создайте новую папку с именем blog, а затем добавьте новый файл с именем main.rb. Одна из приятных сторон Sinatra — мы можем работать локально, используя базу данных Sqlite. Но при развертывании мы можем использовать общую базу данных Heroku Postgresql.

Для начала, в main.rb требуются гемы, которые нам понадобятся:

require 'sinatra'
require 'data_mapper'
require 'dm-migrations'
require 'dm-timestamps'

Затем мы добавим соединение с нашей базой данных, используя Data Mapper:

#database connection
DataMapper.setup(:default, ENV['DATABASE_URL'] || "sqlite3://#{Dir.pwd}/development.db")

Далее мы создадим метод для домашней страницы нашего приложения:

get '/' do
    erb :index
end

Теперь создайте папку с именем views и добавьте 2 файла:

  • index.erb (домашняя страница)
  • layout.erb

Отличная особенность Sinatra заключается в том, что layout.erb будет обнаружен и использован именно так — макет для всех страниц в приложении. Придумайте дизайн, который вы хотели бы использовать, и добавьте его как обычную HTML-разметку в layout.erb.

Есть несколько вызовов Ruby, которые мы добавим в layout.erb. В том месте, где вы хотите разместить содержимое главной страницы, добавьте следующее:

<div id="content-wrapper">
    <div id="content">
        <%= yield %>
    </div>
</div>

Вы также должны добавить папку с именем public в корень. Здесь вы добавляете любые таблицы стилей и изображения.

Если вы хотите иметь повторяющиеся разделы в макете, который появляется на всех страницах, вы можете использовать частичные. Создайте новую папку внутри вашей папки представлений с именем partials. Тогда в вашем макете вы можете сделать это:

<div id="sidebar-wrapper">
    <div id="sidebar">
        <%= erb :'partials/twitter' %>
    </div>
</div>

Здесь вы видите, что я добавил частичку для отображения моего твиттера.

Добавить другие статические страницы так же просто, как создать метод в main.rb:

get '/about' do
    erb: about
end

Данные, пожалуйста …

Чтобы начать работать с данными, мы должны сначала создать модель. Мы используем драгоценный камень DataMapper в этом приложении. Добавьте это после подключения к базе данных:

class Post
    include DataMapper::Resource
    
    property :id, Serial
    property :title, String
    property :content, Text
    property :created_at, DateTime
end

DataMapper.finalize
DataMapper.auto_upgrade!

Чтобы запустить наше приложение, чтобы увидеть, как оно выглядит, откройте терминал, перейдите в папку вашего блога и выполните:

ruby main.rb

Синатра запустит веб-сервер, и вам сообщат, что ваше приложение работает по адресу http: // localhost: 4567. Когда вы запускаете команду, эта строка: DataMapper.auto_upgrade! убедитесь, что ваша модель работает и создает таблицу в соответствии с указанной моделью (возможно, вам придется перезапустить сервер):

База данных

Теперь мы можем создать представление с именем posts в папке views и добавить следующее:

<h2>Posts</h2>
<% unless @posts.empty? %>
    <% @posts.each do |post| %>
        <p>
            <a href="/view/<%= post.id %>"><%= post.title %></a> -
<em><%= post.created_at.strftime("%e %b %Y %H:%m:%S%p") %></em>
        </p>
    <% end %>
<% else %>
    <p>No posts available at the moment.</p>
<% end %>

Это перечислит все наши сообщения. Далее мы создадим еще одно представление под названием view_post.erb. Цель этого состоит в том, чтобы отображать отдельные сообщения при нажатии на них в нашем списке выше.

Во-первых, нам понадобится метод в main.rb для его обработки:

 get '/view/:id' do
    @post = Post.get(params[:id])
    erb :view_post
end

Здесь вы можете видеть, что мы получаем идентификатор сообщения из параметра url, а затем используем DataMapper для получения сообщения.

Добавьте несколько сообщений вручную в вашу базу данных на данный момент.

Теперь для view_post.erb:

<h3><%[email protected] %></h3>
<p><em><%= @post.created_at.strftime("%e %b %Y %H:%m:%S%p") %></em></p>
<%[email protected] %>

Поскольку запрос, который мы отправляем в базу данных, должен извлекать только одну запись, на этот раз цикл не нужен. Мы можем вызвать нашу переменную экземпляра (@post) напрямую, чтобы вернуть полученные данные.

Gemfile

Для подготовки к развертыванию нашего приложения в Heroku нам понадобится Gemfile. В корне приложения создайте новый файл с именем Gemfile. Просто это — не расширение файла, а прописная буква G.

Добавь это:

source :rubygems
gem 'sinatra'
gem 'data_mapper'
gem 'dm-migrations'
gem 'dm-timestamps'
gem 'dm-postgres-adapter', :group => :production
gem 'dm-sqlite-adapter', :group => :development
group :production do
  gem 'pg', '0.14.1'
end

 

Здесь есть важная часть настройки. Мы определили, что мы хотим использовать Sqlite для разработки, но Postresql для производства. Это потому, что Heroku не поддерживает Sqlite .

В заключение…

Теперь у вас есть основное рабочее приложение для блога. Далее я расскажу вам о процессе его развертывания в Heroku.

 

 

 

 

 

 

 

 

 

 

 

 

 

40
Share: