rails_Rails应用程序必备的宝石

最新推荐文章于 2024-04-09 09:49:36 发布

cumi6497

最新推荐文章于 2024-04-09 09:49:36 发布

阅读量311

点赞数

文章标签： java python docker github linux

原文链接：https://www.freecodecamp.org/news/cjn-essential-gems-for-rails-applications-75fed43d2798/

版权

rails

Gems are located in the Gemfile inside your project folder. Let’s have a look at some you’ll want to have.

宝石位于项目文件夹内的Gemfile中。让我们来看看一些您想要的东西。

will_paginate (will_paginate)

Adds pagination to your app

向您的应用程序添加分页

安装 (Installation)

Add to Gemfile

添加到Gemfile

gem 'will_paginate'

Install

安装

bundle install

Usage

用法

In a .html.erb file, render page links in the view:

在.html.erb文件中，在视图中呈现页面链接：

<%= will_paginate @places %>
  <% @places.each do |place| %>
    <h1><%= place.name %></h1>
    <br />
  <% end %>
<%= will_paginate @places %>

In your controller, you can define how many entries per page you want to display. In the example below, it will list 3 entries per page.

在控制器中，您可以定义每个页面要显示多少个条目。在下面的示例中，它将每页列出3个条目。

def index
  @places = Place.all.paginate(page: params[:page], per_page: 3)
end

Source: https://github.com/mislav/will_paginate

资料来源： https : //github.com/mislav/will_paginate

简单的形式 (simple_form)

Forms made easy!

表格变得简单！

安装 (Installation)

Add to Gemfile

添加到Gemfile

gem 'simple_form'

Install

安装

bundle install

Run the generator

运行发电机

rails generate simple_form:install

Usage

用法

In a .html.erb file:

在.html.erb文件中：

<%= simple_form_for @place do |f| %>
  <%= f.input :name %>
  <%= f.input :address %>
  <%= f.input :description %>
  <br />
  <%= f.submit 'Create', class: 'btn btn-primary' %>
<% end %>

Source: https://github.com/plataformatec/simple_form

资料来源： https : //github.com/plataformatec/simple_form

设计 (devise)

Adds user management

增加用户管理

安装 (Installation)

Add to Gemfile

添加到Gemfile

gem 'devise'

Install

安装

bundle install

Run the generator

运行发电机

rails generate devise:install

Configure device at config/environments/development.rb

在config / environments / development.rb上配置设备

Add this line:

添加此行：

config.action_mailer.default_url_options = { host: 'localhost', port: 3000 }

Edit code in app/views/layouts/application.html.erb

在app / views / layouts / application.html.erb中编辑代码

Add this line:

添加此行：

<% if notice %>
  <p class="alert alert-success"><%= notice %></p>
<% end %>
<% if alert %>
  <p class="alert alert-danger"><%= alert %></p>
<% end %>

Add sign-up and login links in app/views/layouts/application.html.erb

在app / views / layouts / application.html.erb中添加注册和登录链接

<p class="navbar-text pull-right">
<% if user_signed_in? %>
  Logged in as <strong><%= current_user.email %></strong>.
  <%= link_to 'Edit profile', edit_user_registration_path, :class => 'navbar-link' %> |
  <%= link_to "Logout", destroy_user_session_path, method: :delete, :class => 'navbar-link'  %>
<% else %>
  <%= link_to "Sign up", new_user_registration_path, :class => 'navbar-link'  %> |
  <%= link_to "Login", new_user_session_path, :class => 'navbar-link'  %>
<% end %>
</p>

Force user to be redirected to login page if not logged in.

如果未登录，则强制用户重定向到登录页面。

Edit in app/controllers/application_controller.rb

在app / controllers / application_controller.rb中编辑

before_action :authenticate_user!

Source: https://guides.railsgirls.com/devise

资料来源： https : //guides.railsgirls.com/devise

地理编码器 (geocoder)

Adds geocoding from Google API

从Google API添加地理编码

安装 (Installation)

Add to Gemfile

添加到Gemfile

gem 'geocoder'

Install

安装

bundle install

Create a migration file, run this in your terminal:

创建一个迁移文件，在终端中运行它：

rails generate migration AddLatitudeAndLongitudeToModel latitude:float longitude:float

rake db:migrate

Example of a migration file adding latitude and longitude columns for existing Places table:

为现有的“地方信息”表添加纬度和经度列的迁移文件示例：

class AlterPlacesAddLatAndLng < ActiveRecord::Migration[5.0]
  def change
    add_column :places, :latitude, :float
    add_column :places, :longitude, :float
  end
end

