Currency Tracker and Booking Application
A web based application to track currency and book refresher trainings
Description
This web application allows trainees to:
- track their currency expiries based on a set of currency requirements
- make bookings to attend trainings refresh their currencies
- have their currencies updated after completing a refresher
Tech Stack and Libraries
- PostgreSQL database
- Express (Typescript) Server
- React (Typescript) Frontend, built using vite
- Node.js
- Render for deployment (Web Service)
- Libraries (and their dependencies)
- Axios: handle HTTP requests
- TailwindCSS: CSS framework
- DaisyUI: Component styles
- DayJS: Date handling
- Formik: Form handling
- Yup: Form validation
- Jsonwebtoken: JWT signing and verification
- React-calendar: Calendar display
- Dotenv: Read environment variables
- Prisma: Database connection and transactions
- sgID: Singpass authorization
Timeframe
5 working days
Wireframe and User Stories
User stories
Development Approach and Details
This application implements basic Create Read Update Delete (CRUD) functions and was implemented using a model-view-controller architectural approach as described below. Our approach and timeline in developing this application was to:
Day 1
- Set up server using express
- Define all schema and generate PostgreSQL database using Prisma
- Plan server routers for basic CRUD functions using REST conventions
Day 2
- Authorisation via sgID client
- Server routers and controllers to CRUD trainees and trainings
- Front end client to CRUD trainees and trainings
Day 3
- Server algorithm to track currencies and display currencies for trainee
- Server algoritm to update currencies
- Front end client for trainees to book and complete trainings
Day 4
- Server routers and controllers to CRUD users
- Front end client for users
- Implement authentication across all application paths
Day 5
- Deploy application
- Style application
Model
View
The views and user interactions were developed using the react and react-router-dom libraries.
Controller
There are four categories of controllers in the application: for trainees, trainings, and users, and authentication
The controllers for users, trainings and trainees allow basic CRUD functions for the User, Trainee and Trainings models. The routes for each of these functions adhere to REST conventions. The authentication controller functions as middleware to ensure only authorized users can access the respective functions.
Deployment Instructions
Root Folder:
.
Build script:
cd ./client && npm install && npm run build && cd ../server && npm install && npx prisma db push && npm run build
Start script:
npm run start