songtianlun/sample_rails_tailwind
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add user registration functionality

Browse Source 
- Implement user creation in UsersController
- Add user registration form in new.html.erb
- Create error messages partial for form validation
- Add gravatar helper for user profile
- Update routes to include resources for users
- Introduce integration tests for signup validation

This commit establishes the foundation for user registration, allowing users to sign up with their details and providing feedback on form errors. It enhances the user experience by integrating visual elements like gravatars and error messages.
This commit is contained in:
songtianlun 2024-12-31 16:34:52 +08:00
parent cd558466be
commit 9fac43f46d
10 changed files with 212 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app/assets/stylesheets/application.scss
View File

@ -13,6 +13,5 @@
*= require_self *= require_self
*/ */
@import "bootstrap-sprockets";
@import "bootstrap";

93
app/assets/stylesheets/custom.scss
View File

@ -1,3 +1,7 @@
@import "bootstrap-sprockets";
@import "bootstrap";
/* color */ /* color */
$light-gray: #777; $light-gray: #777;
@ -60,9 +64,9 @@ p {
} }
} }
img { //img {
display: none; // display: none;
} //}
/* footer */ /* footer */
footer { footer {
@ -89,3 +93,86 @@ footer {
} }
} }
/* mixins, variables, etc. */
$gray-medium-light: #eaeaea;
@mixin box_sizing {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/* miscellaneous */
.debug_dump {
clear: both;
float: left;
width: 100%;
margin-top: 45px;
@include box-sizing;
}
/* sidebar */
aside {
section.user_info {
margin-top: 20px;
}
section {
padding: 10px 0;
margin-top: 20px;
&:first-child {
border: 0;
padding-top: 0;
}
span{
display: block;
margin-bottom: 3px;
line-height: 1;
}
h1 {
font-size: 1.4em;
text-align: left;
letter-spacing: -1px;
margin-bottom: 3px;
margin-top: 0;
}
}
}
.gravatar {
float: left;
margin-right: 10px;
}
.gravatar_edit {
margin-top: 15px;
}
/* forms */
input, textarea, select, .uneditable-input {
border: 1px solid #bbb;
width: 100%;
margin-bottom: 15px;
@include box_sizing;
}
input {
height: auto !important;
}
/* forms */
#error_explanation {
color: red;
ul {
color: red;
margin: 0 0 30px 0;
}
}
.field_with_errors {
@extend .has-error;
.form-control {
color: $state-danger-text;
}
}

24
app/controllers/users_controller.rb
View File

@ -1,4 +1,28 @@
class UsersController < ApplicationController class UsersController < ApplicationController
def show
@user = User.find(params[:id])
# debugger
end
def new def new
@user = User.new
# debugger
end
def create
@user = User.new(user_params)
if @user.save
flash[:success] = "Welcome to the Sample App!"
redirect_to @user
# redirect_to user_url(@user)
else
render 'new'
end
end
private
def user_params
params.require(:user).permit(:name, :email, :password,
:password_confirmation)
end end
end end

5
app/helpers/users_helper.rb
View File

@ -1,2 +1,7 @@
module UsersHelper module UsersHelper
def gravatar_for(user, size: 80)
gravatar_id = Digest::MD5.hexdigest(user.email.downcase)
gravatar_url = "https://secure.gravatar.com/avatar/#{gravatar_id}?s=#{size}"
image_tag(gravatar_url, alt: user.name, class: "gravatar")
end
end end

9
app/views/layouts/application.html.erb
View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<!-- <title><%#= content_for(:title) || "Sample App" %></title>--> <!-- <title><%#= content_for(:title) || "Sample App" %></title>-->
<title><%= full_title(yield(:title)) %></title> <title><%= full_title(yield(:title)) %></title>
@ -10,8 +10,15 @@
<body> <body>
<%= render 'layouts/header' %> <%= render 'layouts/header' %>
<div class="container"> <div class="container">
<% flash.each do |message_type, message| %>
<%= content_tag(:div, message, class: "alert alert-#{message_type}") %>
<!-- <div class="alert alert-<%#= message_type %>"><%#= message %></div>-->
<% end %>
<%= yield %> <%= yield %>
<%= render 'layouts/footer' %> <%= render 'layouts/footer' %>
<%#= debug(params) if Rails.env.development? %>
<%= debug(params.to_yaml) if Rails.env.development? %>
<%= debug(Time.now) if Rails.env.development? %>
</div> </div>
</body> </body>
</html> </html>

