Inspiration
I recently really got into ReactJS, Redux, functional programming, etc. and I'm in love with the concepts that world brings. Built this mostly to see if I could - to see if I could emulate something like Angular's data binding, and ultimately make a moderately useful tool for prototyping or building nice interfaces quickly.
What it does
Allows the user to structure their web app user interfaces with a JSON api I created. The api describes various UI widgets I've defined and styled. Additionally the user is exposed to a rudimentary data store API to be able to connect various widgets together, respond to data changes and build rich applications.
How I built it
A lot of JavaScript. No sleep.
Challenges I ran into
I originally wanted to be fancy and implement this in ES6, splitting my code nicely into different modules and bundling everything together; generating a Webpack library. For some reason none of the boilerplate projects for that workflow worked for me; so I was forced to - for time's sake - to revert back to ES5; plain, old vanilla js. Also making the logo was a pain - I'm not a graphic designer per-se so it was a lot of trial and error. It's based on the typical HTML/CSS/JS/AngularJS logo theme.
Accomplishments that I'm proud of
As far as my research goes, I haven't found anything quite like this - so I guess I'm proud of coming up with a relatively unique concept, venturing into uncharted territory, learning something new, and having fun all along.
What I learned
I've increased my knowledge of various DOM APIs, CSS flexbox, and gained more insight into what kinds of considerations take place when building something like a front-end library. My next shot at this will be even better.
What's next for DataUI
As it is, it's functional, but nowhere near what would be required or expected of a real JS library. It needs support for more widgets, it needs more robust validation/checking, I'd like to expand more on the data store api/feature, and I'd like to figure out a way to define effective generic styles that work in most circumstances so the user doesn't have to.
Log in or sign up for Devpost to join the conversation.