A 6 Step System for Creating an Incredible Side Project as a Software Developer
You want to create a great side project.
One that increases your hireability, skillset and expands your knowledge (and maybe your salary).
We are going to walk through the step by step process I’ve used to create side projects that have done just that.
The problem with your standard TODO app is that it exposes you to a technology but is nothing like what you will encounter in a production environment. You may think you know ReactJS or MongoDB from creating a simple CRUD app. You’re not wrong. You’ve gained some information and practical skill but at best you have shallow knowledge.
Let’s build something interesting.
When I first started writing code professionally, I used AngularJS, C# and SQL. Not the most cutting edge stack.
The next role: ReactJS, NodeJS and MongoDB. So how did I land a job as a mid-level developer at a ReactJS/NodeJS shop?
Simple — I built a complex web app using these technologies which prepared me for the interview and the actual job. I was able to hit the ground running.
Here are the steps I use to create a solid side project when I don’t really know what to build.
1. Pick an API
The API layer is the heart of the application. If you’re stuck on what to build, always start with the API/data.
A good API will have solid documentation and should challenge you in its implementation.
Ideally it’s more than just a single endpoint with a GET request but that’s fine to start with if you are a beginner or it fits your needs.
Here are some lists of APIs you can start with:
2. Pick a framework
Let me make this pretty simple for you: choose one of the BIG 3 JS frameworks
- ReactJS/NextJS
- Angular
- Vue
A good rule of thumb is to pick a framework you’re interested in learning or diving deeper into. For example, you may use ReactJS at work but not Typescript. This is a great opportunity to incorporate TS.
State management is an integral part of any sophisticated app. Choose one you want to learn or are not familiar with:
- Redux
- Zustand
- React-Query
3. Pick a backend stack
The application API will handle authentication and persist any data which needs to be stored in a database.
Pick a language and framework you want to learn more about. I use Node/Express at work so I might pick Python/Django for a backend option or Go.
For a DB, you have some economical (read — FREE) choices. MongoDB is a safe choice. AWS offers a similar key-value store, DynamoDB. Of course SQL.
4. Pick a CSS Framework
Are you still using Bootstrap 3 at work? I was 😅.
Pick a cutting edge CSS framework or one that you want to learn.
Remember this project is about learning, not falling back on the same stack you use at work or your bootcamp. Tailwind, AntD or Material UI may suit your needs. If you’re over CSS libraries, maybe you explore css modules?
Plain CSS?! What a novel idea.
5. User Flow
Now you have your languages, frameworks and APIs chosen. Good. Here comes the fun part:
Perhaps the most difficult aspect of building a side project is deciding what the app should actually do… this is why I suspect so many people fall back on TODO lists, weather apps and movie finders.
Dig into the API you’ve chosen in step 1. What are some interesting features you can leverage? For example, the city of San Francisco used to offer an API to search for violent crime which returned the coordinates of crime events. Displaying that information on a map would be interesting or pairing it with a graph to display crime trends could be useful as well.
- Map out the basic user flow.
- Do they need to login?
- What is the first screen they are greeted with?
Draw some crude sketches of the main screens you need to support. Don’t get too caught up in the details of things like forgot password flows or anything other than the MVP (minimum viable product). What are the must haves? Focus on those.
6. Hosting
Netlify? Heroku? Other?
Just use AWS. Nearly every company uses AWS for hosting. There are free tiers on AWS and using services like EC2, Amplify, Code Pipelines and Lambdas will give you some hands-on experience in the devops process.
Go with Vercel if you’re using NextJS and save yourself some headache.
Using AWS is actually where I found the most value as a front end focused developer. The exact same processes I learned when deploying my front end and API apps, I was able to apply to my current role as a developer.
I could speak more intelligently with our devops engineers and add value to the discussions we had around pipeline issues and troubleshooting.
Wrapping Up
It can be tempting to use ALL the new technologies when building a side project. I suggest picking 25% new technologies and 75% familiar choices.
Going all in on a brand new stack, language, deployment process and database layer can be overwhelming. The high level goal is to build something complex which you can deploy and iterate on.
You’re going to learn a hell of a lot more following this process than another TODO app. Good luck!
If you’re overwhelmed with what to learn to be a hire-able developer just join Parsity — an online coding program for career changers.
Know how to code and want a challenge to level you tf up? Join Javascript Pros.
