Skip to content

Commit cdc876f

Browse files
Update README.md
1 parent aa2f003 commit cdc876f

File tree

1 file changed

+8
-2
lines changed

1 file changed

+8
-2
lines changed

README.md

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,20 +23,26 @@ Download for [MacOS](https://github.com/team-reactype/ReacType/releases/tag/Mac.
2323
- To add a new component, type its name in the upper left panel, in the field '**Add class component**', and press enter.
2424
- To render a component **_instance_** to the screen, first select the component, or _parent_, that the instance will be rendered within. This selected component will be represented in a new canvas view, with its own white box. Then press the plus button next to the component name. An instance, or _child_, representation will appear on the canvas.
2525
- To add draggable HTML elements, select the image icons on the lower left panel.
26+
27+
![Gif of adding](https://imgur.com/e5669a4c-9260-4e01-ad78-f0a60bfb8de9)
28+
2629
- The bottom panel allows the user to toggle between 4 different views: a tree diagram of the application, a preview of the exportable code, a form to enter component props, and a form to add HTML attributes.
2730
- **_Props_** can be added to each component within its tab on bottom panel. Enter in a _key-value pair_, select its data _type_ and press the bottom 'ADD PROP'.
2831
- **_HTML Element Attributes_** of class name and ID can be added to each HTML element after an HTML element has been rendered to the canvas.
32+
33+
![Gif of attr & props](https://imgur.com/24dc312c-3344-4848-a88f-a571a6b2ee5e)
34+
2935
- To **_delete_** a _child_ or instance from the canvas, select the desired instance and either press the _delete_ key.
3036
- To **_delete_** a _component_, click the 'DELETE' button of the desired component in the left panel.
3137
- To _start over_, select the blue 'CLEAR WORKSPACE' button in the left panel. This will **clear the entire application**.
3238

33-
![Image of ReacType Application 2](https://i.imgur.com/OCJ8nnw.png)
34-
3539
### To Export Files
3640

3741
- Once finished setting up the application template, press the green 'EXPORT PROJECT' button at the bottom of the left panel and choose between two options to export your files:
3842
1. Export the component files into a components folder. This option will allow a developer to add these files to an existing project.
3943
1. Export a new project with TypeScript config files and the component files. This option will allow a developer to immediately begin a new project.
44+
45+
![Gif of export & tree](https://imgur.com/3c3a5257-d0c6-4568-ade6-9906ec3e321c)
4046

4147
#### Authors
4248

0 commit comments

Comments
 (0)