I have a background in graphic design, but have semi-recently (over the past ~3 years) career shifted to a point where my current title is Front-end Dev & UI Designer.
However, my personal website hasn't quite caught up with that change - funny how it doesn't update itself, right? It's long overdue for an update and I really want it to reflect my current skillset. I'm not looking to job hunt at the moment (if that affects your recommendations), but I do use my site a fair bit for networking and occasional freelance work. In the past, I used my site as a digital portfolio of stuff I designed + screenshots / gifs of static sites I coded on my own. However, now I'm doing web app development in React, building and maintaining a component library, sharing a codebase with a team of other devs, etc. - basically, not stuff I can screenshot and put in a gallery-view portfolio the same way I used to.
I've done a bit of poking around on other folks' sites, but I'm curious: what content do you think is important to include on a front-end dev's personal site, and how do you present / communicate the work you've done?
Latest comments (33)
and of course links to all their online SMN and BMN presence ! see SMN & BMN for devs post
I think you need a bit of your personality in your ‘personal’ website, just like Ben...
I get most visitors landing on blog posts so I would definitely recommend blogging every month or so.
My tip is to consider accessibility and run a tool like Axe to help you fix any critical issues that put up barriers to people with disabilities.
On the other hand, should a dev focused on backend should have a personal site? Would it serve the same purpose? What should it display?
I do back-end work and my site is just a "hub" which references my other sites: awwsmm.com
All of these are on my CV anyway, so just linking to them rather than repeating everything is like DRY applied to web design.
Whatever you do for the love of all that is good, have a favicon. Nothing makes me worry more about what other little details a developer got wrong or important practices they deem as unnecessary than a missing or using the framework default's favicon image.
I found this medium.com/@johngranstrom/making-a... to be an interesting read on the topic
Well since you are learning React.
You can start off with converting your static sites to Gatsby.
Updating your about page is important to showcase your understanding and what your doing now.
If your not a blogger, you could post YouTube or short articles about design and frontend your looking into.
I find that it's hard for me to keep up in that area. So I always think that design is really cool and I follow articles when people is talking about them.
If it's a "personal" site and you're not trying to market yourself for a job, I'd say put whatever you want, don't worry about doing anything special with it. Put cat pictures and memes - put Ben's site to shame if you want. Have a separate site strictly for professional stuff like portfolio work. Make that one impressive (and nothing like Ben's).
Screenshots are not needed. Reduce down what you want to say to a simple headline and short statement about the project. Only include the React logo and a description of what you do with React i.e. I lead a team of engineers that work on React app company uses to market thier products. Minimal is key. Nobody has time to read about the full breath and scope of your work. Keep ideas byte sized.
It helps if your website is somewhat unique or stands out in some way. @bendhalpern has an awesome example that definitely also highlights his personality. That is even better.
In other words don’t copy this but make your site unique, to the point, and easily updatable so you can focus on all those other projects.
Just went to your site and it wasn't working for me (Firefox 65). Checked the console and had this error:
Looking at the resources you loaded though, it does sound like it would be an interesting site 😉
Huh... I just visited the site in Firefox 65 and it works!
Blank screen for me (iOS Safari) :(
But, I take your points though, has me reconsidering some things.
Explain what you achieved and what value you added to the businesses you worked for.
Github etc Profiles doesn't really matter up front, unless you contribute massively to open source projects or created a major open source app yourself.
It needs to be fast, responsive and accessible.
Should pass W3C validation and Lighthouse speed tests.
If you put a (C) year somewhere, make it dynamic so it doesn't show you haven't updated your website for 3 years (pun intended ;-))