Break Tasks Into Chunks! — An Important Advice I Wish I Knew Sooner
Tags: productivity, codenewbie, todayilearned, watercooler
Published: 2020-12-19 07:31:00

Hello Fellow Codenewbies 👋

I've been learning web development as a self-taught for almost two years.
And I created the first-ever vanilla Javascript mini-project by myself six months ago! 
You must be wondering why it took me that long to create a project 😅

## Background Story
I coded along with a tutorial to create a project.
At one point, I jumped with joy because I understood how things work.
Then ideas for some projects popped up in my mind.

I sat behind my computer, loaded with motivation, getting ready to create a project.
But then I ended up staring at the blank text editor, having no idea where to start.

The next time, with a new spirit, I sat and managed to write some codes.
But this time, I got lost because at first I Googled things needed for my project, but then my search spread to many unrelated things, and I got so distracted.
In the end, I ended up with an unfinished project.

I felt defeated and doubted myself.
What happened next was I got trapped in the famous *tutorial hell* because I felt like I knew nothing and needed to re-learn everything.

Repeat this for more than a year, and that's how I didn't complete a single project.

One day, I had a coworking session with my fellow moms from Moms Can Code.
I told them I had some ideas about mini-projects but never finished any.
And I got this advice that I put into practice. I wish I had known it sooner!

---

## Break Tasks Into Chunks!

> Create a plan, a [mockup](https://en.wikipedia.org/wiki/Mockup), and be patient!

Yes, that was the advice that I got.

Most of the time, when I have a project in mind, I just go for it.
And most of the time, I failed big time.

One of the reasons is that I didn't have a guide on where I should start and how I should do it, step by step.

There are plenty of free apps to create a mockup and a plan.
I'm a conservative person. So I used paper and pen to create one.

For example, when I built this [Guess The Number](https://codepen.io/adiati/full/dyGvwML) game, where a user has to guess a number and a message will be thrown on a right or a wrong answer.

Then I made the plan, and this is how I did it.

![mockup](https://cdn.hashnode.com/res/hashnode/image/upload/v1608246191500/7uyjxxQn7.jpeg)

1. Draft the layout (mockup) of the app
2. Decide the features of the app and keep them as simple as possible at the beginning
3. Write down the elements and what every single element will do, along with the flow
4. Write down the steps on how to achieve it

**Work on one element at a time** until it works, then move to the next.
Stick to the plan and be patient!

Then I added some *for-fun* features where the app shows the mystery number and how many times the user has tried to guess the number.
But that was *only after* everything that I'd written on my plan was done.

To my surprise, I **finished** this project in 4 hours! 🎉

In addition to this, I also used [Pomodoro Technique](https://en.wikipedia.org/wiki/Pomodoro_Technique) to [avoid burnout](https://dev.to/adiatiayu/overcoming-burnout-in-programming-learning-1c18) and keep a fresh mind.

## I Wish I Knew This Advice Sooner

Creating a plan and a mockup is ***very important*** when we want to create a project.
They are ***very powerful*** to keep us on track and increase our productivity.
I wish I had known this sooner.
But I hope now you know this on time, way sooner than I did 😃

---

Thank you for reading!
Last but not least, you can find me on [Twitter](https://twitter.com/AdiatiAyu). Let's connect! 😊