Overview

This project was built using Flask, a Python microframework, which allows users to register, login, and schedule annual leave. Which can then be approved or declined by a user with admin status. This project stands as a simple prototype which allowed me to experiment with utilising a new language and framework.

Objectives

• Develop a modular Python-based web application, structured to replicate the MVC architectural pattern within the Flask microframework.
• Ensure high-quality, optimised code with robust validation rules to maintain reliability and security.
• Prioritise usability and user experience, incorporating features such as notifications and clear feedback on activity success or failure.
• Creating comprehensive user documentation for setting up the application in a local development environment (Available on GitHub)

Process

1. Planning & Wireframing
   

   I began by sketching wireframes on paper to explore layout ideas and draft a basic sitemap. To guide my design choices, I researched existing annual leave booking systems and identified common patterns. Despite being relatively new to Tailwind CSS, I decided to incorporate it to streamline development and ensure a simple, responsive design.

   The project required a maximum of two relational database tables, so I created an Entity Relationship Diagram (ERD) to plan the fields and relationships. To map user interactions, I produced flow diagrams outlining the core functionality for both Admin and General users, as well as a user story diagram to define functional requirements.

   After establishing the functional and non-functional requirements, I translated them into tasks on a Kanban board, following a self-enforced Scrumban approach to structure my workflow.

2. Development

   During development, I self-taught Python alongside the Flask microframework, which was both a challenging and rewarding process. My initial priority was to create a modularised file system that mirrored Laravel’s MVC architecture, a structure I was already familiar with. On the front-end, I used Jinja templates to integrate dynamic data into HTML and Tailwind CSS to accelerate design by leveraging pre-built components. This approach enabled me to produce a stable prototype within the short project timeline.

   To improve usability, I used NPM to manage assets and integrated third-party libraries such as SweetAlert, which I converted into a reusable component for displaying flash messages. These notifications provided users with clear feedback on whether their actions succeeded or failed.

   Security was a key priority. I implemented password hashing with werkzeug.security to protect user credentials during storage and transmission, reducing the risk of interception or breaches. I also introduced role-based access control, restricting General users from entering the Admin control panel.

   Validation was applied throughout the system, for example, preventing leave requests in the past, disallowing an end date earlier than the start date, and enforcing strong password rules during registration.

3. Testing & Optimisation

   Each sprint concluded with testing, combining manual acceptance testing with unit tests. By integrating testing as a routine task, I ensured that any newly introduced code did not break existing functionality. This iterative process allowed me to maintain system stability throughout development.

   Near the end of the project, I revisited the codebase to refactor and optimise. My approach prioritised achieving functionality first, followed by performance improvements and security enhancements. This ensured the final application was both efficient and compliant with best practices.

Key Features

• Fully responsive, mobile-optimised design
• Validation implemented to enforce rules and to handle errors
• Custom authentication system allowing users to register and login, with an Admin promotion system
• Integrated Flash messages using the SweetAlert library to notify users of successful and unsuccessful interactions and errors

Reflection

Building this application allowed me to expand my web development tech stack. Python was relatively new to me, and learning a framework alongside it made the process particularly challenging. However, completing this project as part of my university assignment has given me a solid level of proficiency in both Python and Flask, even though Laravel remains my preferred framework.

One of the challenges I set for myself was to implement authentication manually to some extent. This required me to apply secure coding practices, such as encrypting data during transmission and ensuring sensitive information was safely stored. In hindsight, using a pre-built authentication library would have been a more efficient approach, as it would have reduced the risk of security flaws and saved development time, something especially valuable given the tight deadline.

Overall, I am pleased with the outcome of the project. While I believe I could have achieved more had I been able to work in my preferred framework, the system functions well as a prototype annual leave booking application and has clear potential for further development.

Feel free to drop me a message using my contact form if there is anything you particularly like about it! I would love to hear from you!

To access the project on GitHub, please click the button below

GitHub Link