DEV Community

Cover image for Evolution of My Personal Site
Daniel Starner
Daniel Starner

Posted on

Evolution of My Personal Site

I just redesigned my personal website for what seems like the 500th time. To be honest, I did this because I was too lazy to re-gain access to the DigitalOcean droplet my previous site was on.

This time, I went with a very, very basic layout; totally gray background, my name, some taglines, links to my account, and a gif of the flying toaster from the After Dark screensavers of the 90s.

New Site

This site took me only about an hour to make. Full disclosure, the layout is just create-react-app's initial layout, with some extra sauce added in for my links.

I realized that as time goes on, my personal sites have gotten more barebones, and I have prioritized them less and less from their previous versions.

The First Few Sites

The first few sites I had were under a free domain I received at a hackathon, danstarner.me. I was just learning web development, so I googled "Free HTML Resume Template" and picked the first one that looked visually appealing to me.

I built this site using Python Flask, and even though it was small, the code was quite a mess. I initially deployed it via Heroku, since I didn't know anything about setting up reverse proxies or server management. I didn't care though, I had a site that was mine, and it felt so good.

From there, I got a little greedy, and had learned a few things. I jumped back and forth a few iterations between Python's Django and Flask frameworks, but they all did the same thing. I tried to include a dynamic blog, and that led me down my first path of learning what a database was. It was wild...Like, I had control over what data was displayed on my site, and I didn't even have to redeploy? That was pretty cool.

These sites became more complex, and I would spend days and weeks trying to add all the features that I wanted; Markdown to HTML posts, post tagging, commenting, flagging...the whole 9 yards.

Slowly, building my personal site took up more time than the projects I was showcasing on it. I was infatuated with making my site the best it could possibly be...but then...

The Burnout

I slowly started to give less care to my own site, as it became too big of a beast. I had hacked it together as time went on, feature by feature as I learned how to do things. This meant I had left no documentation on how to manage or care for anything. Updating static information or deploying fixes just never happened, because I couldn't find the time, energy, or motivation to do it. Even writing for my blog slowly stopped, as I just found it to cumbersome to work with.

It was a sad time for my site, but one that transformed my thought process on how I should go about everything...

I have the programmer mentality of "I know that tool exists, but I'm just going to build my own version." This is okay in some regards, but why was I rebuilding a whole server and webstack for a site that was mainly static? So, I caved.

The Time of Static Sites

I tried using static site generators like Jekyll, Metalsmith, Wintersmith, and the sorts, but I just could never really fall in love with them. I always wanted an in-browser experience of updating and creating new content. I didn't want to have to redeploy every time.

I also found that I wasn't very good at editing the Mustache or Jade templates to look a way that I liked, and the default views just seemed too basic for me.

I tested out GitHub pages, and for awhile my personal site was pure HTML, no JavaScript or CSS, because I used it for an example in a basic web design class that I was teaching.

My personal site received no love, and it was like a barren wasteland of year(s) old content. What a sad, sad situation...

Barren Wasteland

A New Outlook

After some time of disarray, I started to think about my personal site again. I wanted to start blogging more often, and for that to happen, I needed a website I was proud of. The company I was working with at the time was using Ghost to manage their blog. In the past, I tried creating my own blogging software. I never found it terribly difficult, but it was something that I didn't want to manage anymore.

I gave Ghost a try, using DigitalOcean's One Click Image, and oh boy, it was everything and more that I wanted in a blogging platform...plus! Since it was open sourced (Yay #Hacktoberfest) it was free πŸ€‘πŸ€‘ (Granted, the DigitalOcean hosting was $5 a month, but it was still worth it.) It's still the blogging software that I use, and I haven't had to touch it much, minus upgrading from v1 to v2 for all their cool new features. I still recommend this route to friends who want to start blogging (minus dev.to, of course πŸ˜ƒ).

Finally, I reduced my personal website down to its core components. My name, a tagline or two, and some links to all of my accounts. No more complicated matters, no more databases or complex MVCs...just the basics hosted on GitHub Pages.

And you know what? It feels great now! If I need to make an updates, its a simple change and a single npm command. I sort of went back to the static site feel of before, but since all of my content is on my blog, I feel as though this is all manageable. Speaking of the blog, writing posts is just as easy and fast with Ghost now, with none of the hassle!

What journey have you gone through with your personal website? Similar iterations and struggles, or what? I'll probably change my site again in the future, but for now, all feels well in the world.

At Peace

Top comments (15)

Collapse
 
nektro profile image
Meghan (she/her) • Edited

