Rails7英语学习项目从零开始原创邦

Rails7英语学习项目从零开始

学习资料：
https://guides.rubyonrails.org/
https://api.rubyonrails.org/
数据库
pg
redis
编辑器： vim
操作系统：ubuntu 18.04.2 LTS

参考项目:
https://www.bearer.com/blog/how-to-build-modals-with-hotwire-turbo-frames-stimulusjs
hotwire-rails停掉了
https://github.com/hotwired/hotwire-rails
This gem was aggregating the dependencies of Turbo and Stimulus, but offered nothing else. Aggregating dependencies is not enough value, so this gem is now deprecated. Please use the underlying frameworks directly. See https://github.com/hotwired/turbo-rails and https://github.com/hotwired/stimulus-rails

说明:
js通过importmap引入
css还是通过资源管道asset pipe

整体流程
一、创建项目
rails new delitao
Rails 7 新功能和特性查看

1.1 javascript
如果没有config/importmap.rb

bin/rails importmap:install

通过importmaps增加bootstrap5

bin/importmap pin bootstrap

rails turbo:install stimulus:install

# config/importmap.rb:

pin "application", preload: true
pin "bootstrap", to: "https://ga.jspm.io/npm:bootstrap@5.1.3/dist/js/bootstrap.esm.js"
pin "@popperjs/core", to: "https://ga.jspm.io/npm:@popperjs/core@2.11.5/lib/index.js"
pin "@hotwired/stimulus", to: "stimulus.min.js", preload: true
pin "@hotwired/stimulus-loading", to: "stimulus-loading.js", preload: true
pin_all_from "app/javascript/controllers", under: "controllers"
pin "@hotwired/turbo-rails", to: "turbo.min.js", preload: true

1.2 CSS
gem 'bootstrap', '~> 5.1.3'
app/assets/stylesheets/application.scss 这个后缀不能是css,也不能存在css后缀的application.css
//add
// if you want to change some variables:
$primary: #c11;
@import "bootstrap";

1.3 Layout

<%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>   <%# this loads Sprockets/Rails asset pipeline %>
<%= javascript_importmap_tags %> <%#  this loads JS from importmaps %>

1.4 修改Gemfile

gem ‘pg'  # 删除gem "sqlite3", "~> 1.4"
gem 'slim-rails'  # 根据个人喜好添加

1.5 创建数据库

cofig/database.yml
default: &default
  adapter: postgresql
  encoding: unicode
  # For details on connection pooling, see Rails configuration guide
  # http://guides.rubyonrails.org/configuring.html#database-pooling
  pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
  host: 127.0.0.1
  port: 5432

development:
  <<: *default
  database: iji_development
  user: postgres
  password: 1×××mima
。。。。

创建database

rails db:prepare

初期修改一些数据库，重置可用这个一条命令

rails db:drop && rails db:prepare

rails db:drop && rails db:create && rails db:migrate && rails db:seed

1.6 前端包(按需安装)
# https://github.com/rails/requestjs-rails
# https://gorails.com/episodes/rails-requestjs
Rails Request.JS encapsulates the logic to send by default some headers that are required by rails applications like the X-CSRF-Token.
封装了逻辑发送默认的headers是rails应用程序需要的比如：X-CSRF-Token。算是rails专用的http request包，省不少事，值得推荐！！！

./bin/rails requestjs:install

二、创建第一个Story + RSpec测试

1.turbo_stream_from 异步同步到所有客户端

2.turbo_frame_tag: 多个view页面下相同的 turbo_frame_tag名字的内容，在请求到该页面的时候，只返回 turbo_frame_tag包含的那一部分内容，并替换掉现有的那部分内容。
When the user will click on the Edit this todo link, as direct response to this direct user interaction, the turbo frame will be replaced with the one in the edit.html.erb page automatically.

三、初始化线上环境，并发布上线
服务器和系统准备：初始化项目,域名
Add these to Gemfile

group :development do
  # Deploy with Capistrano
  gem 'capistrano', '~>3.14',  require: false
  gem 'capistrano-rails', '~>1.6'
  gem 'capistrano-rvm', require: false
  gem 'capistrano-bundler', require: false
  gem 'capistrano3-puma', require: false
