Skip to content

README.md

Latest commit

 

History

History
68 lines (47 loc) · 2.26 KB

README.md

File metadata and controls

68 lines (47 loc) · 2.26 KB
Raw

CodeCapture

CodeCapture is a powerful and user-friendly tool designed for developers, educators, and content creators. It enables the seamless creation of visually appealing code snippet images, perfect for sharing in forums, articles, or social media threads. By leveraging cutting-edge technologies, CodeCapture ensures that your code is not only accurately represented but also aesthetically pleasing.

Features

  • CodeMirror Integration: Employs @uiw/react-codemirror for an intuitive and feature-rich code editing experience.
  • Syntax Highlighting: Provides built-in syntax highlighting with various language support through CodeMirror.
  • HTML to Image Conversion: Utilizes the html-to-image library to transform code snippets into high-quality images, perfect for sharing.

Live App

Visit codecapture.app to see CodeCapture in action.

Getting Started

Prerequisites

  • Node.js
  • npm or yarn

Installation

  1. Clone the repository: 
    git clone https://github.com/otolock/CodeCapture.git
  2. Navigate to the project directory: 
    cd CodeCapture
  3. Install dependencies: 
    npm install
# or
yarn install

Running the Application

  1. Start the development server: 
    npm run dev
# or
yarn dev
  2. Open http://localhost:3000 with your browser to see the result.

Usage

  • Write or paste your code into the Monaco Editor.
  • Customize the appearance using the editor's built-in features.
  • Click the 'Capture' button to convert your code snippet into an image.
  • Save or share your generated image directly from the app.

Contributing

Contributions to CodeCapture are welcome! Whether it's reporting a bug, discussing improvements, or submitting a pull request, all contributions are appreciated.

License

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

Acknowledgments