2 Ways to Practice JavaScript

You've got the basics of JavaScript down, understanding how things work.

Yet, when it comes to applying your knowledge, you feel stuck.

People often advise you to 'build something on your own' or 'start a small project,' but as a beginner, it seems challenging. I understand the situation you're in.

Here are two ways to practice JavaScript and improve your skills:

1. Try your hand at coding problems

When you've learned a concept and want to practice it, the best way is to do coding exercises. These are small, well-defined problems that help you test your knowledge quickly.

Doing few problems each day will help you to reinforce all the concepts you've learned so far.

Not sure where to start with a coding problems? Here are a few good ones:

• Codewars

• Edabit

• Leetcode

• Exercism

2. Practice your skills by taking on a personal project

Building projects is the best way to gain real-world experience with JavaScript concepts.

It's easy for me to say, "to get better, just go and make a project," but I understand it can feel overwhelming when you're a beginner. Let me guide you on how to go about this.

Step 1: Start small

You don’t have to begin with a large project that overwhelms you. Start with a small project, like a simple expense tracker, and slowly iterate to projects that grow in complexity over time.

Also, make sure you select a project that solves a problem you are passionate about. Choosing something common, like a to-do list, may become demotivating when you get stuck. Projects you are passionate about will help you stay motivated even in difficult situations.

Not able to come up with a project ideas? Check out these tips.

Step 2: Divide into smaller chunks

When you look at the project as a whole, it can be overwhelming, and you might not know where to start.

Start by breaking down a project on paper. Let's take an expense tracker app as an example. What does it need to do? List out various functionalities:

• Add an expense

• Display a summary of total expenses

• Include a simple graphical representation, like a bar chart or pie chart, to visualize the distribution of expenses, etc.

Now, focus on the first bullet point. Break it down into smaller tasks. What do you need to implement "add an expense"?

• Have a button to display the UI to add an expense

• Show the UI to type in the contents of the expense

• Store the expense in an array (or database or whatever)

All of this happens without worrying too much about the actual code. Repeat this process until you reach a level where the pieces are small enough for you to figure out how to code them.

Don't try to plan out all the features at once. Break down one feature enough to start writing some code. With practice, this process will become easier.

If you get stuck, that's completely normal, and it happens to everyone frequently. So, don't give up. Keep searching for solutions, try different approaches, and reach out to others to problem-solve together.