end

> bundle exec cap install

配置puma作为应用服务器，由OS管理启动。

发布：
cap production deploy

四、创建第n个story->实现 + RSpec
1. 用户邮箱注册登录, gem ’devise‘, https://betterprogramming.pub/devise-auth-setup-in-rails-7-44240aaed4be ；

rails g devise:install
rails g devise user

增加role角色和role的索引

2. 创建一个topic（对话）has many posts ，对话顺序，topic has 标题，描述，对话角色，关键字，作者, post has 角色: 内容，表情emotion (2022.5.23)
3. 为减轻前期开发压力，暂时不设计用户录入界面，有内容后，通过脚本直接导入到后台。 (2022.5.23)
3.1 增加一个后台管理Gem administrate。https://administrate-demo.herokuapp.com/getting_started (2022.5.23)
4. 设计页面
4.1 选择一个好的参考布局，自适应布局，手机优先。
4.2 分页(gem pagy)
5. 注销链接的写法：<%= link_to "注销", destroy_user_session_path, data: { turbo_method: :delete }, class: "nav-link" %>，以前的老代码method: :delete 要改，如果新的写法没有生效，那是没有安装turbo_rails: rails turbo:install （finished 2022.5.28）
6. story: 导入英语脚本，手动/自动翻译中文。

五、发布，返回第四步

六、运营
=======================
Tips
sudo: no tty present and no askpass program specified
@cvandermeer could you share how you fixed the issue?
I had exactly the same issue and setting pty to true didn't make it work (it prompted for password but then got stuck)
At the moment I set my deploy user as:

deploy         ALL=(ALL)       NOPASSWD: ALL

But that is less than ideal.
I would appreciate knowing if you found any other solution that worked for you.
(这是一种不安全的设置)
由于帐号并没有开启免密码导致的

假设当前帐号为abc

切换到root下

1 打开sudoers

vi /etc/sudoers

2 添加免密码

abc ALL = NOPASSWD: ALL

=========================

hw@t4:~$ rvm list

ruby-2.6.3 [ x86_64 ]
=> ruby-3.1.2 [ x86_64 ]

# Default ruby not set. Try 'rvm alias create default <ruby>'.

# => - current
# =* - current && default
# * - default

hw@t4:~$ rvm alias create default 3.1.2
Creating alias default for ruby-3.1.2....
hw@t4:~$ rvm list
ruby-2.6.3 [ x86_64 ]
=* ruby-3.1.2 [ x86_64 ]
=========================

Because partials are shared code, it is best practice that they do not depend on specific instance variables set by a controller action. Instead, we will pass the article to the partial as a local variable. A partial's filename must be prefixed with an underscore, e.g. _form.html.erb. But when rendering, it is referenced without the underscore, e.g. render "form".

<div>
    <%= form.label :body %><br>
    <%= form.text_area :body %><br>
    <% @article.errors.full_messages_for(:body).each do |message| %>
      <div><%= message %></div>
    <% end %>
  </div>

hw@hw-s:~/codes/blog$ rails turbo:install
You must either be running with node (package.json) or importmap-rails (config/importmap.rb) to use this gem.
hw@hw-s:~/codes/blog$ bin/rails importmap:install
Add Importmap include tags in application layout
      insert  app/views/layouts/application.html.erb
Create application.js module as entrypoint
      create  app/javascript/application.js
Use vendor/javascript for downloaded pins
      create  vendor/javascript
      create  vendor/javascript/.keep
Ensure JavaScript files are in the Sprocket manifest
      append  app/assets/config/manifest.js
Configure importmap paths in config/importmap.rb
      create  config/importmap.rb
Copying binstub
      create  bin/importmap
hw@hw-s:~/codes/blog$ rails turbo:install
Import Turbo
      append  app/javascript/application.js
Pin Turbo
      append  config/importmap.rb
Run turbo:install:redis to switch on Redis and use it in development for turbo streams

=========================

阅读量: 1624
发布于: 2022-01-01
修改于: 2024-01-30