12
app/views/shared/_error_messages.html.erb Normal file
View File

@ -0,0 +1,12 @@
<% if @user.errors.any? %>
<div id="error_explanation">
<div class="alert alert-danger">
The form contains <%= pluralize(@user.errors.count, "error") %>.
</div>
<ul>
<% @user.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
<% end %>

23
app/views/users/new.html.erb
View File

@ -1,3 +1,24 @@
<% provide(:title, 'Sign up') %> <% provide(:title, 'Sign up') %>
<h1>Sign up</h1> <h1>Sign up</h1>
<p>This will be a signup page for new users.</p>
<div class="row">
<div class="col-md-6 col-md-offset-3">
<%= form_with(model: @user, local: true) do |f| %>
<%= render 'shared/error_messages' %>
<%= f.label :name %>
<%= f.text_field :name, class: 'form-control' %>
<%= f.label :email %>
<%= f.email_field :email, class: 'form-control' %>
<%= f.label :password %>
<%= f.password_field :password, class: 'form-control' %>
<%= f.label :password_confirmation, "Confirmation" %>
<%= f.password_field :password_confirmation, class: 'form-control' %>
<%= f.submit "Create my account", class: "btn, btn-primary" %>
<% end %>
</div>
</div>

12
app/views/users/show.html.erb Normal file
View File

@ -0,0 +1,12 @@
<%provide(:title, @user.name) %>
<div class="row">
<aside class="col-md-4">
<section class="user_info">
<h1>
<%= gravatar_for @user %>
<%= @user.name %>
</h1>
</section>
</aside>
</div>

15
config/routes.rb
View File

@ -1,16 +1,19 @@
Rails.application.routes.draw do Rails.application.routes.draw do
get "users/new" # get "users/new"
get "static_pages/home" # get "static_pages/home"
get "static_pages/help" # get "static_pages/help"
get "static_pages/about" # get "static_pages/about"
get "static_pages/contact" # get "static_pages/contact"
root "static_pages#home"
get '/help', to: 'static_pages#help' get '/help', to: 'static_pages#help'
get '/about', to: 'static_pages#about' get '/about', to: 'static_pages#about'
get '/contact', to: 'static_pages#contact' get '/contact', to: 'static_pages#contact'
get '/signup', to: 'users#new' get '/signup', to: 'users#new'
root "static_pages#home" resources :users
# Define your application routes per the DSL in https://guides.rubyonrails.org/routing.html # Define your application routes per the DSL in https://guides.rubyonrails.org/routing.html
# Reveal health status on /up that returns 200 if the app boots with no exceptions, otherwise 500. # Reveal health status on /up that returns 200 if the app boots with no exceptions, otherwise 500.

29
test/integration/users_signup_test.rb Normal file
View File

@ -0,0 +1,29 @@
require "test_helper"
class UsersSignupTest < ActionDispatch::IntegrationTest
test "invalid signup information" do
get signup_path
assert_no_difference 'User.count' do
post users_path, params: { user: { name: "",
email: "user@invalid",
password: "foo",
password_confirmation: "bar" } }
end
assert_template 'users/new'
assert_select 'div#error_explanation'
assert_select 'div.alert-danger'
end
test "valid signup information" do
get signup_path
assert_difference 'User.count', 1 do
post users_path, params: { user: {name: "Example User",
email: "user@example.com",
password: "password",
password_confirmation: "password" } }
end
follow_redirect!
assert_template 'users/show'
assert_not flash.notice
end
end