React PoC

reactpoc.md

React POC > Console 2.0

Goals

• Get Familiar with React
  • DOM structure
  • V in MVC
  • Dependencies need for build package
• Get Familiar with Semantic UI
  • Use Phil's UI kit in the process
• Build Elements Provisioninge Workflow
• Note the dependencies present in order to incorporate React with Semantic UI
• Present Findings to Team
• Decide if React is a viable technology to build Console 2.0

Workflow (Screens Worked On)

• Elements Provisioning
  • Elements Catalog > Create Instance > Tags > Done (Elements Dashboard maybe)

Output

During the React POC, I was able to get familiar with the idea of components within the framework. Two components were built, the welcome bar and dropdown menu. I got familiar with the concept of nested components and this.props functionality for creating dynmaic content via JSON objects.

The Element provisioning workflow was built using some of Phil's UI kit and Semantic UI. This proved a very beneficial exercise as I got into Semaitic UIs nuances. All screens built in this POC can be used in the Angular 2 POC. Also increased my knowledge of Semantic UI

There were some challenges in getting started as JSX needs to be compiled in order to render React components. I was able to use the JSX transformer to build my components on the fly. Paris was able to complete a build package which compiles the JSX which he will demo for us along with some other nice features.

TODO

• Speak to Phil about more UI kit components
  • This is not a blocker from completing POC or starting on Console 2.0
• Angular 2 POC
• Present findings
• Pick Framework
• Build Console 2.0 :)