Recent Posts31
Cute Discussion / Re: IguaRPG 2 Devlog
« Last post by SquareWheel on March 19, 2024, 10:41:48 AM »I like writing ES6, but have basically been a curmudgeon about learning the new school way of doing things with frameworks, build steps and bundlers. I'm not completely new to them since I used preprocessors back in the day (remember LESS/SASS, gulp/grunt, Bower, and Browserify? No?), but I basically fell off after things moved in the direction of Webpack. I didn't like how much "magic" it did versus the clearly defined build steps of gulp. And the fight over CommonJS vs AMD didn't have a clear victor yet, so I was hesitant to invest in either world (turns out they both lost).
Anyway I was working on a side project, and found I was needing to dedicate a lot of code to managing state and keeping the page in sync with local memory. It was getting messy. On top of that I had a few different modules that were effectively pages each needing to share information, each with a UI setup function, and with a switcher function to swap between them.
Rather than try to refactor that mess into something more elegant, I decided it was time to start learning Vue. Any of these state management libraries probably would have worked, but Vue offers an easier start and two-way data bindings.
So far Vue is pretty cool. It's nice to have more declarative logic to the template, and definitely makes things easier to reason about. Instead of defining a bunch of dynamic elements in JavaScript, just create them in HTML and slap on some magic attributes. It's often less code, but more importantly it's easier to parse at a glance. I was already making use of modules but Vue single-file components feel like a nice extension of that concept.
I still need to rewrite my app, but I think I've got enough of the foundations down now that it shouldn't be a problem. I'm still keeping the stack pretty slim with just Vue 3 + Vite. Might introduce Vue Router if I can find a way to make it work with GitHub pages (hijacking the 404.html maybe?).
I expect the experience should be relatively transferrable to React or other frameworks. Especially if I start picking up the Composition API. So far I've mostly stuck to the Options API since it's used in the documentation I've been following, but I'm thinking that's mostly just a difference in syntax.
Anyway there's still over 9,000 other JS tools I haven't learned yet, but this seems like a good start. Pray for my hard drive as it bears the brunt of node_modules.
Anyway I was working on a side project, and found I was needing to dedicate a lot of code to managing state and keeping the page in sync with local memory. It was getting messy. On top of that I had a few different modules that were effectively pages each needing to share information, each with a UI setup function, and with a switcher function to swap between them.
Rather than try to refactor that mess into something more elegant, I decided it was time to start learning Vue. Any of these state management libraries probably would have worked, but Vue offers an easier start and two-way data bindings.
So far Vue is pretty cool. It's nice to have more declarative logic to the template, and definitely makes things easier to reason about. Instead of defining a bunch of dynamic elements in JavaScript, just create them in HTML and slap on some magic attributes. It's often less code, but more importantly it's easier to parse at a glance. I was already making use of modules but Vue single-file components feel like a nice extension of that concept.
I still need to rewrite my app, but I think I've got enough of the foundations down now that it shouldn't be a problem. I'm still keeping the stack pretty slim with just Vue 3 + Vite. Might introduce Vue Router if I can find a way to make it work with GitHub pages (hijacking the 404.html maybe?).
I expect the experience should be relatively transferrable to React or other frameworks. Especially if I start picking up the Composition API. So far I've mostly stuck to the Options API since it's used in the documentation I've been following, but I'm thinking that's mostly just a difference in syntax.
Anyway there's still over 9,000 other JS tools I haven't learned yet, but this seems like a good start. Pray for my hard drive as it bears the brunt of node_modules.
