Harder App Ideas to Get Good at JavaScript

John Au-Yeung - Aug 1 '20 - - Dev Community

Subscribe to my email list now at http://jauyeung.net/subscribe/

Follow me on Twitter at https://twitter.com/AuMayeung

Many more articles at https://medium.com/@hohanga

Even more articles at http://thewebdev.info/

To get good at JavaScript, you have to practice a lot. To practice a lot, you probably need a variety of app ideas.

In this article, we’ll look at some app and widgets ideas we can use to practice JavaScript programming.

Random Wikipedia Article App

We can use the Wikipedia API to get a regular Wikipedia article.

To get a random Wikipedia article, we’ve to choose a random article ID and then retrieve the article with the API.

Also, we’ve to parse the character sets and display them article properly. This may be a challenge since the articles may be written in characters that may not be displayed property on our browsers without intervention.

Weather App

We can use the OpenWeatherMap API, which has a free tier that’s good enough to make a practice app with.

We can use it to search for data weather data like weather forecast by location and then display them on a screen.

Also, we can make a browser extension to display the weather as a widget.

Tip Calculator

A tip calculator is an app that we can all use. It’s great for making sure that we didn’t underpay or overpay tips.

We can get the tipping convention for different countries and then use that to calculate the tips from the total price.

Then we can display the tip amount on the screen. Also, we can add a feature to divide the tip amount by the number of people in case we have to split the bill.

Of course, we’ve to check that all the numbers are valid before making the calculation.

Cost Splitter

Similar to the tip calculator, we can create a cost splitter app to add up all the cost items and divide them by the number of people to split the bill with, which is a value that users enter.

Of course, we’ve to check that all the numbers are valid before making the calculation.

Loan Payment Calculator

We can use the loan payment formula to calculate the amounts that we have to pay and find out when we’re done paying our loan.

The formula takes the principal amount, interest rate, and the number of months to pay.

So we need to let the user enter all of that data so that we can make the calculation.

Of course, we’ve to check that all the numbers are valid before making the calculation.

Random Name Picker

We can create an app that lets user pick a random name from a list of names that they entered.

The names can be entered as a comma-separated list or a newline-separated list.

HTML to PDF Converter

An app that takes a URL of a web page or a web page file and converts it to a PDF is useful.

We can let users enter their URL or upload a file from the front end, then we can process the HTML with a Node app and convert it to PDF with a library of our choice.

For the back end, we can use frameworks like Express or Nest.js to take the request.

Unit Conversion Calculator

Unit conversion calculators are always useful. We can make one that converts weights and lengths for example.

We let users enter inputs into input boxes and display the result on the screen.

Like any other app, we should check if the numbers are valid before converting.

Secret Message Encoder/Decoder

This is a fun app that transforms messages that we want to encode with our own algorithm. Then we have to decode it when someone has the secret key.

To do all that we probably need some mapping to convert the data. We can do that by changing the code point of each character in the string by a fixed number for example.

JavaScript’s string methods can be used to get the code point and convert the code point back to the corresponding character.

Quiz Game

We can make our own quiz game by loading a bunch of questions and answers into a database and then display the questions and let players enter their answers.

If it matches, then we display a message saying that the answer is correct. Otherwise, we display a message telling the player that it’s wrong.

We can make it multiple choice or we can let players enter their answer. To make loading the questions and answers easier, we can use an ORM like Sequelize, which we can use to seed data.

Conclusion

There’re plenty of JavaScript app ideas we can use to build up or JavaScript skills. If we can do them all on our own, then we know we’re a real developer.

The post Harder App Ideas to Get Good at JavaScript appeared first on The Web Dev.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .