The Best Summer Project For Software Engineering Students.

Introduction

We both know you’re going to end up wasting most of your summer break. You deserve to enjoy the break, yes. But it’s also important for you be productive during this time. And as software Engineering students, building a side-project is one of the best things you can do. Building a personal website is a great place to start. Web development is super fun and easy to get into, and with how low the barrier to entry is, you can code and host a website for free within a week or two.

Why Build A Personal Website?

The best part about software engineering is that we get to build cool stuff while simultaneously gaining an unfair advantage, both academically and professionally. A personal website is the perfect example. It’s a creative project that reflects your personality. It strengthens your personal brand, encourages project-based learning and helps secure more internships. Plus, only a small number of students have personal websites, so making one would give you a headstart.

Personal Branding

You can only fit so much on a resume. Your website on the other hand has much more space (and impact). As you build more projects, you can add them to your website. You can also write about your learning journey and share your experiences. You will slowly but surely earn a spot in a corner of the internet where anyone can find out more about you, like other students and potential employers. As for me, I have all my projects, blogs, skills and work experience showcased on my personal website. It is the first result that pops up when anyone searches for my name, which helps me make a strong first impression online.

Project-Based Learning

There will be times when you’ll be lost during lectures. But if you attend lectures with some pre-existing knowledge experience on the topic, you will find the course content more relatable. Building a website will definitely prepare you for any upcoming web based courses, and will get you into a habit of building projects in preparation for other courses. I personally love project-based learning and my good grades are a result of it. I found my Intro to Software Engineering course very easy as the theory from that course was the same as what I had previously learnt while building a notes app.

Internship Opportunities

Having a personal website shows interviewers that you have practical experiences. And when it comes to getting internships, having experience gives you a major advantage over the other candidates. The best part is when interviewers ask “what have you built?”. All you’ll need is a mere URL to showcase all your projects. This website is the sole reason I landed my first ever internship. I was asked to share my projects, to which I responded by telling the interviewer to search my name on google. This brought up my personal website, which has all my projects, as the first search result.

How To Build A Website

I wont go into the fine details on how to build a website. Rather, I’ll give you a high level breakdown of what you’ll need to do to get a website up on the web. The entire process will be divided into three main stages: the planning stage (where you’ll make important decisions about your website’s purpose and design), the development stage (where you’ll actually build the website), and the deployment stage (where you’ll make your website accessible to the world). We won’t build anything fancy, just a simple static website.

Design

You don’t have to come up with the perfect website on your first go. List out some basic requirements and just start building. This includes this like how you want your website to look like. So go choose a nice color palette and some fonts that fit your style. Another important thing to get sorted is the pages you plan to build out. You could consider starting with a home, about and contact page. Later, you can add a projects page when you have build a handful of projects. And if you need some inspiration, feel free to look up portfolio websites and how those sites structure their content.

Development

The only languages you need to build a website are HTML and CSS. You know how you can add text and images in Microsoft Word? Well thats what HTML does for websites (add content). And you know how can change the color and size of the text in Microsoft Word? That’s what CSS does for websites (add styling). These languages aren’t hard to learn and the you can learn most of it very quickly. If you can learn by reading, consider checking out some written guides. And if you are a visual learner, check out some tutorials on YouTube. I recommend writing your code in VS Code.

Deployment

Once you’re done coding out your website, you can then deploy it to the internet. This means other people will be able to see your website on their devices. If you want your website to show up on web searches, you will have to add search engine optimization and index your website. The best options for deploying websites for free are Netlify and Vercel. For Netlify, you can simply drag and drop your website folder to deploy it. Vercel doesn’t have this option. You’ll first have to setup a GitHub repository and link that to Vercel. Netlify is definitely the easier option if you are new, but learning Git and GitHub to deploy on Vercel will benefit you in the long run.

Evolving Your Website

As your website grows, you will come across various issues and annoyances. You will then realize that managing an entire website is not an easy task. You’ll come across situations where an element is on every page and to make a small change, you will have to update all the pages. Other times you might struggle to add a new features because of how you structured your website. But don’t worry, that’s a part of the learning process. This is when you should consider to evolve your website at an architectural level.

Using A Framework

Initially, your website might consist of just a few HTML files. As you add more pages and features, managing these files will become cumbersome. This is where frameworks come in. Frameworks like Astro, Next and SvelteKit provide prebuilt features that make web development faster and easier. Some of the things you’ll immediately fall in love with are reusable components and layouts. Other more advanced features that you will also like include dynamic routes and the ease of creating backends.

Using A CMS

A content management system (CMS) is software that helps you manage your content without touching your code. Headless CMSs, like Contentful, Directus, Prismic, Sanity and Strapi go a step further. They act as external storage for your content, which can then be delivered to your website. Let’s say you have a personal blog website. You will be able create new web pages automatically just by adding posts in the CMS. If you later decide to change the framework you are using, you can simply connect the new framework to the existing CSM and you content will not be affected.

Self-Hosting

Self-hosting is when you manually setup up the deployment phase of your website. Self-hosting your personal website is overkill and you’ll be perfectly fine using Netlify or Vercel. But if you’re like me and want to do it anyways, you should. It’s a great learning experience and will help you get start with DevOps. You’ll need to Dockerize your website, set up a CI/CD pipeline, acquire a server, configure that server, and deploy your website. This should be a long term goal as you will need to learn quite a bit before getting started.

Final Thoughts

Building a personal website is an incredibly valuable summer project for software engineering students. It’s a great way to showcase your skills, build your personal brand, and gain practical experience that sets you apart from your peers. It’s a project that grows with you, evolving as you learn new technologies and build more impressive projects. So don’t waste time this summer, and start building your website. Your future self will thank you.