才华横溢 form 案例教学
cd workspace
rails new form
cd form
git init
git status
git add .
git commit -m "initial commit"
git remote add origin https://github.com/shenzhoudance/form.git
git push -u origin master
rails server
git checkout -b posts
rails g model post title:string content:text
rake db:migrate
rails g controller posts
rails server
config/routes.rb
---
Rails.application.routes.draw do
resources :posts
root 'posts#index'
end
---
app/controllers/posts_controller.rb
---
class PostsController < ApplicationController
def index
end
end
---
app/views/posts/index.html.erb
---
<h1>欢迎来到才华横溢的世界</h1>
---
rake routes
rails server
git status
git add .
git commit -m "add post model & controller & index"
git push origin posts
git checkout -b gem
https://rubygems.org/
gem 'haml', '~> 5.0', '>= 5.0.4'
gem 'bootstrap-sass', '~> 3.3', '>= 3.3.7'
gem 'simple_form', '~> 3.5', '>= 3.5.1'
gem 'devise', '~> 4.4', '>= 4.4.3'
bundle install
rails generate simple_form:install --bootstrap
app/views/posts/index.html.haml
---
%h1 欢迎来到才华横溢的世界
app/assets/stylesheets/application.css.scss
---
@import “ bootstrap-sprockets ”;
@import “ bootstrap ”;
---
app/assets/javascripts/application.js
---
//= require bootstrap-sprockets
//= require turbolinks
app/controllers/posts_controller.rb
---
class PostsController < ApplicationController
before_action :find_post, only: [:show, :edit, :update, :destroy]
def index
@posts = Post.all.order("created_at DESC")
end
def show
end
def new
@post = Post.new
end
def create
@post = Post.new(post_params)
if @post.save
redirect_to @post
else
render 'new'
end
end
def edit
end
def update
if @post.update(post_params)
redirect_to @post
else
render 'edit'
end
end
def destroy
@post.destroy
redirect_to root_path
end
private
def find_post
@post = Post.find(params[:id])
end
def post_params
params.require(:post).permit(:title, :content)
end
end
app/views/posts/_form.html.haml
---
= simple_form_for @post do |f|
= f.input :title
= f.input :content
= f.submit
---
app/views/posts/new.html.haml
---
%h1 New Post
= render 'form'
---
app/views/posts/edit.html.haml
---
%h1 Edit Post
= render 'form'
= link_to "Cancel", post_path
---
app/views/posts/show.html.haml
---
%h1= @post.title
%p= @post.content
= link_to "Edit", edit_post_path(@post), class: "button"
= link_to "Delete", post_path(@post), method: :delete, data: { confirm: "Are you sure you want to do this?" }, class: "button"
---
app/views/posts/index.html.haml
---
- @posts.each do |post|
.post
%h2.title= link_to post.title, post
%p.date
Published at
= time_ago_in_words(post.created_at)
= link_to "New Post", new_post_path, class: "btn btn-default btn-lg"
---
git checkout -b devise
rails generate devise:install
rails g devise:views
rails generate devise user
rake db:migrate
---
git status
git commit -m "add devise user"
git push origin devise
---
rails server
http://localhost:3000/users/sign_up
app/controllers/posts_controller.rb
---
class PostsController < ApplicationController
before_action :find_post, only: [:show, :edit, :update, :destroy]
before_action :authenticate_user!, except: [:index, :show]
def index
@posts = Post.all.order("created_at DESC")
end
def show
end
def new
@post = current_user.posts.build
end
def create
@post = current_user.posts.build(post_params)
---
app/models/post.rb
---
class Post < ApplicationRecord
belongs_to :user
end
---
app/models/user.rb
---
class User < ApplicationRecord
devise :database_authenticatable, :registerable,
:recoverable, :rememberable, :trackable, :validatable
has_many :posts
end
rails g migration add_user_id_to_posts user_id:integer
rake db:migrate
rails c
2.3.1 :001 > @post = Post.first
2.3.1 :002 > @post = Post.last
2.3.1 :003 > @post.user_id = 1
2.3.1 :004 > @post.save
2.3.1 :005 > @post = Post.find(3)
2.3.1 :006 > @post.user_id = 1
2.3.1 :007 > @post.save
2.3.1 :007 > exit
---
git status
git add .
git commit -m "add user find post"
git push origin devise
git checkout -b nav-style
app/assets/stylesheets/application.css.scss
---
@import "bootstrap-sprockets";
@import "bootstrap";
body {
font-family: 'Lato', sans-serif;
background: #EDEFF0;
}
.wrapper {
width: 60%;
max-width: 1140px;
margin: 0 auto;
}
.clearfix:before, .clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
.main_header {
width: 100%;
margin: 0 auto;
background: white;
#logo {
float: left;
a {
line-height: 60px;
text-transform: uppercase;
font-weight: 700;
letter-spacing: -1px;
font-size: 1.8rem;
text-decoration: none;
color:#397CAC;
}
}
#buttons {
float: right;
a {
line-height: 60px;
background: #397CAC;
padding: .5em 1em;
border-radius: 0.2em;
color: white;
text-decoration: none;
font-weight: 100;
}
}
}
#posts {
background: white;
padding: 2em 5%;
border-radius: .5em;
.post {
margin: 1em 0;
padding: 1em 0;
border-bottom: 1px solid #D1d1d1;
.title {
margin: 0;
a {
color: #397CAC;
text-decoration: none;
font-weight: 100;
font-size: 1.25rem;
}
}
.date {
margin-top: .25rem;
font-size: 0.9rem;
color: #B2BAC2;
}
}
}
.button {
color: #397CAC;
border: 1px solid #397CAC;
padding: .5em 1em;
border-radius: 0.2em;
text-decoration: none;
margin-right: 2%;
}
#post_content {
background: white;
padding: 2em 5%;
border-radius: .5em;
h1 {
font-weight: 100;
font-size: 2em;
color: #397CAC;
margin-top: 0;
}
p {
color: #B2BAC2;
font-size: 0.9rem;
font-weight: 100;
line-height: 1.5;
}
}
---
app/views/layouts/application.html.haml
---
!!!
%html
%head
%title XiaoWei Forum
= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true
%link{ rel: "stylesheet", href: "http://fonts.googleapis.com/css?family=Lato:300,400,700", type: "text/css"}
%link{:rel => "stylesheet", :href => "http://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.1/normalize.min.css"}/
= javascript_include_tag 'application', 'data-turbolinks-track' => true
= csrf_meta_tags
%body
%header.main_header.clearfix
.wrapper
#logo
%p= link_to "XiaoWei Forum", root_path
#buttons
- if user_signed_in?
= link_to "New Post", new_post_path
- else
= link_to "Sign Up", new_user_registration_path
= link_to "Sign In", new_user_session_path
.wrapper
%p.notice= notice
%p.alert= alert
.wrapper
= yield
---
git checkout -b model_comment
rails g model Comment comment:text post:references user:references
rake db:migrate
rails g controller Comments
app/models/post.rb
---
class Post < ApplicationRecord
belongs_to :user
has_many :comments
end
---
app/models/user.rb
---
class User < ApplicationRecord
devise :database_authenticatable, :registerable,
:recoverable, :rememberable, :trackable, :validatable
has_many :posts
has_many :comments
end
---
app/controllers/comments_controller.rb
rails c
Comment
Comment.connection
Comment
Comment.last
Comment.last
@comment.user_id = 1
@comment = save
@comment
Comment.last
User
Post
@comment = comment.all
@comment.destroy
Comment.all
Comment.destroy_all