-
React Design Editor has started to develope direct manipulation of editable design tools like Powerpoint, We've developed it with reactjs, ant.design, fabricjs
-
Layouts and components such as property edits, item lists, toolbars were developed as react.js and the ant.design component was primarily used.
-
The project is constantly being developed to support a variety of functions, and its goal is to be able to draw workflow (BPMN) in the future.
- React.js
- ant.design
- fabric.js
- mediaelement.js
- react-ace
- interact.js
- anime.js
- fontawesome5
- webpack4
- babel
- npm install --save react-design-editor
- git clone https://github.com/salgum1114/react-design-editor.git - Clone the project
- npm start - Run script
- http://localhost:8080 - Host access
- Add
- Remove
- Resize
- Clone
- Tooltip
- Reorder
- Zoom
- Preview
- Copy & Paste
- Drag & Drop
- Upload (Drag & Drop)
- Alignments
- Drawing - Polygon, Link, Line, Arrow Line
- Export / Import - JSON
- Video Element
- HTML/CSS/JS Element
- iFrame Element
- Code Editor - HTML / CSS / JS / Preview
- Animation - Fade / Bounce / Shake / Scaling / Rotation / Flash
- Icon Chooser - fontawesome 5.2.0 free version
- Google Fonts - 20 fonts
- Align Guidlines - moving
- Interaction Mode - grap / selection / ctrl + drag grab
- Group / Ungroup
- Image Cropping
- Snap To Grid
- Multiple Layout - Fixed / Responsive / Fullscreen / Grid
- Context menu
- Save Image - Canvas, Target Object
- Image Filter
- Undo / Redo
- SVG Element - development (copy)
- Chart Element - development (form)
- GIF Element - development (form)
- Wireframes - development
- Multiple Map - development
- Ruler - development
