Awesome

vision

A framework to create the WYSIWYG Web Page Editor of yours.

Vision is a web builder framework based on React. You can develop your own productive-ready web builder quickly. Unlike most web builder framework, you can expand vision with pure react. It's crazy simple, all you need to do is writing react component. And it's powerful, you can handling the interactions (eg. TabView) gracefully.

Features

crazy simple
fully customizable
high performance
non invasive
undo/redo were ready
only 10 KB gziped

Install

npm install @visionjs/core --save

Usage

import React, { useState } from 'react'
import { Editor, View, Data } from '@visionjs/core'
import Text from 'renderers/Text'

const defaultProps = (params) => (renderer) => ({ readonly, requestUpdateProps, props }) =>
    renderer({ readonly, requestUpdateProps, props: { ...params, ...props } })

//...
//my editor
() => {
  const [data, setData] = useState(new Data())

  return (
    <Editor data={data} onChange={setData}>
      <h1>
        <View id="title" render={defaultProps({ content: 'title' })(Text)} />
      </h1>
      <View
        id="description"
        render={defaultProps({ content: 'description' })(Text)}
      />
    </Editor>
  )
}

Documentation

https://visionjs.netlify.com/

Demo

https://example-landing-vision.netlify.com/

Contact to author

QQ-Group: 730672328

email: b1ncer@foxmail.com