This project holds a very special place in my heart. It's my first full-stack website and also the first actually useful creation I've made.
It's now January 2025 and I'm transferring these words that I wrote back in grade nine, to my new blog website. But everything I said here still hits different. Such a throwback.
COVID-19
During the 2020 pandemic, my friends and I wanted a way to talk with each other online. One of my friends is visually impaired and prefers a specific contrast to use the web, something that eases his eyes the most. He was not allowed to use Discord because there were questionable individuals on that platform.
When I first started working on this project, I had very little experience with web development. I remember starting out with just HTML and CSS, creating the basic layout and style of the site. However, I quickly realized that I needed to learn more in order to add the functionality my friends wanted, like a message submission system and real-time communication.
I quickly turned to the internet for help and started to learn JavaScript. It was a challenging process, but with persistence and determination, I finally had the basic functionality of the chat working.
It was really cool to see it working in production, deployed to my dad's VPS and SQL database.
At this point, the same colour-blind friend was really intrigued by the website's creation, and wanted to join me in development. We started to work together to roll out features faster and more efficiently.
Technical Specifications
Accessible Chat was built using the LAMP stack:
- Linux – Deployed on a VPS for full control over hosting.
- Apache – Served the web application efficiently.
- MySQL – Handled user authentication, messages, and system logs.
- PHP – Powered the backend, handling real-time messaging, authentication, and database interactions.
Final Features
- Secure login system with bearer tokens
- Dark mode and accessibility mode for my colourblind friend
- Message replies! (Before Discord)
- Built-in markdown using regular expressions - Hashtags are shown as blue - Links are automatically detected - HTML tag - support ("strong","em","mark","ins",etc)
- All inputs cleaned using DOMpurify to prevent cross-site scripting (XXS)
- multi-tab system for quick links
- working mobile integration
- fun quotes generator
- inline emotes and gifs
- chat emptying system for "sus" messages
- "system commands" not associated with any users
- and much more...
Musings and Reflections
During this project I learned a lot about accessibility and the significance of making technology inclusive for everyone. I keep this in mind with every successive app I make, because if it helps at least one person, it's worth every second I spend developing.
I feel the most fulfillment when my work helps people and in the process, creates relationships that transcend the feelings of profits, fans, or ‘followers’. On this journey, I’m sure I’ll meet more people like my friend, and I can’t wait to make their lives better and gain a new perspective of the world.
If I were locked in a white room, alone solely with computers and technical equipment, I would not have the will to continue programming. It’s the interpersonal connection with other people that CS creates which drives me to go on.
Engineering, at the heart of it all, is the people business. Humans have had problems for ages, and our ability to solve them is inherently social.
In thirty years, when I look back on my life, career, and overall impact on the world as a person, I intend to look back with pride. This pride will not be measured in lines of code, nor will it be in thousands of dollars in software sold. No, it will be the thousands of lives that my work has impacted.
If you want to see a slideshow version of this blog post, check out this link