60.004 - Service Design Studio 2024

DBS DocCheck Team 07

A joint collaboration between SUTD, DBS and Google

Design Workbook. Google Site. App Website

Table of Contents

• Project Overview
• Technologies and Dependencies
• Getting Started
  • Prerequesites
  • Installations
  • Frontend
  • Backend
  • Database
  • Deployment
  • Testing

Project Overview

This project aims to make the process of DBS credit card application foolproof such that customers who are not Singapore Citizen/PR submits the correct documents on the first try to reduce the need for DBS Operations team to send back applications.

Technologies and Dependencies

• Ruby On Rails, Ruby version 3.3.1 (Frontend framework)
• Flask, Python 3, pip (Backend framework)
• Google Cloud SDK (Database deployment)
• PostgreSQL
• Docker

Getting Started

Prerequisites

Before beginning this project, please ensure that you have the following installed:

• Ruby: Installation guide
• Python: Installation guide
• PostgreSQL: Installation guide
• Google Cloud SDK: Installation guide
• Docker: Installation guide
• Recommended: Github Desktop

Installations

git clone https://github.com/icedbeancat/1d-final-project-summer-2024-sds-2024-team-07.git

Frontend

Our Frontend utilises the Ruby On Rails framework. To run the Frontend:

1. Go to the Frontend directory

   cd ./Frontend/

2. Install dependencies

   bundle install

3. Run local host

   bundle exec rails s

Backend

Our Backend utilises Python Flask. To run the Backend:

1. Go to the Backend directory

   cd./Backend/

2. Install virtualenv (if not already installed) and set up virtual environment

   pip install virtualenv
   python3 -m venv myenv
   source myenv/bin/activate
   pip install -r ./requirements.txt
   pip install --upgrade google-generativeai google-cloud-aiplatform
   pip freeze > requirements.txt

3. Run the flask app

   flask run

Database

This section will show how PostgreSQL database is deployed to Google Cloud Platform (GCP). For development and test environments, SQLite 3 is used.

Ensure that you have:

• A Google Cloud account
• Google Cloud SDK installed

1. Create a new project on GCP

   • Go to the Google Cloud Console
   • Click on the project dropdown at the top of the page
   • Select New Project
   • Enter your project name and billing account, then click Create

2. Enable the Cloud SQL Admin API

   • In the Google Cloud Console, navigate to the APIs & Services section
   • Search Cloud SQL Admin API and enable it for your project

3. Create a Cloud SQL Instance

   • Navigate to the SQL section in the Google Cloud Console
   • Click Create Instance
   • Choose PostgreSQL as the database engine
   • Follow the prompts to set up your instance, including setting the instance ID, root password, and region
   • Click Create

4. Configure the database

   • Once the instance is created, click on it to view its details
   • Note the Instance connection name
   • Set up a database and user by clicking Databases and Users tabs and adding the necessary configurations

5. Create database.yml file
   Navigate to the config directory and open the database.yaml file

   default: &default
    adapter: sqlite3
    pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
    timeout: 5000
   
    development:
      <<: *default
      database: storage/development.sqlite3
   
    test:
      <<: *default
      database: storage/test.sqlite3
     
    production:
      adapter: postgresql
      encoding: utf8  
      host: <%= ENV.fetch("DB_SOCKET_DIR") { '/cloudsql' } %>/<%= ENV['CLOUD_SQL_CONNECTION_NAME'] %>
      database: <%= ENV['DB_NAME'] %>
      username: <%= ENV['DB_USERNAME'] %>
      password: <%= ENV['DB_PASSWORD'] %>
      pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>

   Create a .env file in the root of your project and create the following:

   DB_USERNAME="your-username"
   DB_PASSWORD="your-password"
   DB_HOST="your-instance-connection-name"
   DB_NAME="your-database-name"

   Check that the gemfile includes the dotenv-rails gem

   gem 'dotenv-rails', groups: [:development, :test]

   Create an initialiser to load the .env file

   # config/initialisers/dotenv.rb
   Dotenv.load

6. Migrate the Database
   Run the following commands to create and migrate the database

   rails db:create
   rails db:migrate

Deployment

1. Ensure you have a Dockerfile for both Frontend and Backend to containerise the setup in ./Frontend/Dockerfile and ./Backend/Dockerfile

2. Create a service account

   • Go to Google Cloud Console
   • Navigate to the IAM & Admin > Service accounts
   • Click Create Service Account
   • Create the service account and assign the Editor role to the service account. Click Continue
   • Click Done to create the service account

