Digging through Switch-CMS
13 Jul 2016
Reading time ~1 minute
What I Did
I spent most of the day digging through the switch-cms repository that serves as Viget’s demo app to demonstrate CK’s awesomeness within an ActiveAdmin interface for composing content. The enormity of files that work to produce the functioning app is slightly overwhelming.
What I Learned
- A React element is a light, stateless, immutable, virtual representation of a real DOM element. React element factories are functions that generate ReactElements with particular type properties. React elements have 4 main properties:
- Pure, stateless functions may not retain internal state, backing instances, or component life cycle methods - simply transforms of input and no boilerplate code.
- Backing instance: the actual DOM node behind a virtual DOM node in React.
- HTML DOM defines the following
- All HTML elements as objects
- All properties of all HTML elements
- Methods to access all HTML elements
- Events for all HTML elements
- ReactComponents create encapsulations with embedded state.
- Encapsulation is an OOP concept in which data and functions that manipulate said data are safely bundled together from outside interference and misuse.
- The render method of a ReactComponent is expected to return another ReactElement, allowing for components to be composed. Ultimately, the render resolves into a ReactElement with a string tag which instantiates a DOM element instance and inserts it into the document.
- React can be considered the V in the MVC software architectural pattern for implementing user interfaces on computers by providing a library to encourage building large applications with data that change over time through composable user interfaces.
What I Still Don’t Understand
There is so much I don’t understand it’s kind of hilarious but also immensely frightening. I’ll just have to continue pulling through by looking up everything I don’t understand in the switch-cms code.