Personal Website
There were a lot of hurdles, and tearing down and re-building of my website. I learned a lot from building this and documented some of my discoveries in blog posts.
I learned how to implement parallax scrolling. For the longest time I couldn't figure out why my hero image wasn't appearing on mobile and that's because the background-attachment can't be fixed, so it needs to be changed to scroll with a media query.
I purchased my first domain name. I had no idea how to use this domain name with my website. I only had it deployed to GitHub pages, but after research I was able to figure out how to redirect it to my purchased domain name. For anyone who is trying to use a GoDaddy domain with gh-pages I wrote out steps on how to do so here.
I really stepped up my styling by using Sass. I immediately fell in love with Sass and how DRY it kept my code. Using Webpack with Sass was fantastic since it compiles all the styling for you. Once again I documented my discoveries with Sass.
I included a couple jQuery plugins. The Magnific Popup for the lightbox gallery was easy to implement, especially since it was already built to be responsive. The jQuery Easing plugin added a nice touch to scrolling with the header links.
There are many images in my portfolio, so to make my website faster I compressed all the images with ImageOptim.
Most of my images are saved as PNGs, but my social media icons are saved as SVGs. I learned that SVGs can be very customizable. Sketch was a great tool in customizing SVGs.
I wanted to make sure my website was completely accessible for everyone, so I used the Chrome DevTool aXe to test for accessibility issues.