3. Download the Serice Account Key (secret key)

   • Click on the service account name
   • Navigate to the Keys tab
   • Click Add Key > Create new key
   • Choose JSON and click Create
   • Save the downloaded JSON file and store it securely in the repository

4. Use the cloudbuild.yaml file to automate the deployment of both the backend and frontend to Google Cloud Run

   steps:
     - id: "build image"
       name: "gcr.io/cloud-builders/docker"
       entrypoint: 'bash'
       args: ["-c", "docker build --build-arg MASTER_KEY=$$RAILS_KEY -t gcr.io/$PROJECT_ID/${_SERVICE_NAME} . "]
       secretEnv: ["RAILS_KEY"]
   
     - id: "push image"
       name: "gcr.io/cloud-builders/docker"
       args: ["push", "gcr.io/$PROJECT_ID/${_SERVICE_NAME}"]
   
     - id: "apply migrations"
       name: "gcr.io/google-appengine/exec-wrapper"
       entrypoint: "bash"
       args: ["-c", "/buildstep/execute.sh -i gcr.io/$PROJECT_ID/${_SERVICE_NAME} -s "your-project-id":${_REGION}:${_INSTANCE_NAME} -e RAILS_MASTER_KEY=$$RAILS_KEY -- bundle exec rake db:migrate"]
       secretEnv: ["RAILS_KEY"]
   
     - id: "run deploy"
       name: "gcr.io/google.com/cloudsdktool/cloud-sdk"
       entrypoint: gcloud
       args: ["run", "deploy", "${_SERVICE_NAME}", "--platform", "managed", "--region", "${_REGION}", "--image", "gcr.io/$PROJECT_ID/${_SERVICE_NAME}", "--add-cloudsql-instances", "${_INSTANCE_NAME}", "--update-secrets=RAILS_MASTER_KEY=${_SECRET_NAME}:latest"]
   
   substitutions:
     _REGION: "your-region "
     _SERVICE_NAME: "your-service-name"
     _INSTANCE_NAME: 'your-instance-name'
     _SECRET_NAME: 'your-secret-name'
   
   availableSecrets:
     secretManager:
     - versionName: projects/$PROJECT_ID/secrets/${_SECRET_NAME}/versions/latest
       env: RAILS_KEY
    
   images:
     - "gcr.io/$PROJECT_ID/${_SERVICE_NAME}"
   

5. Deploy with Google Cloud Build

   gcloud builds submit --config cloudbuild.yaml

Deployment with Github Actions

1. To automate your deployment process, .github/workflows/deploy.yml is used.
2. Ensure that your steps 1-5 for the above Deployment steps are working.
3. Go to your Github Repository > Settings > Secrets and Variables > Actions
4. Click on "New Repository Secret" and add the following secrets:

   • Name: GCP_PROJECT_ID, Secret: "Your-Project-ID"

   • Name: GCP_SA_KEY, Secret: copy and paste the information in credentials.json file from your gcloud service account

   • Note: Ensure that your gcloud service account has the roles Artifact Registry Reader, Storage Object Viewer and Service Account Token Creator

Testing

1. Testing using RSpec

   • All unit and integration testing for UI/Views are found in the ./Frontend/spec/views directory
   • All unit and integration testing for Controllers are found in the ./Frontend/spec/controllers directory

   Run the RSpec test using the following command (There are issues with running RSpec directly on development environment)

   $env:RAILS_ENV='test'
   bundle exec rspec

2. Testing using Cucumber

   • All features and user stories with the happy and sad paths are found in the ./Frontend/features directory
   • All step definitions are found in the ./Frontend/features/step_definitions directory
   • The Capybara helper can be found in the ./Frontend/features/support/env.rb directory
     
   • Note: Certain scenarios in steps_definitions have different code depending on whether you are a Mac User or a Windows User. Change accordingly. Run the acceptance test using the following command

   $env:RAILS_ENV='development'
   bundle exec cucumber

3. Open Code Coverage Report. Found in ./Frontend/coverage/index.html directory

   • Install VS Code Extension 'Live Server'
   • Right-Click index.html and Click on 'Open with Live Server'.

Acknowledgments

1. Michelle Halim
2. Ong Kang Jun
3. Ng Yu Hueng
4. Tan Ze Lin
5. Mohammed Azfar
6. Lee Rui Yu