Modern UI Explained in 4 Paragraphs (and 2 Pictures)

Image for post
Image for post
Vue, Angular, React

What’s at the heart of Vue, Angular and React?

Vue, Angular and React have almost completely replaced the previous generation of javascript frameworks, in a great tidal-wave of change over the last few years.

Why?

It’s not just that these newer frameworks do the same thing as jQuery and Backbone, but in a better way. No, there is something essentially different at the heart of these frameworks: they automatically derive the UI from the application “state.”

I call this “state-driven” UI architecture. The essence of the idea is to keep the developers hands out of managing the interaction of the applications data with the actual widgets that we see on the screen: instead, let the framework provide consistent and powerful ways to “manifest” the state onscreen. We call this binding the state to the view.

there is something essentially different at the heart of these frameworks

Image for post
Image for post
Framework Managed Binding

VS.

Image for post
Image for post
Developer Managed Binding

Update: Check out this VERY neat resource on building modern JS UI: https://pentacledev.com/principles/declare-what-instead-of-how

From fellow medium-er Jason Awbrey!

Image for post
Image for post
React, Angular, Vue.js

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store