Love the new site! And I can totally relate to the personal website evolution. It's one of the few things I work on with tech debt. I personally use gulp and gulp-include-html to build my pages, but it definitely needs some love and a redesign. It's missing a lot of projects and doesn't even have my new profile picture. (me.nektro.net/ and github.com/nektro/me.nektro.net for the curious)

Collapse
 
dan_starner profile image
Daniel Starner

This is a pretty awesome site though! I love the portal picture lol πŸ‘

Collapse
 
nektro profile image
Meghan (she/her)

Thanks! I drew it myself in paint.net

Collapse
 
hasnayeen profile image
Nehal Hasnayeen

I kinda did similar things for my personal project. Mine is also a create-react-app hosted on github page and the dynamic data are also at github repo, so whenever I want to update anything like a new addition to book list I read, I just update the data file directly on the repo, no build or deploy anything. such a piece of mind.
hasnayeen.github.io/

Collapse
 
dan_starner profile image
Daniel Starner

Oh, that's a really good idea! Then that's less stuff to update in the future...I might use this idea when I inevitable re-design my website for a 501st time

Collapse
 
jason_espin profile image
Jason Espin

Mine has never gotten off the ground. I have the hosting (free thanks to some development awards I gained a couple of years ago) but I never know what I actually want my site to be. As a full-stack developer I absolutely suck at design and cannot dream up the perfect template. I also don't want to go to some random template site and use that as I have no confidence in someone else's code being of good quality so I would rather just have a design and implement it myself. The main bugbear though is time. I'm so busy coding day in day out and earning a living that in my spare time I don't want to code. I want to sit down and watch some TV or play some games or follow one of my other interests. I guess as someone who only takes permanent roles it's not that much of an issue but I can understand why those who work as contractors may want / need a personal site but if i'm honest, when I am looking to hire people if they have a personal site and have been working full-time it suggests to me they either haven't been all that busy or they code too much. Just my 2 cents.

Collapse
 
thejessleigh profile image
jess unrein

I used to have a wordpress blog on WPEngine that I was constantly begging my friends to "guest contribute" to, but that was way too much work and not very rewarding, in retrospect. I've also tried various versions of creating my own minimal Flask app, or using Jekyll for putting out content. At this point my personal site is just a link dump of content elsewhere on the internet (like dev.to :) ), and I'm pretty happy with that being the case. I hate the design of my site, but I'm no designer. I think I'm going to hire one of my talented designer friends to help me spruce the place up. But in terms of content, I think I'm probably good.

Oh! One thing I actually really do like in terms of personal site content is having a /now page. It's a cute way to inject some personality into my site. It's also a landing page that I can send to my relatives to let them know what's going on with me. I highly recommend it.

Collapse
 
matthewbdaly profile image
Matthew Daly

Mine started out as static HTML, before spending several years as a WordPress site. After a while I wanted to write more tutorials and wasn't happy with how WordPress handled syntax highlighting, so I migrated it to Octopress. A few years later I grew to dislike having to use the Ruby ecosystem for my site, so I created a Grunt static site generator plugin, and that is what I still use.

Collapse
 
mawalu profile image
Martin Wagner • Edited

Hah I can relate to the development of personal homepages. I also started mine when I learned about web development, tried to create a custom CMS, switched between different others and ended with some static html. I like the design of your current version, only remark is that it requires javascript (and even the react) to just show some text and links.

Collapse
 
dan_starner profile image
Daniel Starner

Yea, I made it rather quickly with create react app, and there's no dynamic data in it, so I am probably going to remove the javascript all together (when I can find the time)...thanks for the feedback! πŸ‘

Collapse
 
tomvorel13 profile image
Tomas Vorel

I agree that personal sites shouldn't be overly complicated. These days static site generators make it extremely easy to make a simple summary of your career with some contact info in almost no time at all. Simple yet powerful.

Collapse
 
notriddle profile image
Michael "notriddle" Howell

At the point where you have a few links and a picture, I wouldn't even bother using create-react-app. Just sixteen lines of HTML, with the CSS mixed right in, works well enough for me.

Collapse
 
robertcoopercode profile image
Robert Cooper • Edited

I have the same need to constantly change my personal website. I'm actually trying to plan another complete revamp of my website which will include a blog this time around.

Collapse
 
ben profile image
Ben Halpern

Really fun! Definitely shows off some personality without being too chaotic. Well-done.

Collapse
 
dan_starner profile image
Daniel Starner

Thanks for the feedback! πŸ‘