Skip to content
This repository has been archived by the owner on Jan 18, 2024. It is now read-only.

Latest commit

 

History

History
195 lines (139 loc) · 8.27 KB

README.md

File metadata and controls

195 lines (139 loc) · 8.27 KB
Raw

EcoCatch Tours - 95545

Kanban style boat management system that allows drag and drop of boat card between docked, inbound, outbound and maintenance swim lanes.

The system aims to solve the following two user stories:

  • As a user, they can view a list of boat statuses so they know at a glance what status each boat is in
  • As a boat operator, be able to create boat card to describe the status and be able to move them between swim lanes

Assumptions

The following assumptions were used while building the system:

  • The boats can be created and removed at any time. There is no limitation on the number of boats that can be on the board at any moment.
  • Even though the company might have a finite amount of boats, there is no logic to limit creation to this number.
  • There is no need to edit boat names or operators as they can just be deleted and re-created.
  • Operators can be assigned to any boat
  • Boats use names/nicknames to uniquely identify them on the board, nevertheless boats can have the same name. It is assumed the boat names meaning are known by the operators.
  • At a glance provide the number of boats by status to quickly get an overview without having to use the board.
  • No authentication/authorization or registration is required. The users all share one system.

Backend

The backend is built with Node.JS + Express.JS using TypeScript and follows a RESTful API approach. The endpoints are used using a versioned approach, for example /boats/v1/

The backend is connected to a mongoDB database for persisting boats.

The following endpoints are available once deployed

GET All

Property Description
Endpoint GET /boats/v1
Purpose Retrieve all boats stored in the database
Request parameters None
Response A list of all boats stored in the database
Error handling If there is an error during the retrieval operation, a "500 Internal Server Error" message will be sent in the response

GET One

The endpoint is currently not used by the frontend. It was implemented for full and future functionality.

Property Description
Endpoint GET /boats/v1/:id
Purpose Retrieve a single boat from the database by its id
Request parameters id - the id of the boat to retrieve
Response The boat with the specified id
Error handling 404 - If the boat with the given id is not found in the database, a "Boat not found" message will be sent in the response.
Error handling 500 - If there is an error during the retrieval operation, a "500 Internal Server Error" message will be sent in the response.

POST

Property Description
Endpoint POST /boats/v1
Purpose Create a new boat
Request parameters operator and boat name - the operator and name for the new boat
Response The inserted id of the new boat
Error handling 400 - If the operator or boat name is missing in the request body, a "Bad Request" message will be sent in the response.
Error handling 500 - If there is an error during the creation operation, a "500 Internal Server Error" message will be sent in the response.

PUT

Property Description
Endpoint PUT /boats/v1/:id
Purpose Update a boat's information
Request parameters id - the id of the boat to update; name, operator, status - the new information for the boat
Response The id of the updated boat
Error handling 400 - If either name, operator, or status is not provided in the request body, a "Bad Request" message will be sent in the response.
Error handling 500 - If there is an error during the update operation, a "500 Internal Server Error" message will be sent in the response.

DELETE

Property Description
Endpoint DELETE /boats/v1/:id
Purpose Delete a boat
Request parameters id - the id of the boat to delete
Response The id of the deleted boat
Error handling 400 - If the boat failed to delete, a "Bad Request" message will be sent in the response.
Error handling 404 - If the boat with the given id is not found in the database, a "Boat not found" message will be sent in the response.
Error handling 500 - If there is an error during the deletion operation, a "500 Internal Server Error" message will be sent in the response.

Frontend

The frontend is built with Vite + React using TypeScript. It is mobile-friendly and uses Bootstrap as the CSS framework.

The frontend provides two routes:

  • / which is the landing page as well as an overview page of boat statuses.
  • /boatStatus which is the Kanban board style page where boats can be created and managed.

Testing

Backend

Backend testing uses Jest, a code coverage summary generated by it is shown below. In short, the backend has a 90% code coverage on statements.

View Code Coverage
File % Stmts % Branch % Funcs % Lines Uncovered Line #s
All files 90.16 72.54 95 87.09
controllers 100 95 100 100
boats.controller.ts 100 95 100 100 67
db 58.33 50 0 58.33
db.ts 58.33 50 0 58.33 16-21
services 86.27 60 100 81.08
boats.service.ts 86.27 60 100 81.08 11,24,41,59,71-74

Frontend

The frontend does not currently have any automated testing. Nevertheless, the following tests can be considered for each story:

User Story 1

Pre-requisite: Create a boat, status will default to docked.

  1. Visit the home page
  2. Navigate to the boat status page
  3. Assert outbound, inbound, and maintenance columns are empty.
  4. Assert one item in docked column.
  5. End Test

User Story 2

Pre-requisite: Create a boat and move it to the outbound lane.

  1. Visit the home page
  2. Navigate to the boat status page
  3. Click Add Boat button
  4. Fill Boat Name as Story2 and Operator Name as John
  5. Click Create Boat
  6. Assert one item in the docked column.
  7. Assert no items in the inbound column.
  8. Assert one item in the outbound column.
  9. Drag boat named Story2 into the maintenance column.
  10. Assert one item in the maintenance lane.
  11. Assert no items in the docked lane.
  12. Trigger page refresh.
  13. Assert no items in the docked column.
  14. Assert no items in the inbound column.
  15. Assert one item in the outbound column.
  16. Assert one item in the maintenance column.
  17. End Test

CI/CD Pipeline

A CI/CD Pipeline has been implemented using GitHub Actions and is part of this repository. The pipeline tests, builds, configures, and triggers a deployment into Digital Ocean.

A high level representation of the pipeline:

Pipeline deployment assumptions

The pipeline assumes a mongoDB database has already been deployed on a cloud provider and a connection string is available to be used by the API. A deployment and configuration of a database is considered out of scope.

Running locally

To run this repository locally follow these steps:

  1. Deploy a mongoDB

Deploy a mongoDB locally either using docker or a database install. Take note of your port, username, and password.

  1. Clone this repo
  2. From a terminal at the top level of the repo run npm install this should install all required dependencies. Tested on Node v16 and v18.
  3. Create a .env file under packages/api/ as follows:

Replace {VARIABLE} with your mongo specific values

DB_CONNECTION_STRING="mongodb://{YOUR_MONGO_USER}:{YOUR_MONGO_PASS}@{MONGO_HOST}:{YOUR_MONGO_PORT}"
DB_NAME="boats"
COLLECTION_NAME="boats"
  1. Create a .env file under packages/frontend/ as follows:

Note: assumes API will run on port 8000

VITE_API_BASE_URL="http://{YOUR_HOST}:8000/boats/v1"
  1. Start the api by running nodemon or npm start if running with the later you might need to build first by running npm build
  2. Start the frontend by running npm dev
  3. Done!