tannerfisc.us

Overview

Hey there, I'm in the process of updating my website and most of the information you will find on this page is currently outdated. Check back soon for updates!

Being a developer and designer certainly has its challenges. On one hand, I'm always wanting to make sure that I'm satisfied with the design of my site. I'm constantly finding inspiration through other websites and products, which always has me thinking "Oh, I like this! I could update the design of my site." On the other hand, I'm always learning about new front-end technologies that are faster, more efficient, and fun to work with. Balancing both modern design and current technologies is hard, but I've brought the two together for my latest iteration of this site.

History

The previous version of my site was built with React, but let's be real... I only knew the bare minimum when I created it. Having worked with React for awhile now, I've learned a lot about best practices. This inspired me to scrap my previous codebase and start fresh.

Before starting an entire rewrite, I decided that I wanted to take the approach of design-first. I set to work creating my own design / pattern library, which has reusable components and classes. I knew that creating patterns first would allow me to unify personal brand across any project I built (including my back-end admin).

After having my patterns in place, the prototypes began. Having known the pages that I would need up front let me easily create a shell for my new website. Running on a node server, the small React application had routes that mirrored my live site. Using these routes, I started breaking my patterns into various React components. When combined, the components started to morph into an actual page.

Having basic prototypes made it easy to tweak parts of the design that just weren't working for me. I'm pretty sure I adjusted the cover image component at least five times. On airplanes, on weekends, on weeknights, and just about any spare time I had, I began pulling the entire site together.

While I was developing the application, I was also making changes to my admin. I needed to provide additional data to fulfill the design of my portfolio pages (like this one). For example, I added the "Technologies / Skills" section and an ability to create a project timeline. Slowly, but surely, it all came together. In late 2016, I was able to launch the site and am constantly looking for ways to ensure it remains up-to-date.

What's Under The Hood?

You can check out the code on Github.

Thoughts?

I'd love to get your thoughts on my site. Have any? Let's get in touch.

Last updated: May 2020

Applicable Technologies

ReactJS
SASS
HTML
Javascript
CSS
Last updated: May 2020