Textarea Code Editor With Syntax Highlighting

A simple textarea-based code editor with syntax highlighting. This library aims to provide a simple code editor with syntax highlighting support without any of the extra features, perfect for simple embeds and forms where users can submit code.

How to use it:

1. Install & import the code editor.

$ npm i @uiw/react-textarea-code-editor --save
import CodeEditor from '@uiw/react-textarea-code-editor';

2. Render a new code editor in the app and determine the language.

function App() {
  const [code, setCode] = React.useState(
    `function add(a, b) {\n  return a + b;\n}`
  return (
      placeholder="Placeholder Text"
      onChange={(evn) => setCode(evn.target.value)}
        fontSize: 14,
        backgroundColor: "#fafafa",
        fontFamily: 'ui-monospace,SFMono-Regular,SF Mono,Consolas,Liberation Mono,Menlo,monospace',


Textarea Code Editor With Syntax Highlighting

Download Details:

Author: uiwjs

Live Demo: View The Demo

Download Link: Download The Source Code

Official Website: https://github.com/uiwjs/react-textarea-code-editor

License: MIT

Add Comment