The Inspiration & Journey of Building My Website
TL;DR: to gain real experience where you can learn and grow, throw yourself into the deep end and do the work. You can do all the planning you want, but only through gritty building will you gain valuable output. Your first model may have flaws, but iterate and improve everytime. Then soon enough you’ll have a product that you’re extremely proud of.
A couple of months ago, I had zero understanding or knowledge of making a website. I couldn’t even tell you what HTML, CSS, and JS stood for. However, after having a heart-to-heart conversation with Shihao Cao, something I look up to and greatly respect, creating my own website became my top priority. Well, I should clarify. Building a website was not my main goal; building anything tangible was, and it just so happened that a website would benefit me in a multitude of ways. I knew I wanted to create something from scratch, a project where I’ll get my hands dirty and do the actual work. I knew I would struggle tremendously (and boy did I struggle), but I also told myself that nothing great comes without overcoming failure. So on top of my 20-credit semester, all of my extracurricular activities, and my social life, I added building my personal website to the list.
I started my journey with an initial design of my website. I was inspired by a few of my friends’ designs but mainly wanted to create a website that was simple, ergonomic, and aesthetic. My initial thinking was to have multiple pages, for each section on the header. However, I decided to keep everything on the home page to reduce the complexity of the website for the user. In terms of the color scheme, I wanted to keep everything legible and user-friendly but also wanted to include a pop of color. I chose the red gradient because it contrasts well and red is my favorite color (lol). (attach screenshots of initial design and finished design)
As for coding out the website, it took a while to understand how to properly create concise and effective code. Creating products that have these two characteristics are key for engineers. I coded my website in HTML, CSS, and JavaScript, and mainly learned through YouTube videos and searching on Google. (link youtube video). Through this project, I realized that there are numerous ways to code the same task, but some are more efficient than others which makes them better options. So while I could've finished this website in a shorter amount of time, I wanted to build an easy-to-read and effective code base. However, this project was not as smooth and easy as it seems. I ran into numerous obstacles when trying to implement certain features. One of the biggest issues I faced was figuring out the layout of the content and also making the website adjust to smaller screen sizes automatically. While it is wildly frustrating, I learned that it’s key to break down the problem into smaller steps and solve them one by one. This makes the process easier and less-stressful.
I also gained experience using GitHub with this project. I learned the workings for pushing and pulling code in addition to hosting a website for free using GitHub.
Overall, I wanted to build something this semester where I could learn a new skill and be proud of my product. I was able to do this through the creation of my website. However, the aspect of the entire build process that I am most proud of is my ability to work through the obstacles I faced along the way. These moments forced me to bear down and utilize my thinking and resources to fix the issues. I truly recommend building, even if it’s a small project like building a personal website/portfolio. It’s extremely rewarding and you’ll learn a lot along the way.
