Our great sponsors
-
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
React is special because it defines a specification for a 'reconciler', rather than being specifically a 'web' focused library. We use React to define the regular page layout, but also to define our terminal UI tools, our 3D environments and our charting engine. The ability to seamlessly switch reconciler, all in the same language with the same APIs is an absolute super power.
I'm a big fan of the React user interface paradigm. It allows for local reasoning of components that can then be put together to build more complex user interfaces. State management is a breeze, by having components be a pure function of state and 'properties', you gain simple to reason about, powerful abstractions. The ability to combine imperative data transformation code with declarative "JSX" to compose other components, it's powerful and ergonomic. The 'hooks' system lets you compose and reuse business logic in the same way components let you compose and reuse the structural side of things.
This is a UI for a delta robot project I've been working on for fun. There is an insane amount of complexity here that just isn't a problem with this paradigm. The 3D environment is all declaratively built, the optimisation pipeline is simple and easy to reason about. When data changes, 'everything just works'. On this page are the reconcilers for the 'text elements' like a regular webpage would use, as well as the 3D environment in the background, as well as the chart down the bottom left for the frame timing. This project would be unreasonable to impossible with the vast amount of solutions out there, but using web technologies, it's not only possible, but you can focus on making the user experience excellent. Subtle niceties like the blur behind the settings are trivial to accomplish. It's great to be able to link both a text element and a 3D object to a 'variable' on the hardware side of things, and have it 'just work', all with the same API.