Making a Portfolio Website From Scratch

It’s time.

You’ve created projects, you wrote your resume, your LinkedIn looks great. On the never ending checklist of Personal Branding and Networking to-dos, you’ve narrowed it down to your portfolio website and fixing your Twitter (aka deleting the Glee-fanfic).
That might be too specific.
But if you’re a little like me, you might be met with the analysis paralysis of where to even begin. Where to host? What language to use? Styled Components or Bootstrap? Or, god forbid, ignoring a template all together and diving into CSS on your own.
You have to find what works for you, but to help, here are some tips and resources:

Tips

Don’t be afraid to look for inspiration. Look at your friends and colleagues and connections and what their portfolios look like. But remember to credit where it's due.

Let it reflect you. In the world of first impressions, your portfolio can be the inhale you take before you introduce yourself.

Let it be weird, let it be silly, let it be exciting. It’s recommended that your resume be relatively boring in order to pass through the programs, but here you can use colors and animations and make the buttons bounce in a way that some people might not like but Oh well!

Send it around! Not just to your friends with wonderful design ability, but to your mom! If your mom can’t figure out how to use your dropdown, perhaps that needs some adjusting. Overwhelm yourself with feedback.

But remember that when you receive feedback, it’s one person’s opinion. It might be an educated opinion that you should probably listen to, but at the end of the day it’s your portfolio, it’s literally representing YOU.

Use this opportunity to learn. I graduated Flatiron’s Software Engineering program with a competency in Ruby and JS, but they couldn’t teach me how to have style or taste. My CSS knowledge was incredibly limited, I could not explain what a flexbox was. But by ignoring that tempting urge to go to Bootstrap, I was able to deepen my understanding of how CSS works and (maybe) how to make things look good.

Resources

I used React for my portfolio and hosted it on Github Pages. Here's a great tutorial

Create a personal color scheme

Add CSS animation

Improve your Flexbox skills

Add a tabbed table

Create a free email form

Inspiration

Nicky Dover Reflecting Your Personality

Brittany Chiang Sleek and Smooth

Maxine Meurer Animations and Fun Features

Nicoll Oliver Repurposing a Template

This Giant List

Not only did a learn so much about styling and organizing, but I’m even more excited to show this project off.
I'm proud to say this thing is about me and by me.

View my website here!