Skip to content

MariamSawera/textutils-reactt

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

8 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

โœจ TextUtils โ€“ React Text Utility App

TextUtils is a simple and interactive React application that helps users perform common text operations such as converting text case, counting words and characters, and clearing text. It is built as a learning project to understand React basics, components, props, state, and conditional rendering.


๐ŸŒŸ Features

  • ๐Ÿ”ค Convert text to Uppercase / Lowercase
  • ๐Ÿงฎ Word and character count
  • โฑ๏ธ Estimated reading time
  • ๐Ÿงน Clear text instantly
  • ๐Ÿšจ Alert notifications for actions
  • ๐ŸŒ— Light / Dark mode toggle
  • ๐Ÿ“ฑ Responsive UI

๐Ÿ› ๏ธ Tech Stack

  • React.js
  • JavaScript (ES6)
  • CSS
  • Create React App

๐ŸŒ Live Demo

๐Ÿ‘‰ Live App: (https://mariamsawera.github.io/textutils-reactt/)

Deployed using GitHub Pages


๐Ÿ“ธ Screenshot

TextUtils Home Page Preview

TextUtils Preview


๐Ÿ“‚ Project Structure

mariamsawera-textutils-reactt/
โ”œโ”€โ”€ public/
โ”‚   โ””โ”€โ”€ index.html
โ”œโ”€โ”€ src/
โ”‚   โ”œโ”€โ”€ App.js
โ”‚   โ”œโ”€โ”€ TextForm.js
โ”‚   โ”œโ”€โ”€ components/
โ”‚   โ”‚   โ”œโ”€โ”€ Navbar.js
โ”‚   โ”‚   โ”œโ”€โ”€ Alert.js
โ”‚   โ”‚   โ””โ”€โ”€ About.js
โ”‚   โ”œโ”€โ”€ index.js
โ”‚   โ””โ”€โ”€ App.css
โ”œโ”€โ”€ package.json
โ””โ”€โ”€ README.md

๐Ÿš€ How to Run Locally

  1. Clone the repository:
git clone https://github.com/MariamSawera/mariamsawera-textutils-reactt.git
npm install
npm start

๐ŸŽฏ Learning Outcomes

  • Understanding React components & props
  • State management using useState
  • Conditional rendering
  • Component-based UI design

๐Ÿ‘ฉโ€๐Ÿ’ป Author

Mariam Sawera

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published