Friday, May 4, 2018

Am I through with the MVC architecture already?


For 8 months at one client I worked on several customer-facing web assets for them.  Among them was a relatively new SPA (Single Page Application) to handle Help and Support, written in AngularJS.

I have written my own Apex applications, and the development process is highly iterative (as is required by XP and any agile process developed since).  You can either start off with an angular-seed or ng-boilerplate The angular seed repo needs to be updated to the version of Angular you want it to use, and if you plan to refer to docs.angularjs.org, make sure that is set to the same version as your project.

Once you have got it running you can start to implement your routes, scopes and directives, adding Karma or Protractor tests and building features in, one card at a time, until you're done.

The key piece of advice for coding with AngularJS is NOT to use jQuery because when you start introducing jQuery it interferes with the AngularJS stuff.  Actually remove the reference to jQuery if you can't resist the temptation to use the dollar sign.

http://www.cheatography.com/proloser/cheat-sheets/angularjs/

I've never really liked the result.  Unless you were directly involved in the production process, you have very few clues about what is going on inside.  It's often difficult to maintain and adding new features often creates bugs.  Often you are not sure whether you are looking at a bug or a business rule.  I did not enjoy making changes to the code because I felt as if I was doing as much harm as good, probably more.

This brilliant paper on DCI shows how the MVC architecture is an advance on the OOP paradigm (and goes on to argue that it doesn't really work).

People at Facebook (who have a lot of experience in this area) explain why MVC doesn't scale and they go on to explain a brilliant way forwards: a framework called FLUX and a user interface library called REACT.

The key concept from React is the "virtual DOM abstraction" a sequence of  messages (for example [{Alice : online}, {Bob: offline}, {Charles: online, mobile}]) describe mutations to a mode (the virtual DOM), React will diff the virtual DOM and the real DOM and work out the minimal set of DOM mutations needed to transform the DOM to match, and put them in a queue.  A batch update will set the DOM to match the virtual DOM.

You will need your wireframes, to document your Use Cases, and to produce State Transition Diagrams.

https://facebook.github.io/react/docs/getting-started.html
http://www.cheatography.com/kitallis/cheat-sheets/reactjs/

No comments:

Post a Comment