Author Topic: IguaRPG 2 Devlog  (Read 7033 times)

SquareWheel

  • Administrator
  • Cutester
  • *****
  • Posts: 802
  • Cutes: 139
    • View Profile
Re: IguaRPG 2 Devlog
« Reply #30 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.

hubol

  • Cutesterest
  • ******
  • Posts: 1135
  • Cutes: 630
    • View Profile
    • hubolhubolhubol
Re: IguaRPG 2 Devlog
« Reply #31 on: March 21, 2024, 05:45:30 AM »
Cook! I’ll respond to your effortpost soon!

dcco

  • Cutest
  • ****
  • Posts: 469
  • Cutes: 112
    • View Profile
Re: IguaRPG 2 Devlog
« Reply #32 on: March 22, 2024, 08:15:27 PM »
nice squeel - im also currently on a web dev learning arc (really hard time finding a dev job so im trying to add to my resume) - basically just trying to learn full-stack web dev as a whole. i used to mess around with angular for frontend but that was a long time ago.

hubol

  • Cutesterest
  • ******
  • Posts: 1135
  • Cutes: 630
    • View Profile
    • hubolhubolhubol
Re: IguaRPG 2 Devlog
« Reply #33 on: March 23, 2024, 05:38:55 AM »
Haha, Cook, I like your cloneTemplate function a lot! I know the point of the post is that you tried out something where you weren't just using native browser APIs, but in a game project I don't really want to pull in a heavy library like React or Vue for my debug utilities. Thanks for the inspiration there!

Briefly looking at the Vue docs... The Vue SFC looks interesting. It's not really something you can accomplish with React out-of-the-box, in particular declaring styles in your component files in a nice way. I wonder what the development experience is like in an SFC file... React is pretty nice because for the most part you are just looking at TypeScript code, and you get the typical assistance from your IDE because of that...

My first experience with one of these frameworks was React with functional components in TypeScript... So when I saw angular I was very sad... It seemed like components were at minimum 2 separate files. The HTML file has bastard attributes for boolean expressions and looping (Haha, looking at Vue, they also have this: https://vuejs.org/guide/essentials/conditional.html#v-if)... And I recall the TS file being pretty verbose...

It's funny how complicated each framework is...

Finding a dev job is very hard and humiliating. From 2022-2023 I applied to probably 50 game development companies. I heard back from one and went through 7 interviews only to be rejected. I applied to horrible, enormous banks; dating apps; the university... Again, heard back from one. Another extremely rigorous and evil, heartless, disrespectful, inhumane interview process for an evil bank. Rejected because I used TypeScript in the live programming examination. Told I needed to brush up on my JavaScript skills.

The only way I've gotten my past three jobs is through connections I made at another dev job. And I'm pretty sure I only got that job because a guy who worked there looked at my YouTube channel and saw I had a video called "HUBOL AT GDC" or something and believed I was a very important game developer.

I hope you find something Ducko! I don't think the place I work at is looking for people without work experience as a full-stack web dev... But if that changes I will let you know.
« Last Edit: March 23, 2024, 05:40:32 AM by hubol »

SquareWheel

  • Administrator
  • Cutester
  • *****
  • Posts: 802
  • Cutes: 139
    • View Profile
Re: IguaRPG 2 Devlog
« Reply #34 on: March 23, 2024, 05:48:52 PM »
It's not really something you can accomplish with React out-of-the-box, in particular declaring styles in your component files in a nice way.

Yeah that's one of my favourite parts about SFCs.  The scoped styling is really nice for small, individual components.  I think you could away with a really small styles.css, or even just stuff the global styles in your main App.vue file and make that one non-scoped.

The HTML file has bastard attributes for boolean expressions and looping (Haha, looking at Vue, they also have this...)

That's actually a big part of why I'm liking Vue!  Here's a quick example of some imperative, non-Vue code I wrote beforehand.  This function takes an array of objects, creates some HTML elements based on their information, and outputs the elements to the page.

Code: [Select]
<script>
categories.forEach(cat => {
const elemLi = document.createElement("li"); // List item
const elemLabel = document.createElement("label"); // Label

// Span
const elemSpan = document.createElement("span");
elemSpan.innerText = cat.msg;

// Checkbox
const elemCheck = document.createElement("input");
elemCheck.type = "checkbox";
elemCheck.id = cat.id;
elemCheck.checked = true;

// Attach elements to DOM
listElem.appendChild(elemLi);
elemLi.appendChild(elemLabel);
elemLabel.append(elemCheck);
elemLabel.append(elemSpan);
});
</script>

Here's the same thing in Vue's declarative style.
Code: [Select]
<li v-for="cat in categories">
<label>
<input type="checkbox" checked="checked" v-bind:id="cat.id">
<span>{{ cat.value }}</span>
</label>
</li>

So yeah, bastardized HTML is one thing, but boy does it make it easier to read this kind of template code.

I haven't played with React yet but it's definitely on my todo list.  It's still a lot more popular than Vue, so would probably be more useful in terms of practical knowledge.

Rejected because I used TypeScript in the live programming examination. Told I needed to brush up on my JavaScript skills.
Ugh, that's frustrating.  Reviewers look for any possible reason to exclude candidates simply because it makes their lives easier.  I'm sorry about that.

Best of luck getting your foot in the door, ducko.  It's rough out there right now.  We've gone from companies over-hiring during the pandemic, to panicking at signs of a recession.  It's resulted in lots of people flooding the market and few companies willing to hire right now.  You're a good developer though, and I'm sure that eventually you'll be noticed.

dcco

  • Cutest
  • ****
  • Posts: 469
  • Cutes: 112
    • View Profile
Re: IguaRPG 2 Devlog
« Reply #35 on: March 23, 2024, 08:08:16 PM »
Finding a dev job is very hard and humiliating...

Yeah so far I've heard back from very few places, just a few phone interviews, maybe only like one in-person. They werent too bad, but I also have not gotten deep into the process for any of them at all. That incident with TS sounds terrible, kind of a bullshit reason since TS is just better JS - but idk I don't understand what the software dev hiring process is actually looking for.

Also yeah, I've heard from a lot of my friends that getting a job is more about connections than anything. And I know a lot of ppl in software but am terrible at networking overall + not many places hiring. But hopefully soon maybe.

Best of luck getting your foot in the door, ducko.  It's rough out there right now.  We've gone from companies over-hiring during the pandemic, to panicking at signs of a recession.  It's resulted in lots of people flooding the market and few companies willing to hire right now.  You're a good developer though, and I'm sure that eventually you'll be noticed.

Ty yeah, it feels like overall the market is bad rn, which feels kinda unlucky since in grad school it always seemed good, but nothing to do about it. Also even tho I'm confident in my general programming abilities, I feel like my actual exp not very appealing (my CS research was very niche, my game dev stuff never used unity/godot/etc game engines, i have a personal website but it's all raw html/css/js) So rn I'm  trying to pickup skills that seem marketable (web dev, also learning some data science/ML stuff) and then throw resumes at stuff :U But for now at least I've been enjoying the process of learning new things