Case Study

Project Motivation

Reason for Undertaking the Project

Kite was undertaken as a first-semester master's computer science project. The primary motivation was to develop a dynamic and responsive quotes-sharing application that allows users to share and interact with quotes in real-time.

Context or Background Information

The application was envisioned as a platform for sharing inspirational, motivational, or thought-provoking quotes. The goal was to create an engaging and user-friendly platform with different levels of access (user, admin, guest) to cater to various needs and permissions.

Specific Events or Trends

The need for dynamic, real-time applications that provide seamless user experiences without page refreshes drove the creation of Kite. The project also aimed to explore modern web development practices, such as containerization with Docker, to ensure scalable and efficient deployment.

Objectives

Main Goals of the Project

1. Develop an application for sharing quotes with three levels of access: user, admin, and guest.
2. Implement real-time updates for comments without requiring page refreshes.

Specific Targets or Metrics

1. Use Docker containers to streamline deployment and development processes.
2. Ensure real-time functionality for updating comments to enhance user experience.

Challenges

Technical Challenges

• Establishing relationships between databases. However, Laravel documentation proved helpful in overcoming this challenge.

Operational or Logistical Challenges

• Implementing the MVC (Model-View-Controller) framework and understanding its ease of use within the application.

User-Related or Market-Related Challenges

• Storing the currently logged-in user in the local session to allow users to access the website without signing in again upon revisiting.

Approach and Process

Initial Steps

The project spanned three months, starting with database creation, followed by front-end development, and then integration with the back-end.

Key Phases

1. Database Creation: Setting up the SQL database to handle user information, quotes, and comments.
2. Front-End Development: Using Tailwind CSS for a fast and responsive design.
3. Back-End Integration: Implementing Laravel PHP for robust backend functionality.
4. Real-Time Updates: Using WebSockets to enable real-time updates for comments.

Tools and Methodologies

• Docker: Used for containerization to ensure consistent development and deployment environments.
• GitHub: For version control and continuous integration/continuous deployment (CI/CD).

Technologies Used

• Frontend Technologies: Tailwind CSS
• Backend Technologies: Laravel PHP
• Databases: SQL
• Third-Party Services or APIs: Docker
• Hosting and Deployment Tools: Local hosting within Docker containers
• Version Control and CI/CD Tools: GitHub

Implementation

Key Milestones

1. Database Setup: Designing and creating the relational database schema.
2. MVC Framework Implementation: Structuring the project using the MVC architecture.
3. Frontend Development: Developing a responsive user interface using Tailwind CSS.
4. Backend Development: Building the backend with Laravel PHP and integrating it with the frontend.
5. Real-Time Functionality: Implementing real-time updates for comments using WebSockets.
6. Testing and Debugging: Ensuring all features work correctly and efficiently.

Important Features Developed

• User authentication and session management.
• Real-time comment updates.
• Responsive design for seamless user experience across devices.

Major Achievements

• Completed the project within the deadline.
• Successfully integrated all required features to meet the course requirements.

Results

The project successfully developed a dynamic and responsive quotes-sharing application. Key achievements include:

• Efficient real-time comment updating.
• Seamless user experience with a responsive design.
• Containerized deployment using Docker for consistent and scalable environments.

Lessons Learned

1. Database Relationships: Understanding and implementing relational database schemas.
2. MVC Framework: Gaining insights into the ease and efficiency of using MVC frameworks like Laravel.
3. Real-Time Functionality: Implementing WebSockets for real-time updates significantly enhances user engagement.

Future Improvements

Planned Features

1. Payment System: Adding a payment system for premium users to post more quotes and include image embeds.
2. Improved UI/UX: Enhancing the user interface and user experience based on feedback.

Long-Term Vision

1. Public Deployment: Hosting and deploying the application for public use.
2. Continual Enhancements: Iteratively improving the application with new features and optimizations.