React + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
##Text Manipulation Tool with Dark Mode & Dynamic Counter

A React.js project that offers text transformation features (uppercase, lowercase, bold, italic), dynamic word and character counters, and a fully integrated dark mode.

Features

Text Manipulation: Convert text to uppercase or lowercase, toggle bold or italic styles.
Real-Time Counters: Track the number of words, characters, and button clicks in real-time.
Dark Mode: Toggle between light and dark modes with responsive styling for the entire page.
Dynamic Button Styles: Button styles change after more than 10 clicks, enhancing the visual experience.
Copy to Clipboard: Easily copy the manipulated text to the clipboard with a single click.

Built With

React.js: JavaScript library for building user interfaces.
JavaScript (ES6+): Core language for implementing logic.
CSS: Styling for the entire page, with dynamic adjustments for dark mode and button states.
React Hooks: useState for state management.
Clipboard API: Used to copy text directly to the clipboard.

Key Concepts Learned

State Management: Using useState() to manage multiple states such as text, word count, character count, and button click count.
Conditional Rendering: Applied conditional rendering for button styles and dark mode themes.
Event Handling in React: Implemented click events for text transformation functions.
CSS for Dark Mode: Dynamically styled the application for light and dark modes based on user preference.
Responsive Design: Ensured that the layout adjusts smoothly across different screen sizes.

UI/UX Details

Textarea supports real-time styling changes (bold/italic) and adapts to the light/dark theme.
Buttons have custom colors and are spaced evenly for better usability.
The UI updates dynamically to reflect button clicks and text changes.

Installation & Setup

To run this project locally, follow these steps:

Clone the repository:

bash
Copy code
git clone https://github.com/Siddiqui145/text_manipulator_reactproject.git

Navigate to the project directory:

bash
Copy code
cd text-manipulator_reactproject
Install dependencies:

bash
Copy code
npm install
Run the app in development mode:

bash
Copy code
npm start
Open http://localhost:3000 to view it in the browser.

Deployment

This app can be deployed on platforms like Netlify or Vercel. To deploy:

Build the app:

bash
Copy code
npm run build
Follow the instructions of your deployment platform for further steps.

Contributions

Contributions, issues, and feature requests are welcome! Feel free to check the issues page.

License

This project is licensed under the MIT License - see the LICENSE file for details.

Screenshots

Including some screenshots of the app in both light and dark mode, demonstrating various text manipulations.