Welcome back to our blog series on building a project management app with Ruby on Rails 7 and ChatGPT integration! In this post, we'll add user authentication to protect our project briefings and project plans, improve the user interface, and deploy our application.
Step 1: Protecting Project Briefings and Project Plans with User Authentication
Add before_action :authenticate_user! to both ProjectBriefingsController and ProjectPlansController to ensure only authenticated users can access the application:
class ProjectBriefingsController < ApplicationController before_action :authenticate_user! # ... end class ProjectPlansController < ApplicationController before_action :authenticate_user! # ... end
Step 2: UI Improvements
To improve the user interface, we'll use Bootstrap, a popular CSS framework. Add the Bootstrap gem to your Gemfile and run bundle install:
gem 'bootstrap', '~> 5.3'
Run the Bootstrap generator:
rails generate bootstrap:install
Now, you can update the views with Bootstrap components and classes to enhance the overall appearance and usability of the application.
For example, you can add a navigation bar to your app/views/layouts/application.html.erb:
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid">
<a class="navbar-brand" href="/">ChatGPT Project Management</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<%= link_to 'Project Briefings', project_briefings_path, class: 'nav-link' %>
</li>
<li class="nav-item">
<%= link_to 'Project Plans', project_plans_path, class: 'nav-link' %>
</li>
</ul>
<% if user_signed_in? %>
<span class="navbar-text">
<%= "Signed in as #{current_user.email}" %>
</span>
<%= link_to 'Sign Out', destroy_user_session_path, method: :delete, class: 'btn btn-outline-danger ms-2' %>
<% else %>
<%= link_to 'Sign In', new_user_session_path, class: 'btn btn-outline-primary me-2' %>
<%= link_to 'Sign Up', new_user_registration_path, class: 'btn btn-primary' %>
<% end %>
</div>
</div>
</nav>Update your views, forms, and tables with Bootstrap classes to create a consistent and responsive design.
Step 3: Deploying the Application
There are many ways to deploy a Rails application, but in this post, we'll focus on deploying to AWS using a virtual machine (EC2) and a Docker container (ECS).
Option 1: Deploying to an AWS EC2 Instance
- Create a new EC2 instance with Amazon Linux 2.
- Install the necessary dependencies, such as Ruby, Node.js, Yarn, and PostgreSQL.
- Set up your Rails environment, including environment variables, secrets, and database configuration.
- Clone your application repository and install the required gems.
git clone <your_repository_url> cd <your_project_name> bundle install
5. Compile your assets and run the database migrations.
RAILS_ENV=production rails assets:precompile RAILS_ENV=production rails db:migrate
6. Install and configure a web server like Nginx or Apache to serve your Rails application.
7. Set up a reverse proxy to forward requests to your Rails application, which can be served using Puma or Unicorn.
8. Configure your web server to start automatically on boot, and start your Rails application.
Option 2: Deploying to AWS ECS using Docker
- Create a Dockerfile in your project root directory.
FROM ruby:2.7.5 RUN apt-get update -qq && apt-get install -y nodejs postgresql-client RUN gem install bundler RUN mkdir /myapp WORKDIR /myapp COPY Gemfile /myapp/Gemfile COPY Gemfile.lock /myapp/Gemfile.lock RUN bundle install COPY . /myapp # Add a script to be executed every time the container starts. COPY entrypoint.sh /usr/bin/ RUN chmod +x /usr/bin/entrypoint.sh ENTRYPOINT ["entrypoint.sh"] EXPOSE 3000 # Start the main process. CMD ["rails", "server", "-b", "0.0.0.0"]
2. Create an entrypoint.sh script in your project root directory.
#!/bin/bash set -e # Ensure the PostgreSQL server is available before proceeding. # Replace "db" with the hostname of your database container or server. until PGPASSWORD=$DATABASE_PASSWORD psql -h "db" -U "$DATABASE_USERNAME" -c '\q'; do >&2 echo "PostgreSQL is unavailable - sleeping" sleep 1 done >&2 echo "PostgreSQL is up - executing command" exec "$@"
3. Build your Docker image.
docker build -t myapp .
4. Push your Docker image to an AWS ECR repository.
5. Create an ECS task definition, service, and cluster to run your Docker container.
6. Configure an Application Load Balancer to route traffic to your ECS service.
7. Set up environment variables, secrets, and database configuration in the ECS task definition.
With either deployment option, your Rails application with ChatGPT integration should now be up and running in a production environment. Make sure to monitor your application for performance and security, and optimize it as necessary.
That's it for this blog series! We've built a project management app with Ruby on Rails 7 and integrated it with ChatGPT using the OpenAI API. We've also added user authentication, made UI improvements, and deployed the app to AWS. We hope this series has been helpful and inspires you to create more amazing applications!