Basic Requirements of the Project

To implement the character counter application, you do not need to have exceptional web development skills. Even if you are a beginner in web technologies such as HTML, CSS and JS you can build your own character counter application. The following are the pre-requisites for character counter application.

Basic Requirements

You need to have the basic requirement of

• Working laptop with internet connection
• Install VScode in your machine
• Connect your GitHub account to VScode (Optional)

Tech Stack

You do not need to be proficient in the following technologies, but it is good to know the basics.

• HTML: It is used to structure the web application.
• CSS: It is used for styling the web application.
• JavaScript: It is used for implementing the logic behind the web application.
• React JS: This is a popular framework for frontend development.
• Git: It is used for uploading/hosting the codes.
• Vercel: It is used for deploying web applications.

Input

The input for the character counter is taken from the text area. The text area allows the users to paste the paragraph or sentence to check the character count. Or, they can manually enter/type the paragraph. This application supports both the static and dynamically input option.

Output

The output of the character counter is displayed in three formats.

• The first format is the number of characters in the text (including space as a character).
• The second format is the number of characters in the text (removing the space).
• The third format is the number of words present in the text.

Note that, whenever the user starts typing their input text in the textarea. The output changes dynamically without any delay.

In the next lesson, we will look into the necessary Javascript concepts behind the calculation of number of characters, words and removing spaces from the text.

See you in the next lesson!