Each branch of the company has a shift supervisor who creates and manages the shifts for employees working in that branch. Supervisors are using spreadsheets to schedule employees at their workplace. After the schedule is created on the board, it is printed and attached to the wall of the workplace.
A web application uses a backend application to store data and serve it to the customers and also all the business logic of the web application sits in the backend. This section of the report focuses on the history and evolution of web applications, overview of web servers and backend systems and also the underlying protocols for the backend systems to communicate with the clients. Advancement of the web applications has changed the landscape of the world wide web and opened up a host of new use cases of the internet.
One of the most important protocol used between the communication of web servers and clients is HTTP. The first line of the message is called the Request line which begins with the request method followed by request URI followed by the HTTP protocol version used to transmit the message. The method is any one of the methods defined in HTTP specifications discussed in the upcoming HTTP Methods section of this report.
The protocol used to send the request is HTTP and the version of the protocol is 1.1.
HTTP Methods
The response status must be an HTTP status code from the HTTP specification, and the reason statement is text describing the code. The message 200 OK on the first line refers to the fact that the request was processed by the server and the success response was returned.
GET 2. POST
An overview of REST API
In 2000, Roy Thomas Fielding invented REST as an architectural style for networked software applications. The main goal of the RESTful style is to enable distributed systems to be simple, scalable, and powerful while adhering to common HTTP and URI standards. Therefore, REST is not a new standard or protocol, but a design pattern for developing network software applications.
Software applications or web services that are developed according to the REST design pattern are also called RESTful web services. Web services are considered RESTful services if they adhere to the following standards:.
Everything is a resource
Each resource has a unique identifier
Use the standard HTTP verbs
Single resource can have multiple representations
Stateless Communication
Now that we have established the basics of RESTful web services and have adequate theoretical knowledge about RESTful api, in the next section we will explore the requirements for our project and the design of the RESTful api for the project.
3 Project requirements and API design
- Collecting user stories
- Wireframing the application
- Database design
- API design
Supervisors should be able to see a list of available employee rosters for a specific job. Now that we had a draft of the user stories, we started sketching out the wireframe of the application to give these user stories a visual structure. After collecting user stories for both supervisors and employees, we started creating wireframes of what the app would look like.
It took about a week of work for the two of us to come up with the app frameworks. Although there are many sophisticated digital tools available for creating appliqué wireframes, we used chalk and whiteboard for the entire process. Additionally, it was easier to see and create visual relationships between different app views while using the table.
While building the app, we came up with 9 different views for the supervisor and 6 different views for the employees. As shown in the table, supervisors can create, save and publish schedules for the workplace from the schedule creation view and the dashboard shows all schedules created for the workplace. Profile views and profile editing can be used to view and update employees' own information.
And finally, employees can use the calendar view to save their work desire and their work availability, which the supervisor will see in the application while creating new schedules. 13 Once we had these wireframes ready, it was easier to imagine most of the data we needed to develop the application. Shortly after we were done with the wireframes, we started designing the application's database.
We needed a data system to store all the data about users, supervisors, shifts and all the other data we needed to exist in the application. The objects in the database are called models, and the object plan with their attributes are called schemas. 16 Table 4 above shows the application's API resources and which actions are associated with each resource.
4 Development tools and Implementation
- Development tools
- Visual Studio Code
- Trello
- Figma
- Implementation of the project
- Nodejs with Typescript and Express
- Postgresql database with TypeORM
- Backend Architecture
- Project Outcome and Future
- Project outcome and its current stage
- Future of the product
- Conclusion
This section provides a brief overview of the technologies we chose to implement the project and the high-level overview of the application architecture we built based on those technologies. By defining the succinct form of the data and objects before they are coded, it is possible to avoid many bugs in the program caused by incorrect typing. This section also covered a very high level overview of the architecture we used in implementing our backend system.
This section explains the outcome of the project and our plans to grow the application further by adding new useful functions. An MVP, also called Minimum Viable Product is a minimal solution to a problem that is not yet mature, but still capable of solving the customer's headache points. Supervisors can log in and out of the app using the credentials they used to register with the app.
Supervisors can change all job details (eg: email, password, name, etc.) from the app. The left column of the view contains employee information and employee availability information. Users can log in and out of the application using the credentials they used to register.
At the top left of the view is a three-bar menu that can be used to navigate through. Additionally, at the bottom of the view is also a navigation menu for the most used app links including history, notifications and calendar settings. This view is almost similar to the app supervisor side settings view.
At the time of writing this report, almost seven thousand shifts have been created in the application. We have received feedback and requests for improvements from supervisors currently using the application. There were also losses suffered by the client due to the calculation errors made by doing the calculations manually which were very difficult to trace.
The goal of the project was to eliminate those bugs and build something that is easy to use and simple while still addressing these issues. If part of the solution didn't come out as expected, we would redesign and improve that part.
Landing page of the application
