5 Projects to Learn Coding in 2021
Tags: programming, coding, tips
Published: 2021-02-19 08:43:02

---
title: 5 Projects to Learn Coding in 2021
published: true
description: You want to become better at coding, you've taken all the tutorials but you still feel lost. These 5 app ideas will help you improve both your skills AND your portfolio of projects to get that dream job.
tags: Programming, Coding, Tips
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/146s3ve1zt5vgd2yom5m.png
main_image: ![Code Thinking by unDraw](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/146s3ve1zt5vgd2yom5m.png)
canonical_url: https://dailydev.io/posts/5-projects-to-learn-coding-in-2021
---
> You can watch the video for this post on [YouTube](https://youtu.be/0yUeeOTsvcQ). 

In the previous article that you can find [here](https://dailydev.io/posts/5-tips-to-stay-motivated-while-learning-to-code), we talked about 5 tips that you could follow in order to stay motivated while learning a new skill, like coding.  The very first key point was __"Practice what you have learned"__ as this is the single best way to be able to retain what you have learned to then easily apply it as you move along to more advanced concepts. We even ended the video with a twist to the old saying: __"Practice makes fluent"__.

Now, you may even agree with all that but you still raise a valid question: __"How do I get ideas on what to build with the skills I have just learned?"__. 

Today, we will be introducing 5 different app ideas to challenge you and to hone in your newly gained skills. We will be going from an *easy* level of difficulty to a higher level, in that order, so feel free to skip some of them if you are already comfortable with some more basic concepts.

These app ideas were adapted from a great online list put together by [Florin Pop on GitHub](https://github.com/florinpop17/app-ideas). In there, you can find a long list of app ideas bundled by the level of knowledge or interest of the developer. On each individual app, you will find a description of the project, applicable constraints for development and user stories to guide you through your development). Some of them also have example apps created by the community. This is incredible and I strongly recommend that you complete as many of them as you can.

I selected 5 specific ideas that I feel are the best to improve your skills, as they provide a good balance of being challenging and with common real-life applications. So let's take a look at them!  

### App Idea #1 - Border-Radius Previewer
In #1 we have a simple and good introduction to the manipulation of a reactive state, with a Border radius preview app. You should be able to listen to several inputs change and render their effect on an HTML element's `border-radius` CCS property. __See the project's specification [here](https://github.com/florinpop17/app-ideas/blob/master/Projects/1-Beginner/Border-Radius-Previewer.md).__

{% codepen https://codepen.io/thebabydino/pen/zbqPVd %}

### App Idea #2 - Countdown Timer
Next, up, we have a slightly more difficult challenge, but still within the beginner tier, which is a Countdown timer. This challenge will introduce you to some new browser APIs, like setInterval. The goal is to make use of interval functions to manipulate the `DOM`elements containing the number and update them accordingly. __See the project's specification [here](https://github.com/florinpop17/app-ideas/blob/master/Projects/1-Beginner/Countdown-Timer-App.md).__

{% codepen https://codepen.io/FlorinPop17/pen/YbpwyG %}

### App Idea #3 - Weather App
The last project in our beginner tier will test your skills for external APIs integration. It is a well-known, Weather App. But try to make yours stand out, give it something unique. __See the project's specification [here](https://github.com/florinpop17/app-ideas/blob/master/Projects/1-Beginner/Weather-App.md).__

{% codepen https://codepen.io/tutsplus/pen/gObLaEP %}

### App Idea #4 - Regular Expressions Helper
Now going on to tier 2, Intermediate level. This project is extremely valuable as it will solidify many of the previous project's knowledge but also make you practice a very important aspect of programming, which are regular expressions. __See the project's specification [here](https://github.com/florinpop17/app-ideas/blob/master/Projects/2-Intermediate/RegExp-Helper-App.md).__

![RegExr Website](https://res.cloudinary.com/dydevwhyk/image/upload/q_auto/v1613721365/posts/ezgif.com-gif-maker_10_xrie7l.gif)

### App Idea #5 - Real-Time Chat App
The last project, and the only one on the Advanced tier, is a Realtime Chat App. This is a great project because it will involve many new concepts, like sockets and real-time databases, but it is also one of the most well-documented apps that you can find on the web, so if you get stuck, there is plenty of help out there to reach your final destination.__See the project's specification [here](https://github.com/florinpop17/app-ideas/blob/master/Projects/3-Advanced/Chat-App.md).__

![Real-Time Chat App Demo](https://res.cloudinary.com/dydevwhyk/image/upload/q_auto/v1613721485/posts/DemoT2_ChatAp_peudlq.gif)

## Takeaways

And there you have it, these were the 5 projects that I recommend for you to start practicing your skills and improving yourself to eventually land that dream job! There are many more on that [GitHub list](https://github.com/florinpop17/app-ideas/blob/master/README.md) and I strongly recommend you to practice by doing as many as you can, whenever you have time. Remember, the best method to improve, is by __consistently applying the skills you have acquired__.

Happy coding!