HTML Formatter

A web-based HTML Formatter built with Next.js, TypeScript, and Tailwind CSS. This tool allows you to format raw HTML code into beautifully structured and readable HTML. It's designed to be user-friendly, efficient, and responsive, making it a handy tool for developers who need to quickly format and clean up their HTML code.

Features

• Customizable Formatting: Adjust indentation size and line wrapping to suit your needs.
• Clear Input/Output: Easily reset the input and output fields with a single click.
• Copy to Clipboard: Quickly copy the formatted HTML for use elsewhere.
• Error Handling: Real-time feedback if there’s an error in the formatting process.
• Responsive Design: Built with Tailwind CSS for a clean and responsive user interface.

Getting Started

Prerequisites

To run this project locally, you'll need to have Node.js and npm (or yarn) installed.

Installation

1. Clone the repository:

   git clone https://github.com/dzulfanf/html-formatter

2. Navigate to the project directory:

   cd html-formatter

3. Install the dependencies:

   npm install

   or

   yarn install

Running the Development Server

To start the development server, run:

npm run dev

or

yarn dev

Open your browser and navigate to http://localhost:3000. You should see the HTML Formatter interface.

Usage

1. Paste HTML: Paste your raw HTML code into the provided textarea.
2. Format HTML: Click the "Format HTML" button to beautify the code with proper indentation and structure.
3. Copy HTML: Use the "Copy" button to easily copy the formatted HTML to your clipboard.
4. Clear Fields: Click "Clear" to reset both the input and output fields.

Contributing

Contributions are welcome! If you'd like to contribute to this project, please fork the repository and use a feature branch. Pull requests are warmly welcome.