https://github.com/giovananog/syntax-highlighter-app

Code syntax highlighter app
https://github.com/giovananog/syntax-highlighter-app

react regex syntax-highlighting

Last synced: about 1 month ago
JSON representation

Code syntax highlighter app

• Host: GitHub
• URL: https://github.com/giovananog/syntax-highlighter-app
• Owner: giovananog
• Created: 2024-01-29T02:21:13.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-12-31T01:53:40.000Z (4 months ago)
• Last Synced: 2025-02-01T19:13:16.532Z (3 months ago)
• Topics: react, regex, syntax-highlighting
• Language: JavaScript
• Homepage: https://syntax-highlighter-app.vercel.app
• Size: 644 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Syntax Highlighter

![GitHub repo size](https://img.shields.io/github/repo-size/giovananog/syntax-highlighter-app?style=for-the-badge)

![React](https://img.shields.io/badge/-React-61DAFB?style=for-the-badge&logo=react&logoColor=white)

![JavaScript](https://img.shields.io/badge/-JavaScript-F7DF1E?style=for-the-badge&logo=javascript&logoColor=black)

![HTML](https://img.shields.io/badge/-HTML-E34F26?style=for-the-badge&logo=html5&logoColor=white)

![CSS](https://img.shields.io/badge/-CSS-1572B6?style=for-the-badge&logo=css3&logoColor=white)






  



> A basic application that highlights code syntax in different programming languages. Built as a way to practice React and improve regex skills.

---

## 🛠️ Features

- **Syntax Highlighting**: Supports JavaScript, Java, Python, and more.

- **Customizable Palette**: Allows users to pick unique color schemes.

- **Real-Time Results**: View syntax highlighting instantly.

---

## 🎨 User Interface



  

  



---

## 💻 Installation

Before you start, ensure you have **Node.js** and **npm** installed.

1. Clone the repository:

   ```bash

   git clone https://github.com/giovananog/syntax-highlighter-app.git

   ```

2. Navigate to the project directory and install dependencies:

   ```bash

   cd syntax-highlighter-app

   npm install

   ```

3. Start the application:

   ```bash

   npm start

   ```

4. Open the app in your browser at: [http://localhost:3000](http://localhost:3000)

---

## 🚀 How to Use

1. **Code**: Insert your code in the "Code" section.

2. **Palette**: Customize your color scheme in the "Palette" section.

3. **Result**: See the highlighted code in the "Result" section.