Add restricted textarea project

pull/6983/head
Kamran Ahmed 1 month ago
parent 0879785d35
commit 45a7fe6eb8
  1. 29
      src/data/projects/restricted-textarea.md

@ -0,0 +1,29 @@
---
title: 'Restricted Textarea'
description: 'Create a textarea with live character count and a max character limit.'
isNew: false
sort: 15
difficulty: 'beginner'
nature: 'JavaScript'
skills:
- 'HTML'
- 'CSS'
- 'JavaScript'
- 'DOM Manipulation'
seo:
title: 'Build a Restricted Textarea with JavaScript'
description: 'Learn how to create a textarea with live character count and a maximum limit, with visual feedback as the limit is reached.'
keywords:
- 'character count'
- 'textarea limit'
- 'javascript input'
- 'html and css'
roadmapIds:
- 'frontend'
---
You are required to create a textarea that tracks and displays the number of characters typed by the user, along with a maximum character limit. As the user types, the character count will update dynamically. Once the limit is reached, the textarea will prevent further input and the border will turn red to visually indicate the limit has been hit.
[![Restricted Textarea](https://assets.roadmap.sh/guest/textarea-input-vdclr.png)](https://assets.roadmap.sh/guest/textarea-input-vdclr.png)
This project will help you practice manipulating input elements with JavaScript, handling user input events, and providing real-time feedback to enhance user experience.
Loading…
Cancel
Save