A autenticação do usuário é um recurso de segurança essencial para aplicativos da Web, especialmente aqueles que lidam com dados confidenciais do usuário ou fornecem acesso restrito a determinadas funcionalidades. Ao exigir que os usuários se autentiquem antes de acessar o aplicativo, os desenvolvedores podem garantir que apenas usuários autorizados possam visualizar ou modificar os dados e a funcionalidade do aplicativo. O que é Devise? Devise é uma Ruby Gem que fornece autenticação de usuário e recursos de autorização para aplicativos Rails. Ele reduz o processo de adição de funcionalidade de inscrição, login e logout ao seu aplicativo sem ter que escrever tudo do zero. Possui recursos integrados, como redefinição de senha e confirmação de conta. Ele oferece suporte a várias estratégias de autenticação, como e-mail e senha, OAuth, OpenID e muito mais. O Devise possui uma documentação detalhada que abrange recursos básicos e avançados. Neste tutorial, construiremos um aplicativo rails simples com o Devise que permite aos usuários criar contas, entrar e sair de suas contas. Também abordaremos como adicionar estilo ao aplicativo usando o Bootstrap. Pré-requisitos Antes de iniciar este tutorial, você deve ter um bom entendimento dos fundamentos de Ruby e Rails. Além disso, você deve ter o seguinte software instalado em seu computador: Ruby: Se você não instalou o Ruby em sua máquina, você pode baixar a versão mais recente do site oficial . Site Ruby Ruby on Rails: você deve configurar seu ambiente de desenvolvimento local seguindo guia. os trilhos Node.js: Instalar para gerenciar o pipeline de ativos e executar o código JavaScript. Node.js Fio SQLite3 Um editor de texto como o Visual Studio Code Um navegador como o Google Chrome Também abordaremos como usar o Bootstrap no Rails 7 posteriormente no tutorial. Etapa 1: criar um novo aplicativo Rails Para criar um novo aplicativo rails, abra um terminal em seu diretório preferido e execute o comando: rails new authApp Isso irá gerar um novo aplicativo Rails chamado em um diretório . Abra este diretório em seu editor de texto preferido. authApp authApp Navegue até o diretório do aplicativo digitando: cd authApp Em seu terminal, inicie seu servidor Rails executando: rails server Abra em seu navegador para acessar a página de boas-vindas do Rails. http://127.0.0.1:3000/ Etapa 2: criar uma página de destino Gere um novo controlador que tratará a solicitação para o caminho raiz usando o comando: $rails generate controller home index Isso cria um novo controlador chamado `Home` com uma ação `index`. Adicione o caminho raiz ao arquivo na pasta 'config' adicionando a seguinte linha: routes.rb root 'home#index' No diretório , você encontrará um novo arquivo chamado . Essa exibição conterá o código HTML da sua página de destino. app/views/home index.html.erb Reinicie o servidor e verifique o em seu navegador da web para visualizar sua página inicial recém-criada. host local Passo 3: Instale e configure o Bootstrap Nesta seção, usaremos , que carregam JS. Primeiro, verifique se você tem mapas de importação instalados executando . Caso contrário, execute import maps cat config/importmap.rb rails importmap:install Em seguida, adicione Bootstrap 5 JS ao Rails por meio de mapas de importação: . Isso adiciona JS, bootstrap e popperjs a . $ bin/importmap pin bootstrap config/importmap.rb Importe o Bootstrap em usando . app/javascript/application.js import 'bootstrap'; Adicione ao seu Gemfile e execute . gem 'bootstrap', '~> 5.1.3' bundle install Em , importe Bootstrap usando e renomeie o arquivo para . app/assets/stylesheets/application.css @import "bootstrap"; application.scss Verifique se o arquivo contém: app/views/layouts/application.html.erb <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %> <%= javascript_importmap_tags %> Adicione estilos como preferir em seu arquivo . app/views/home/index.html.rb Recarregue o servidor e veja as alterações. Etapa 4: Instalar e configurar o Devise Navegue até o Gemfile e adicione a gem Devise usando o comando: gem 'devise', github: 'heartcombo/devise', branch: 'main' Execute para instalar o Devise. bundle install Execute para configurar o Devise em seu projeto. Isso gera vários arquivos iniciais para o Devise e fornece instruções no terminal. rails g devise:install Descomente a linha no arquivo . Isso adiciona turbo_stream como um formato de navegação, que é necessário para o Devise 4.9.2 funcionar com o Rails 7. Deixar de fazer isso resultará em um erro . config.navigational_formats = ['*/*', :html, :turbo_stream] devise.rb undefined method user_url Abra e adicione as seguintes linhas para aviso e mensagens de alerta: app/layouts/applications.html.erb <p class="notice"><%= notice %></p> <p class="alert"><%= alert %></p> Etapa 5: Criando um modelo de usuário com o Devise Para criar um modelo de usuário com o Devise, execute no terminal. Isso gerará os arquivos necessários e a configuração necessária para implementar a autenticação do usuário. rails g devise user Crie a tabela user executando o comando migration: . rails db:migrate Reinicie o servidor para carregar o novo arquivo inicializador do Devise e configure tudo para que a autenticação do usuário funcione. Vá para em seu navegador para acessar o formulário de inscrição para criar uma conta inserindo um e-mail e senha. http://localhost:3000/users/sign_up Navegue até o arquivo e adicione as seguintes linhas de código: index.html.erb <% if user_signed_in? %> <p>Welcome, <%= current_user.email %>!</p> <%= link_to "Sign out", destroy_user_session_path, method: :delete %> <% else %> <%= link_to "Sign in", new_user_session_path %> <% end %> Essas linhas criam links de inscrição, entrada e saída para seu aplicativo. é um método auxiliar fornecido pelo Devise que retorna true se o usuário atual estiver conectado e false caso contrário. user_signed_in Atualize sua página no navegador para revisar as alterações. Para revisar as alterações, basta atualizar a página em seu navegador. Se você ainda não fez login, haverá um botão de login visível na tela. Clique nele e conclua o processo de registro. Depois de se inscrever com sucesso, você será direcionado para a página inicial, onde poderá visualizar o endereço de e-mail do usuário conectado no momento, uma mensagem de boas-vindas e um botão de sair. Ao seguir essas etapas, você integrou com sucesso a gem Devise e configurou a autenticação do usuário para seu aplicativo. Conclusão Neste tutorial, usamos o Devise para adicionar autenticação de usuário ao nosso aplicativo Rails. Desenvolvemos um aplicativo onde os usuários podem criar contas, cadastrar e sair. Também integramos o Bootstrap para melhorar a aparência do projeto. Para expandir seu conhecimento sobre o Devise e explorar outros métodos e auxiliares, consulte o arquivo README no repositório GitHub do Devise.
