maxstbn Mar 5 2012 at 13:23

Использование связки Sinatra, mongodb и carrierwave, пишем простую фотогалерею

3 min

5.2K

Всем доброго времени суток!

Введение

На написание этого поста меня сподвигло слишком малое количество материала о sinatra, и тем более о данной связке. Надеюсь для кого то этот пост будет полезен. Ниже я опишу как можно совместно использовать sinatra, mongodb и carrierwave, на примере создания простой фотогалереи. Для общения между sinatra и mongodb мы будем использовать отличный gem — mongoid. По умолчанию предполагается что у вас уже установлен ruby и mongodb. Приступим.

Шаг 1

Установим необходимые gem:
gem install sinatra haml mongoid bson_ext carrierwave carrierwave-mongoid

Шаг 2

Создадим sinatra приложение:

создаём каталог нашего приложения, назовём его myapp
внутри каталога создаём файл index.rb, со следюущим содержимым:
require 'sinatra' get '/' do 'Hello from Sinatra' end
запускаем
ruby index.rb
Откываем в браузере localhost:4567, видим надпись «Hello from Sinatra» и радуемся, базовое приложение sinatra готово и работает

Шаг 3

Настроим подключение к mongodb, и создадим базу данных, для хранения информации в фотографиях в галлерее. Запишем всё это index.rb:

require 'sinatra'
require 'haml'
require 'bson'
require 'mongoid'

#конфигурация базы данных
configure do
  Mongoid.configure do |config|
    name = "app"
    config.master = Mongo::Connection.new.db(name)
    config.persist_in_safe_mode = false
  end
end

#Создаём документ Image(практически то же самое что и таблица в SQL базе) с атрибутом :title(название фотографии)
class Image
  include Mongoid::Document
  field :title, type: String
end


#список фотографий
get '/' do
  @images = Image.all
  haml :'index'
end

#создание новой фотографии
post '/' do
  @image = Image.new(:title => params['title'])
  @image.save
  redirect "/"
end

#показ одной фотографии
get '/image/:id' do
  @image = Image.find(params[:id])
  haml :'show'
end

Создадим диреткорию views и добавим в неё шаблоны index.haml(для отображения списка фотографий) и show.haml(для отображения одной фотографии), с содержимым:

#index.haml
%h2 Photogallery
%ul.photogallery
-for image in @images
  %li
    %a{:href => "/image/#{image.id}"}=image.title

%h2 Добавить фотографию
%form{:name => "new_image", :id =>"new_image", :method => "POST", :enctype => "multipart/form-data"}
  %p
    %label Заголовок фотографии
    %br
    %input{:type=>"text", :name => "title"}
  %p
    %input{:type=>"submit", :value => "Сохранить"}

#show.haml
%h1= @image.title

Запускаем наше приложение
ruby index.rb
заходим на localhost:4567 и видим страничку с формой добавления фотографий(пока просто заголовка фотографии), пробуем что нибудь написать туда и сохранить если всё сохранилось и отразилось, то переходим к следующему шагу, где с помощь carrierwave организуем загрузку изображений

Шаг 4

Подключим и настроим carrierwave, для того что бы этот gem правильно работал с mongoid нам необходимо поставить ещё gem carrierwave-mongoid мы его уже установили в самом начале. Ниже конечный код файлов:
index.rb, index.haml, show.haml

#index.rb
require 'sinatra'
require 'haml'
require 'bson'
require 'mongoid'
require 'carrierwave'
require 'carrierwave/mongoid'

#конфигурация базы данных
configure do
  Mongoid.configure do |config|
    name = "app"
    config.master = Mongo::Connection.new.db(name)
    config.persist_in_safe_mode = false
  end
end

#конфигурация carrierwave
class ImageUploader < CarrierWave::Uploader::Base
  storage :file
end

#Создаём документ Image(практически то же самое что и таблица в SQL базе) с атрибутом :title(название фотографии)
class Image
  include Mongoid::Document
  mount_uploader :image, ImageUploader, type: String
  field :title, type: String
end

#список фотографий
get '/' do
  @images = Image.all
  haml :'index'
end

#создание новой фотографии
post '/' do
  @image = Image.new(:title => params['title'])
  @image.image = params[:image] #загрузка изображения
  @image.save
  redirect "/"
end

#показ одной фотографии
get '/image/:id' do
  @image = Image.find(params[:id])
  haml :'show'
end

#index.haml
%h2 Photogallery
%ul.photogallery
-for img in @images
  %li
    %a{:href => "/image/#{img.id}"}= img.title
    %a{:href => "/image/#{img.id}"}
      %img{:src => img.image}

%h2 Добавить фотографию
%form{:name => "new_image", :id =>"new_image", :method => "POST", :enctype => "multipart/form-data"}
  %p
    %label Заголовок фотографии
    %br
    %input{:type=>"text", :name => "title"}
  %p
    %label Изображение
    %br
    %input{:type=>"file", :name => "image"}
  %p
    %input{:type=>"submit", :value => "Сохранить"}

#show.haml
%h1= @image.title
%img{:src => @image.image}

перезапускаем приложение, заходим на localhost:4567 и радуемся нашему приложению, ресайз изображений, редактирование и удаление я оставляю вам на домашнее задание)

Исходники лежат здесь — https://bitbucket.org/vened/imagegallery/src

Tags:

Hubs:

Ruby