Add these lines in your app/model/place.rb

将这些行添加到您的app/model/place.rb

geocoded_by :address
after_validation :geocode

Add this script in show.html.erb

在show.html.erb添加此脚本

<script>
<% if @place.latitude.present? && @place.longitude.present? %>
  function initMap() {
  var myLatLng = {lat: <%= @place.latitude %>, lng: <%= @place.longitude %>};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 15,
    center: myLatLng
  });
  var marker = new google.maps.Marker({
    position: myLatLng,
    map: map,
    title: 'Hello World!'
  });
}
</script>

Source: https://www.rubydoc.info/gems/geocoder/1.3.7

资料来源： https : //www.rubydoc.info/gems/geocoder/1.3.7

费加罗报 (figaro)

Easily configure your APIs in Heroku deployment

在Heroku部署中轻松配置您的API

安装 (Installation)

Add to Gemfile

添加到Gemfile

gem 'figaro'

Install and create a commented config/application.yml file and add it to your .gitignore

安装并创建注释的config/application.yml文件，并将其添加到您的.gitignore

bundle exec figaro install

Update your API keys in config/application.yml

在config/application.yml更新您的API密钥

For updating API keys in heroku, go to your terminal:

要更新heroku中的API密钥，请转到您的终端：

figaro heroku:set -e productionheroku restart

Source: https://github.com/laserlemon/figaro

资料来源： https : //github.com/laserlemon/figaro

载波 (carrierwave)

image uploader

图片上传器

安装 (Installation)

Add to Gemfile

添加到Gemfile

gem 'carrierwave'

Install

安装

bundle install

In your terminal

在您的终端

rails generate uploader Image

It will generate this:

它将生成此：

app/uploaders/image_uploader.rb

Create a migration file

创建一个迁移文件

rails g migration add_image_to_courses image:string

Run the migration file

运行迁移文件

rake db:migrate

In your model

在您的模型中

class User < ApplicationRecord  mount_uploader :image, ImageUploaderend

Add to a html.erb i.e. app/views/instructor/courses/new.html.erb

添加到html.erb即app/views/instructor/courses/new.html.erb

<%= f.input :image %>

Add to controller app/controllers/instructor/courses_controller.rb

添加到控制器app/controllers/instructor/courses_controller.rb

params.require(:course).permit(:title, :description, :cost, :image)

Add to show.html.erb i.e. app/views/instructor/courses/show.html.erb

添加到show.html.erb即app/views/instructor/courses/show.html.erb

<%= image_tag @course.image, class: 'img-fluid' %>

Also update the following:

同时更新以下内容：

app/views/courses/show.html.erb
app/views/courses/show.html.erb
app/views/courses/index.html.erb
app/views/courses/index.html.erb
app/views/instructor/courses/show.html.erb
app/views/instructor/courses/show.html.erb

使用ImageMagick的图像分辨率，更多有关载波的信息 (Image Resolution with ImageMagick, more on carrierwave)

Carrierwave in shows that MiniMagick and RMagick can be used

Carrierwave中显示可以使用MiniMagick和RMagick

It shows here app/uploaders/image_uploader.rb

它在这里显示app/uploaders/image_uploader.rb

class ImageUploader < CarrierWave::Uploader::Base
  # Include RMagick or MiniMagick support:
  # include CarrierWave::RMagick
  # include CarrierWave::MiniMagick

安装ImageMagick (Installing ImageMagick)

We need to update our development environment’s database of programs to make sure when we install a program we’re getting the latest version.

我们需要更新我们的开发环境的程序数据库，以确保在安装程序时获得最新版本。

$ sudo apt-get update

Install ImageMagick

安装ImageMagick

$ sudo apt-get install imagemagick

Installation MiniMagick

安装MiniMagick

Add to Gemfile

添加到Gemfile

gem 'mini_magick'

Install

安装

bundle install

Uncomment MiniMagick in app/uploaders/image_uploader.rb

在app/uploaders/image_uploader.rb取消注释app/uploaders/image_uploader.rb

class ImageUploader < CarrierWave::Uploader::Base
  # Include RMagick or MiniMagick support:
  # include CarrierWave::RMagick
  include CarrierWave::MiniMagick

That line gives CarrierWave the ability to reach out to the ImageMagick program we installed on our program, through the MiniMagick gem. This will allow us to resize the image.

该行使CarrierWave能够通过MiniMagick gem接触我们在程序上安装的ImageMagick程序。这将使我们能够调整图像的大小。

Unlocks image-resizing abilities such as resize_to_fill, resize_to_fit, resize_and_pad, and resize_to_limit.

