rails实战笔记
rails+bootstrap搭建求职/招聘网站准备工作 新建项目
环境：windows/ubuntu + rails6 + ruby2.7
目前更新至：devise的使用
新建一个rails项目：
rails new 项目名
新建一个用于测试的控制器：
rails g controller Test test --no-stylesheets
引入bootstrap相关包
安装bootstrap-sass 方法一：
在
gemfile中写入：gem 'bootstrap-sass'
gem 'jquery-rails'
gem 'sass-rails' # 如果没有'sass-rails'也需引入这个包
然后进行
bundle install方法二：
在项目目录下启动终端，运行
gem install bootstrap-sass，然后将gem 'bootstrap-sass'写入gemfile中，如果没有jquery-rails和sass-rails，也用同样的方法安装。引入bootstrap-sass 将
app/assets/stylesheets/application.css的后缀改为scss，然后删除 ：*= require_self
*= require_tree
加入：
@import "bootstrap-sprockets";
@import "bootstrap";
app/javascript/packs/application.js中加入：//= require jquery
//= require bootstrap-sprockets
测试 在
app/views/test/test.html.erb中写入：Test#test
Find me in app/views/test/test.html.erb
运行
rails s，可以在127.0.0.1:3000/test/test看到下图，则说明成功引入相关包。
文章图片
引入jquery
安装jquery
yarn add jquery
在
config/webpack/environment.js中添加：const { environment } = require('@rails/webpacker')var webpack = require('webpack');
environment.plugins.append( 'Provide',
new webpack.ProvidePlugin({
$: 'jquery',
})
)module.exports = environment
测试 在
app/javascript/packs/application.js中添加:$(document).on('turbolinks:load', function(){
$("#test_btn").click(function(){
alert($("#test").val());
});
});
运行后点击
点我按钮即可看到弹出弹窗。
文章图片
参考资料
Ruby on Rails 引入 bootstrap
Rails 在 Rails 6 中使用 jQuery 和 Bootstrap
devise的使用 参考资料
【rails实战】rails + devise 用户注册登录及权限判断
devise官方文档
推荐阅读
- ui|云计算会杀死开源吗（）
- 学习笔记|【极客blog图文讲解】ruby以及Jekyll的环境配置（针对mac linux）
- Java|＂ruby on rails＂ with ＂ajax＂
- Ruby|mac下超好用的终端--iterm2用法与技巧
- Ruby|Ubuntu下搭建 ruby环境
- Ruby|ROR no such file to load -- sqlite3 解决方法
- Ruby|Ruby中的require、load以及include
- Ruby|Docker启动后无法连接