Introduction


A personal website designed and written by myself, this website as a playground to hone my HTML, CSS, and JavaScript skills as well as to keep up with the latest front-end technologies. There have been various versions of this site and you can see the evolution over on this site's change-log.

Challenges


The challenge that this project presented me with revolved around my lack of front-end knowledge. Early during my career as a web developer my day to day revolved around doing back-end work, so in order to challenge myself and understand the full picture, I decided to go the extra mile and get to work with and familiarize myself with the various front-end tools and libraries out there.

Lessons Learned


The lessons that I learned going through and challenging myself with doing front-end work allowed me to be a more well rounded developer. In addition to that, the skills gained allowed me to contribute with the various development teams that I worked with. I was able to relate with the front-end team which allowed me to design the back-end to do as much of the heavily lifting as possible to help create performant web applications. Overall, it was a great decision for me since I was able to learn JavaScript, jQuery, CSS, Sass HTML, and VueJs as well as get familiar with the various build tools and processes such as Npm, Yarn, and WebPack.

Tech Stack


This latest version of the website is generated by the static site generator 11ty. To aid in code organization, I used the tea-stack project template made by Matt Waler. It comes pre-configured with Tailwind CSS, EleventyJs, and AlpineJs. It follows ARIA accessibility guidelines as well as utilizing a colorblind friendly color palette. Finally, hosting is being handled via GitHub pages.

Roles


The following is a list of the various roles that I assumed during the development of this project: