Project Name

Rails-Devise-Bootstrap

Overview

Create rails app with devise and bootstrap

System Requirements

Ruby 3.2.2
Rails 7.1.2
Devise 3.9.4 via (github: 'heartcombo/devise', branch: 'main')
Bootstrap 5.3.2

Use template to generate new project ready to run

Clone this repository and then follow these steps

Make sure running Rails 7.1.2
```
rails -v
```
Make sure running Ruby 3.2.2
```
ruby -v
```

Create a new Rails application

rails new -j esbuild -c bootstrap -m rails-devise-bootstrap/template.rb new_app_name

Reset things (otherwise logout doesn't work)

rm -rf public/assets; rake assets:clean; rake assets:precompile;

Start the server
```
rails s
```
Open your browser and go to mailcatcher
- localhost:1080
Open your browser and go to your app
- localhost:3000

Alternative: build manually from scratch

Setup and Installation

All steps necessary to recreate this repo using new rails app name of your choice. Resulting server is fully functional just like this repo. Repo has example commit after each step for user to see step by step changes made.

Create a new Rails application

rails new app_name -j esbuild -c bootstrap

Edit your Gemfile
- Make the following changes. Devise using main branch here, could result in newer version, for now this seems to be needed.
```
ruby "3.2.2"
gem "rails", "~> 7.1.2"
gem 'devise', github: 'heartcombo/devise', branch: 'main'
```
Install Devise Gem
```
 bundle install
```
Run Devise Generator
```
rails generate devise:install
```
Create a User model
```
 rails generate devise User
```
Edit the devise user model
- Add all the devise modules, except :omniauthable
```
 app/models/user.rb
```
Edit the devise user migration file
- Uncomment all the things
```
  db/migrate/datetimestamp_devise_create_users.rb
```

Create a database and run migrations

rails db:drop; rails db:create; rails db:migrate

Create a pages controller
```
 rails generate controller pages home
```
Edit the routes file
- replace
```
get 'pages/home'
```
- with this code
```
 root 'pages#home'
```

Edit the development environment file

Add this code to the bottom of the file

config.action_mailer.default_url_options = {
  host: "localhost",
  port: 3000
}
config.action_mailer.delivery_method = :smtp
config.action_mailer.smtp_settings = {
  address: "127.0.0.1",
  port: 1025
}

Edit views/layouts/application.html.erb

Add this code to the body, above the yield, (includes bootstrap classes)

<% flash.each do |name, msg| %>
  <% if msg.is_a?(String) %>
    <div class="alert <%= name == 'notice' ? 'alert-success' : 'alert-danger' %>">
      <%= content_tag :div, msg, id: "flash_#{name}" %>
    </div>
  <% end %>
<% end %>

Edit app/views/pages/home.html.erb

Add this code to the body, (includes bootstrap classes)

 <% if user_signed_in? %>
   <%= link_to "Edit profile", edit_user_registration_path, class: "btn btn-primary" %>
   <%= link_to "Logout", destroy_user_session_path, method: :delete, data: { turbo_method: :delete }, class: "btn btn-danger" %>
 <% else %>
   <%= link_to "Sign up", new_user_registration_path, class: "btn btn-success" %>
   <%= link_to "Login", new_user_session_path, class: "btn btn-secondary" %>
 <% end %>

Edit initializers/devise.rb

Uncomment the following line

 config.navigational_formats = ['*/*', :html, :turbo_stream]

Start your server
- Running it first this way, then other ok
- There is some issue where devise will not use turbo and call DELETE when logging out.
- Results in this error:
  - No route matches [GET] "/users/sign_out"
- May need to clear browser cache of cookies also
```
rm -rf public/assets; rake assets:clean; rake assets:precompile;  bin/dev
```
- This should work now. All functions of devise and bootstrap should work; sign up, confirm email, sign in, sign out, edit profile, forgot password, etc.
```
rails s
```
Configure mailcatcher
```
gem install mailcatcher
```
Start your mail server
```
mailcatcher
```
Open your browser and go to mailcatcher
- localhost:1080
Open your browser and go to your app
- localhost:3000

This repo contains example code resulting from following these steps, either using the template or manually.

Thank You

There you have it, a fully functional rails app with devise and bootstrap.
I hope this helps someone.
Send me a note to email

kevinhobbs/rails-devise-bootstrap