TextUtiles is a demo website showcasing my learning in React.js. It provides a text editor where you can:
- Edit text in real-time
- Convert text to uppercase or lowercase
- Clear text
- Speak text out loud
- Copy text to clipboard
- Remove extra spaces
- View text summary, including word and character count, and estimated reading time
This website demonstrates interactive React.js features and is live at TextUtiles.
- Real-Time Text Updates: Watch text changes reflect instantly as you type.
- Text Transformations: Convert your text to uppercase or lowercase effortlessly.
- Copy & Clear Options: Quickly copy or clear the editor content.
- Speech Functionality: Let the app read your text aloud.
- Space Remover: Tidy up text by removing extra spaces.
- Text Summary: Get a summary of word and character counts, and estimated reading time.
- React.js Feature Highlights: Learn about React components, state, and props in action.
To run this project locally, ensure you have:
- Node.js (v16 or higher)
- npm (v7 or higher)
-
Clone the repository:
git clone https://github.com/saaadshk/TextUtiles.git cd TextUtiles -
Install dependencies:
npm install
-
Start the development server:
npm start
-
Open your browser and navigate to:
http://localhost:3000
TextUtiles utilizes React.js to demonstrate key features:
- React Components: Modular structure for maintainable code.
- State Management: Real-time updates through state hooks.
- Props Usage: Passing data dynamically to child components.
- Event Handling: Interactive user actions such as button clicks.
Created with ❤️ by Saad Shaikh
Enjoy using TextUtiles? Give it a ⭐ on GitHub! 🚀