This is a post I have thought about writing for a long time, I originally published it on my blog in more detail here. But, I thought it could help more people in this community so I wanted to share a snappier version.
In this article, I am going explain how to plan and build a programming project. I will show you how to break down a project, so that you can start making awesome projects to help you level up your coding skills.
This article aims to help code newbies feel less intimidated as they attempt to leave tutorial purgatory and build their own awesome coding projects. So if that sounds like you keep reading.
Projects are super intimidating when you are first starting out, it can seem like such a huge mountain to climb when you can't even reproduce the results of the YouTube tutorial you just watched without looking at it again 30 times 🤦♂️.
When I first started out learning to code, I would start a course or follow a tutorial and think that I was understanding things. But, when I'd stop watching and try to reproduce the project I couldn't get anywhere.
To overcome this, I posted my frustration on the popular subreddit r/learnprogramming. The responses I received were all centered around building my own projects. This advice sounds great on the surface and was the right advice, yet the issue for me was I couldn't even watch a tutorial and reproduce the results. How was I supposed to build a project? A project is 10 levels above a tutorial and at the time it seemed that projects were so far away from my abilities. I had no clue how to even get started, let alone how I was going to put it all together. The problem essentially was I didn't know how to get from point A to point B.
This is an issue I see all the time on r/learnprogramming. Beginners like me are frustrated that they can't seem to get out of tutorial purgatory and so they seek advice. But, what they get is well meaning redditor's slamming the build projects response in their face without even considering that if the newbie can't even replicate a tutorial how are they going to create their own project. In my time learning to program I have seen so many examples of the same question I had and the same responses. I thought it was about time I did something about it and gave back to the universe.
So here I am, writing a post that actually breaks down how to build your own projects so that you can become a better developer and cement what you learning.
In order to plan and build a programming project there are three key steps I now use when building projects so let's start with the first step.
Step 1: Defining the project
The first step when planning a programming project is to define it.
When I am defining the project I ask myself these 4 questions:
What is the project?
What is the MVP (Minimal Viable Product)?
What are the nice to haves?
When will the project be complete?
Example project definition
To give a simple example, let's say we are going to build a calculator app we would have a basic project definition like below.
Calculator app project
What is the project? - The calculator project is a project to build a calculator that is accessible in a web browser. The project is going to be solved using HTML, CSS and JavaScript. It will allow users to input numbers and calculate the results of those numbers based on the arithmetic operation they choose.
What is the MVP? - The minimal viable product is a calculator that renders in a web browsers that can perform addition, subtraction, multiplication and division operations based on a users input and show the user the result of that equation.
What are the nice to haves? - The nice to haves for this project are styling the calculator, taking keyboard presses as input not just users clicking buttons and adding higher order operations like 'to the power of x'.
When will the project be complete? - The project will be complete once all the MVP features have been implemented and the calculator has been styled.
The above definition is simple and straight forward. If my Mum picked it up she would understand what the project is about. She would understand because it tells you what the project is, the MVP features you must build, the nice to have features and when it will be complete. By defining the project you make a project less intimidating.
Once you have the project definition you can begin the next step.
Step 2: Creating the workflow
The next step is the simplest. Usually this step can be combined with step 3. But, just for now we are going to look at it here as a separate step so that I can show you how to set up a very basic workflow for your own projects. Once you have done it once, it can be a default step for the rest of your projects.
You first want to use something like Trello a free tool to manage projects.
To set up our Kanban board we want to create 4 columns.
- TODO
- DOING
- DONE
- BUGS / NOT SURE HOW TO DO
Within these columns we are going to add cards. As we work on the cards we move them into the doing column and once we have finished with that card we can move it to the done column. If you have a bug you are stuck on or are not sure how to do something we can move it to the bugs/not sure column.
Now we have our workflow set up we can get onto the last step, the one that stumped me the most when I was learning to code.
Step 3: Breaking the project down into smaller components
The key to building your own projects starts with breaking the big project down into smaller, less intimidating components. These smaller components are what become our cards from step 2.
Now this sounds simple enough, but when I was first starting out it did not occur to me that you could do this. I thought most developers just start coding and the project flowed out of them like you see in the movies. I thought that was what I was supposed to be able to do. However, now that I have had a chance to work in the industry I know that is definitely not the case, in fact a good developer will break that project down into smaller tasks.
Yet, as a beginner it can be hard to know how to break something down into smaller tasks. If you don't know how to actually build the project then how can you break it down?
Well the first thing you need to do is look at your project definition and then break it down into smaller parts.
Let's continue using the calculator app example to make our component cards:
- Calculation functions - MVP
- Get user input - MVP
- HTML user interface - MVP
- Style user interface - sprinkles
- JavaScript event listeners - MVP
- Add animations for calculations - sprinkles
You'll notice that for each card, we assigned a label of either MVP or sprinkles this is to visually help you see which cards are the most important and therefore the ones to work on first.
The biggest benefit of the cards is that they have simplified what we have to do already. This makes projects less intimidating as you are not making a big daunting calculator app, rather you are doing 6 smaller projects that will combine to create one big project.
As you work on a card you move it into the doing column. Taking your time to get the component working before you move onto the next card.
But we are not done yet, we can simplify and improve our workflow even more to ensure we are not getting blocked by the size of the project when building.
Break each component into smaller checklists
Once we have the high level cards we can then break those components down again into smaller tasks by breaking those tasks into checklists so we can track our progress.
The example below is just how my brain works so you can break it into smaller or larger items depending on what works for you. Let's use the calculation functions card as an example of how to break a component down further.
As the task is an MVP task and I have defined the MVP as basic calculations addition, subtraction, multiplication and division we need to add those functions to the checklist.
We have now broken our calculation functions card into 4 little projects that we can work on. How much easier is that than the abstract and super daunting task of building a calculator app, or even writing the calculator functions (the card).
We can now focus and figure out how to make each of these functions. As we do that we get to check those items off giving us a sense of accomplishment and progress. Then once we have done all four of those items we can move the card into the done column and get cracking on the next card.
From here on we just need to repeat the process for each card. So you are ready to get building awesome projects.
Start building your programming project
Now you have the tools to plan and build a programming project. Hopefully this post has made the concept of building projects less abstract and intimidating.
The key is to clearly define the project, set up your workflow and then break the project down into smaller components that all build towards creating the larger project. By doing so the project doesn't seem like this enormous mountain to climb, instead it should feel more like a ladder with each step helping you reach your goal.
If you see someone on r/learnprogramming in the future struggling to get out of tutorial purgatory, don't just tell them to build. Tell them how to plan and build.
Planning is great, but the key is to then start and build. So go forth and build amazing projects and level up your coding skills.
I send hot tweets so follow me on twitter, to save scrolling time, so you have more coding time.
Top comments (31)
Thanks for writing this post, I have experienced the frustration of asking for help being told to build projects and having no idea how to build them.
This post makes it really clear how I can now start building my own projects without having to follow tutorials.
Hey that's awesome I'm glad this post was helpful. Share your progress on twitter and I can check it out.
Thanks for writing this post.
This is a very important topic, most people either get stuck in tutorial hell, or they have an amazing idea but due to lack of planning, they never start or finish them.
Personally, I will be following these steps on a current project and see if I can finish it in a relatively small amount of time.
Thanks for the kind words.
Let me know as you go if you feel the post was missing anything. Good luck.
Very useful article! Tutorial hell is real and many go through that process and it's not easy to get through that phase.
My rule of thumb for this is to think that there is no course, tutorial or guide that eliminates the need to get your hands dirty and work hard, you may need them to know how to get started or to know what things you are missing, but the concept of "from zero to hero" without practicing and doing projects on your own is totally false.
The other barrier may be "having ideas", but now there are a lot of websites or posts here with cool and easy to do projects.
And don't worry about building something that isn't perfect, a finished project will always be better valued and more useful than a super elitist half-finished one.
Great points.
100% agree with not worrying about building something that isn't perfect, always better to have something finished that you can show vs. something half done buried in your projects folder.
Hi Peter,
thank you for your article. I had a good time reading it :)!
In my opinion, learning how to deal with your own work is a skill, that is very useful in many aspect of life. That's why I'm all the more pleased that your article exists.
Thanks for the support. Glad you liked it.
Great post!
As a professional developer for 3 months(ish) I can relate with the frustration while facing a complex project, and Trello became my best friend.
I've started building a "Personal API" to CRUD some information about my work-shifts, bookmarks etc, and I'm planning to extend it with a GUI (not sure yet if web or mobile).
The project is in it's early stages so I didn't add all cards yet. just the backend stuff, yet I would like to share a screenshot of my board, it may help somebody one day.
Amazing! Thanks for sharing the Trello board with a real world example. I think this will definitely help people.
What we usually do (even in huge projects) is we just start by defining the UI.
Once you have the UI you can break it into tasks.
But I'd say that if you're doing a personal project just go screen by screen till you're done. Also, make it work first, don't get too fancy. You can always make it better later.
I learned as a beginner that when I tried very very hard to come up with a good design that I'd end up throwing it away anyway. So don't try. Just make a minimal thing work and then refactor it into shape later.
Nothing better than watching something work rather than a bunch of code that does nothing yet because you still have to implement 20 classes.
Great work. One thing I have to note is that planning is burdensome if you're not really feeling the inspiration to do the project. So my advise is to find a project you actually want to do or care about. Like if someone wants to build a CRUD and they like to play DOTA 2 for example, they could make a CRUD App of their favorite Dota 2 item builds for some character. The more motivated, the more likely they'll push through.
Thanks for the post!
I think that's an idea that I had but now reading and it self being broken into steps it's more clear to me... I set a challenge to myself, complete a little project I wanted using your model, lets see how I go
I hope it helps, great idea to set a challenge.
DM me with how you're going with it on twitter.
Ooh, sure! It'd be nice to talk about it! Thanks for the attention
Thank you for the advice. Much needed.
I do use GitHub issues sometimes to track all the features I'm going to build and bugs I have found but after reading the post, I think trello is more organized.
Thank you for posting this !
Right now I'm stucking in tutorials, i want to start building my own project but i always don't know how to start, don't know how to resolve a problem.
This will help me