Hi, I'm Ali Hamas, a passionate frontend developer currently diving into the world of backend development. I specialize in creating full-stack applications using Backend-as-a-Service (BaaS) platforms like Firebase and Appwrite. I recently developed a Twitter Clone using Appwrite, which showcases my skills in combining frontend and backend technologies.
Web Design
My journey into the field of computers began during the COVID lockdown in 2021. Back then, I had no clue about programming and thought it was an extremely tough field to get into. I decided to start with something more visual and began learning Adobe Illustrator for logo designing, aiming to become a web designer. But, as it turns out, I wasn't very good at designing and quickly realized it wasn't the right path for me.
Start of Programming
I eventually found my way to programming, starting with C++. I learned the basics of programming concepts like data types, functions, loops, and object-oriented programming (OOP) principles, which are similar across many languages. However, when the lockdown ended, I had to pause my learning to focus on my studies as I was in my second year of college.
Web Development Begins
After completing my second year in 2023, I shifted my focus to web development, starting with HTML, CSS, and JavaScript. Initially, I found it slow-going, but persistence paid off. I built my first portfolio website and later updated it to this portfolio. I also created several projects, including a to-do app, a music player, and a Netflix homepage clone (logged-out version). Then, I started working with APIs, building projects like Weather App, QR Code Generator, and Daily Quote Generator, available at first portfolio website
Starting React & Tailwind CSS
I then discovered React, which opened up a new world of possibilities. I started by learning the basics of React but struggled with CSS. So, I turned to Tailwind CSS, a utility-first CSS framework that made styling especially conditional styling a breeze. I mastered the basics of React, including JSX components, props, useState, useRef, useMemo, and the context API.
Simple Projects in React
I began creating simple projects, starting with a basic To-Do App that stored data locally. As I improved, I added features like editing, deleting, and filtering to the app. My first API project in React was an e-commerce website that fetched products from the Fake Store API. It included a homepage, category pages (men, women, jewelry), and a dynamic single product page. Unfortunately, I lost this project when my laptop's SSD crashed, so it's not on GitHub. Then, I came up with a new project idea inspired by Chrome. I stumbled upon new tab extensions in the Chrome Web Store and found them far more engaging than the default Chrome new tab page. So, I thought, why not create my own extension? I built the iTab - Chrome New Tab, using React and started using it as an offline extension. It was a great learning experience, and I still use it as my personal new tab page.
Freelancing & TypeScript
At this point, I started freelancing to gain experience and earn some pocket money. It was challenging initially, but I soon landed my first project, which involved fixing some JavaScript issues. My cousin then introduced me to a client who needed work done on a project called Flick It, a client management website built with React and TypeScript. This experience showed me the importance of TypeScript in managing larger projects effectively, so I made it a part of my regular toolkit.
Exploring BaaS
I've always dreamed of creating a functional Twitter clone. My first attempt was purely a design clone using HTML, CSS, JavaScript, and jQuery, displaying tweets stored in local storage without any interactive features like liking, commenting, or following. I then recreated it in React and Tailwind CSS, again without functionality. This led me to explore BaaS solutions like Appwrite, which made me realize the potential of integrating backend features seamlessly.
Full-Stack Projects
Excited to showcase my skills to friends and family, I created Chaty - Public Chat Room with a single room using React, Tailwind, Framer Motion, and Firebase. Next, I began working on my dream project, a fully functional Twitter Clone with user authentication, liking, commenting, following, and retweeting features. Users can even edit their profiles. This success inspired me to revisit my lost Ecommerce App project and rebuild it as a full-stack application, complete with a cart, user authentication, and an admin dashboard for sellers. All of these projects were made possible through the power of different BaaS solutions.
Journey into Backend Development
After completing these projects, I felt the urge to build everything from scratch, including the backend. I've started learning backend development with Express.js and am now diving into MongoDB basics. My next steps are to focus on scalability, security, and other advanced backend concepts.
Conclusion
Thanks for reading my story! I'm currently exploring backend development and excited to take on new challenges. If you have any opportunities or projects in mind, I'm available for full-stack collaborations. Feel free to connect with me.