Blog

Sharing my experiences and insights in the tech world

How I Built and Deployed My Portfolio Website Free of Charge in Just One Day: Developer's Quick Guide.

Author: Chidera Uzoigwe | Date: August 4, 2024

My Journey into Tech

Most of the time, I'm a backend developer working with Java. But sometimes, like today, I dust off my frontend skills and do something pretty creative with HTML, CSS and Javascript.

Building a Portfolio website was the first project I was assigned as part of my Headstarter Fellowship. Since I already have a full time backend job and other engagements, I decided to use one of Headstarter's recommended Template websites instead of building from scratch.

As a Software Engineer, it is advisable to focus bulk of the effort for creating your website on SEO optimization and copywriting while taking advantage of any already existing technical resources you can lay hands on.

Before, the end of this article, I will give you tips on SEO optimization for your website.

So, I checked out template sites likeWebflow , Jekyll Themes and HTML5 UP. I ended up picking a template from HTML5 UP. They have very nice FREE templates unlike Webflow which I found out you have to subscribe to their basic plan at least, in order to export code (so keep that in mind too).

My Journey into Tech

After downloading the template, I spent time editing the code on Visual Studio Code using my knowledge of HTML, CSS and Javascript. I cleaned up unnecessary pages and images (always remember less is more),added a few new features like a Blog Section and Project section, while enhancing already existing features.

Add features!.. Enhance features! Just another day in the office for a software engineer.

Next, I focused on copywriting and Search Engine Optimization (SEO) of my website.

My Journey into Tech

Tips and Tricks for SEO Optimization: First tip is to ensure that you add an alt attribute to every image on your portfolio website. Within the alt quotes type in your full name.

Another SEO tip is to link to high-ranking websites like your LinkedIn, Instagram, Facebook, and GitHub profiles from your website, and reciprocate by linking back to your website from these profiles

Another SEO tip is to link to high-ranking websites like your LinkedIn, Instagram, Facebook, and GitHub profiles from your website, and reciprocate by linking back to your website from these profiles

On to Deployment. I explored a number of options such as Namecheap, Netlify, Github Landing Pages, and Github Student Pack. I later settled for deploying with Netlify and Github because it was free and I was allowed to use my first name and surname as domain name. Unlike the domain name I was offered by Github landing pages (my Github username..totally unprofessional)

My Journey into Tech

AAANND that's basically how I built and deployed my portfolio website in just 24 hours! Laying the foundation with a professional template really contributed to the speed and efficiency of the project. I didn't have to start from scratch.

Also let's not forget my Artificial Intelligence tools ChatGPT and my latest discovery Perplexity AI. They helped me immensely with copywriting. I will talk about Perplexity AI and its research superpowers in another article.

Feel free to check out my portfolio's Github repo here. Let me know what you think in the comments. If you later build your own portfolio this way, do share the link with me as well. I'd love to see what you come up with. Until next time Devs. Happy Building!