解锁图像缩放能力，如resize_to_fill ， resize_to_fit ， resize_and_pad和resize_to_limit 。

Add this in app/uploaders/image_uploader.rb

将其添加到app/uploaders/image_uploader.rb

# Process files as they are uploaded:
process resize_to_fill: [800, 350]

集成Amazon S3进行视频上传 (Integrating Amazon S3 for Video Uploads)

安装 (Installation)

Add this line to your application’s Gemfile:

将此行添加到您的应用程序的Gemfile ：

gem 'carrierwave-aws'

Run the bundle command from your shell to install it:

从您的外壳运行bundle命令以安装它：

bundle install

步骤1：配置初始化程序 (Step 1: Configuring the Initializer)

Normally we would install our gem first, however to prevent bugs when switching from fog to AWS we need to update our initializer first.

通常，我们将首先安装我们的gem，但是为了防止从雾切换到AWS时出现错误，我们需要首先更新初始化程序。

You can read the details of how to configure the carrierwave-aws gem in the Usage Section of the Documentation. Following the pattern they specify, we should update config/initializers/carrierwave.rb to look like this:

您可以在“文档”的“用法”部分中阅读有关如何配置carrierwave-aws gem的详细信息。按照他们指定的模式，我们应该将config/initializers/carrierwave.rb更新为如下形式：

# config/initializers/carrierwave.rb
CarrierWave.configure do |config|
  config.storage    = :aws
  config.aws_bucket = ENV["AWS_BUCKET"]
  config.aws_acl    = "public-read"
  config.aws_credentials = {
      access_key_id:     ENV["AWS_ACCESS_KEY"],
      secret_access_key: ENV["AWS_SECRET_KEY"],
      region:            ENV["AWS_REGION"]
  }
end

Now save the file.

现在保存文件。

步骤2：更新Gemfile (Step 2: Updating our Gemfile)

Add the carrierwave-aws gem as described by the documentation. Edit the Gemfile to look like this:

按照文档中的说明添加carrierwave-aws宝石。编辑Gemfile如下所示：

gem 'carrierwave'gem 'mini_magick'gem 'carrierwave-aws'

Save the file and run the command to install the gem.

保存文件并运行命令以安装gem。

$ bundle install

Then restart your server.

然后重新启动服务器。

步骤3：将Region添加到application.yml (Step 3: Add Region to application.yml)

We need to add a region to our application.yml file. Open up your config/application.yml and add this line to specify the region we want to use:

我们需要在application.yml文件中添加一个区域。打开config/application.yml并添加以下行以指定我们要使用的区域：

# config/application.yml
AWS_ACCESS_KEY: "Your-access-key"
AWS_SECRET_KEY: "Your-secret-key"
AWS_BUCKET:     "Your-bucket"
AWS_REGION:     "us-east-1"

Save the file.

保存文件。

步骤4：更新上载器 (Step 4: Updating the Uploader)

If you remember from before, we specified inside the storage provider for the uploader to use :fog. Rather than that, we need to switch it to :aws.

如果您还记得以前，我们在存储提供程序内部指定了供上传者使用:fog 。与其相反，我们需要将其切换为:aws 。

# encoding: utf-8
class ImageUploader < CarrierWave::Uploader::Base
  # Include RMagick or MiniMagick support:
  # include CarrierWave::RMagick
  include CarrierWave::MiniMagick
  # Choose what kind of storage to use for this uploader:
  #storage :file
  storage :aws
  # A bunch more comments down here....
end

Save the file.

保存文件。

One more thing we will have to do is re-sync the localhost with heroku. To do this we need to run a simple command:

我们将要做的另一件事是将localhost与heroku重新同步。为此，我们需要运行一个简单的命令：

$ figaro heroku:set -e production

Make sure uploads continue to work by uploading an image for a course and make sure it goes through successfully.

通过上传课程的图像并确保其成功完成，来确保上传继续进行。

VideoJS (VideoJS)

Add css file before </head>

在</head>之前添加CSS文件

<link href="http://vjs.zencdn.net/5.12.6/video-js.css" rel="stylesheet">

Add JavaScript files before </body>

在</body>之前添加JavaScript文件

<script src="http://vjs.zencdn.net/5.12.6/video.js"></script>

<script src="http://vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js"></script>

Note: You must place the videoJS script tags in the bottom of the body otherwise you will have issues loading the video player because of Turbolinks.

注意：您必须将videoJS script标签放在主体底部，否则由于Turbolinks的缘故，在加载视频播放器时会遇到问题。

Thanks for reading! Hope this was helpful.

谢谢阅读！希望这会有所帮助。