My Personal Website

This is a personal website showcasing my experiences and projects.

Built With

• HTML
• JavaScript
• CSS
• Bootstrap
• Particle. js
• Animate. css
• WOW. js

Features

• Single page application
• Interactive landing page
• Sticky navigation bars
• Scroll activated animations
• Scroll activated navigation
• Custom carousels

Challenges

• Conceptualizing the best design to display the content approriately
• Identifying what elements required custom CSS vs. using out of the box elements
• Creating a responsive design that maintained the integrity of the design on devices of different sizes
• I generally ran into a lot of unforseen issues that required a lot of googling and led to hours of confusion

What I Learned

I initially started designing this website with Bootstrap Studio but found it difficult to find support for some of the issues that I was experiencing. I eventually started my website with a basic scrolling nav template with an MIT license and built off it by adding a lot of elements, custom css, and javascript - I did not just paste in my own content. I did take heavy inspiration from single page applications and portfolio websites.This project helped solidify my skills in HTML, CSS, and Javascript and introduced me to several js libraries that made it easier to implement the visual effects that I wanted. I strengthened my skills in UI design through working heavily with CSS and Bootstrap. I learned about many CSS concepts such as transitions, animations, media queries, etc. Throughout the process I learned how to use Google Chrome's inspector too, which was tremendously helpful for diagnosing problems and see what was happening "under the hood". As a result of my inexperience, it took me quite a while to just diagnose the issue and describe it properly. I often found myself spending a lot of time on small issues, resulting in hours of scourering Google and Stack Overflow for answers. Nevertheless, I really enjoyed watching my website come to life!