5 ms·
Without JSX (or templates), writing HTML as JS is quite painful. Some don't like JSX but it is truly the best way to write HTML in JS.
by CraftThatBlock 6y ago
Without JSX (or templates), writing HTML as JS is quite painful. Some don't like JSX but it is truly the best way to write HTML in JS.
- holtalanm 6y agoI agree with your first sentence. We can agree to disagree on the second, though, as I thoroughly prefer a template approach.
- kingdomcome50 6y agoCould you elaborate a bit more? I’m honestly curious.
- holtalanm 6y agoJSX vs Templates has almost evolved into a holy war at this point within the js community. There are benefits and drawbacks to both, so you'll find people coming down on either side of the argument. My main reason for preferring templates over jsx is that it allows to separate the functional component code behind the scenes from the actual rendered html in a cleaner fashion, imo, than just embedding the html directly into the JS code. I could also say that, due to my background, I am just more comfortable with it, as well.
- adrianhel 6y agoAnd to elaborate on the other side of the argument: JSX creates plain JavaScript objects instead of exposing an "almost-JS" templating language. Additionally you get an enormous amount of flexibility. For some types of apps that is very important.
- holtalanm 6y ago>> exposing an "almost-JS" templating language I'm not certain I would call Vue.js templates as an 'almost-JS' templating language. It is pure html. A browser could render it without any js backing it up. I can't speak for many other template specs, but I believe Angular.js was just pure html, as well, using custom properties to perform the binding between the html and the backing js, which is very similar to what Vue.js does, in that aspect at least.
- CraftThatBlock 6y agoI should have said that it's the best in my opinion. I think people from different backgrounds do prefer different methods, for example Vue seems very popular with PHP.
- holtalanm 6y agoI came from a java background. Company I started at used an old templating approach using freemarker, and you could say it just stuck with me. I'm not 100% opposed to JSX, and I think it has its uses, but I prefer to keep the rendering layer separate from the functional code behind the component. I'll grant that a lot of frameworks like Angular.js and Vue tend to blur those lines a little bit with their approach due to directives, but in the end, it is still html, at least, and I like that kind of simplicity.
- mudge 6y agoAnother approach is Webscript: https://mudgen.github.io/webscript/docs/ https://mudgen.github.io/webscript/docs/
- marz0 6y agoLooks a lot like Haml: http://haml.info/ http://haml.info/
- ng12 6y agoAgreed. I'm hoping JSX (or another JS-first approach) becomes the de-facto standard for frameworks. Svelte seem interesting but giving up JSX is too much to ask. A framework like Svelte that "compiles away" the JSX would be worth looking at.
- z3t4 6y agoIf you use functions DOM/JS can become really powerful. You are only limited by your imagination. If you are into functional programming (FP) you can combine a function that returns an entire app.
- flanbiscuit 6y agoI really like Developit's (makers of Preact) JSX alternative 'htm'[1] which was inspired by lit-html[2]. It uses tagged template literals so you can run them in the browser during development without needing to compile to hyperscript first (but you should compile during production builds) 1. https://github.com/developit/htm https://github.com/developit/htm 2. https://lit-html.polymer-project.org/guide https://lit-html.polymer-project.org/guide
- CraftThatBlock 6y agoI agree. htm in my eyes in a mix between JSX and templates, and does strike a good balance.