# Rails 超方便會員系統套件 devise ###### tags: `Rails` 記得在一開始學Rails時,在手刻會員系統這塊花了非常多時間學習,畢竟包含了MVC彼此間的互動、甚至還要有session的、初階的資料加密觀念等。[這裡有基礎教學](https://www.youtube.com/watch?v=wkNR1hG4yOk&list=PLm8ctt9NhMNV75T9WYIrA6m9I_uw7vS56&ab_channel=GoRails) 有了基礎觀念打底後,在實作上我們可以使用「devise」這個套件,直接幫我們生成會員系統,除了基本的註冊功能外,甚至連edit、log_out的頁面都做好了,真是感謝這群佛心的大大們,那我們就直接開始安裝吧。 ## Step1: 安裝devise 首先先到devise的git-hub https://github.com/heartcombo/devise#getting-started 照著流程走到rails generate devise MODEL 這裡的MODEL是placeholder,我們可以視專案內容來調整,這邊我把它改成User 接著我們就可以把相關資料建成資料庫了 rails db:migrate ## Step2: devise幫我們做了什麼 在安裝的時候我們可以發現終端機上的訊息 ``` invoke active_record create db/migrate/20211214003127_devise_create_users.rb create app/models/user.rb invoke rspec create spec/models/user_spec.rb invoke factory_bot create spec/factories/users.rb insert app/models/user.rb route devise_for :users ``` devise除了幫我們建立migration檔案之外,還幫我們建立好了route  而且我們試著在網址列輸入(http://localhost:3000/users/sign_up),發現裡面竟然已經有內容了!!雖然外觀略顯陽春,但裡面的欄位都是可以輸入跟提交的。 有了devise的加持,美觀的部分就交給我們自己完成吧! ### Step3: 客製化devise的view畫面 Rails的專案中View是主要放各個action對應到的HTML畫面,但在devise建立資料表的過程中,並沒有一起建立view的資料,所以我們要利用終端機客製化我們的外觀,這裡有官方文件介紹。 https://github.com/heartcombo/devise#getting-started ``` $ rails generate devise:views ``` 這時會發現devise長出好多東西給我們 ``` invoke Devise::Generators::SharedViewsGenerator create app/views/devise/shared create app/views/devise/shared/_error_messages.html.erb create app/views/devise/shared/_links.html.erb invoke form_for create app/views/devise/confirmations create app/views/devise/confirmations/new.html.erb create app/views/devise/passwords create app/views/devise/passwords/edit.html.erb create app/views/devise/passwords/new.html.erb create app/views/devise/registrations create app/views/devise/registrations/edit.html.erb create app/views/devise/registrations/new.html.erb create app/views/devise/sessions create app/views/devise/sessions/new.html.erb create app/views/devise/unlocks create app/views/devise/unlocks/new.html.erb invoke erb create app/views/devise/mailer create app/views/devise/mailer/confirmation_instructions.html.erb create app/views/devise/mailer/email_changed.html.erb create app/views/devise/mailer/password_change.html.erb create app/views/devise/mailer/reset_password_instructions.html.erb create app/views/devise/mailer/unlock_instructions.html.erb ``` 接著就可以去 app/views/devise/sessions/new.html.erb app/views/devise/registrations/new.html.erb 修改我們的註冊以及登入畫面
×
Sign in
Email
Password
Forgot password
or
By clicking below, you agree to our
terms of service
.
Sign in via Facebook
Sign in via Twitter
Sign in via GitHub
Sign in via Dropbox
Sign in with Wallet
Wallet (
)
Connect another wallet
New to HackMD?
Sign up