A Primer for Building Single Page Applications with React

Re:A Primer for Building Single Page Applications with React by nicksellen on Tuesday March 24, 2015 @07:32AM (#9255908)

The idea was approximately that html was the data and css was the presentation. In reality they are quite connected and you have to write the html to support how it will be presented, a change to the presentation often requires a change to the data (html), and this doesn't really make sense.

I think a saner approach is to start with plain old data (e.g. some JSON) and have a function that can turn that into html/css/js. This is what react allows by using props/state as the input to the component/rendering function. It also permits you to pass complex objects as props/state but I like keeping to simple data as much as possible.

[ Parent | on HN ]

Re:A Primer for Building Single Page Applications with React by pjtops on Tuesday March 24, 2015 @06:27PM (#9259951)

If changing CSS requires changing the markup, you are doing it wrong. Look into approaches like BEM, and demo sites like CSS Zen Garden.

[ Parent | on HN ]

Re:A Primer for Building Single Page Applications with React by nicksellen on Thursday March 26, 2015 @08:24PM (#9274072)

Changing the presentation often involves more than changing the CSS alone. For example, you might have a table of data that you want to change into a bootstrap .row/.col structure. The data itself has not changed, only the presentation, and this required a change of HTML.

The CSS always needs enough hooks in the HTML to do it's work, without the right hooks some things are impossible with CSS alone (or would be unnecessarily obscure/tricky/brittle).

HTML isn't a general data format in the way JSON is.

[ Parent | on HN ]