Merge pull request #47 from CS-Eevee/read_me

Added how to section to read me

Author: erikguntner

README.md

@@ -7,6 +7,36 @@ It allows you to visualize/setup your application architecture upfront and recre
 React-Proto works on macOS, Windows, Linux.
 If you find any issues, [file issue](https://github.com/CS-Eevee/react-proto/issues)
 
+## How To Use
+
+- To start a new project, either import an image file for the application you want to build or start with a blank stage.
+
+- Using the input at the top of the left column, input the name of the component you would like to create, then drag it into place and resize accordingly.
+
+<img src="https://github.com/CS-Eevee/react-proto/blob/master/assets/dragging.gif"/>
+
+- While building, you can use the icons in the toolbar to zomm in and zoom out, toggle the draggability of the stage, update or remove the image, collapse the left container, and eventually export your files.
+
+- For each component you have a series of options: You can define whether your component will have state, the color of the component on the screen, and the ability to apply a parent component.
+
+- If you place a container around other components and can no longer access them, you can use the layer buttons in the corresponding dropdown menu to decrease the z-index. Alternatively, you can increase the z-index of the desired components.
+
+- After you have successfully structured your components, you can use the dropdown menu to apply parent components and visualize the hierarchy of your application structure.
+
+<img src="https://github.com/CS-Eevee/react-proto/blob/master/assets/hierarchy.gif"/>
+
+- In the right container, the props tab allows you to define props in key value pairs, as well as the necessary prop type.
+
+- Once you are finished, you can use the export button in the toolbar to choose from three options of how to export your files: 
+  1. Import your files into an existing project. Just choose the path where you would like to create your components folder.
+  2. Use create-react-app to start a new project (the project will be under the "proto_app").
+  3. Clone your favorite Github repo to start a project with your favorite starter files.
+
+<img src="https://github.com/CS-Eevee/react-proto/blob/master/assets/export.gif"/>
+
+
+- Lastly, start building!
+
 ## Authors
 
 [Blessing E Ebowe](https://www.linkedin.com/in/blessingebowe/) [@refinedblessing](https://github.com/refinedblessing)