JavaScript Jabber30 Okt 2018

JSJ 337: Microstates.js – Composable State Primitives for JavaScript with Charles Lowell & Taras Mankovski

Panel:

Aimee Knight
Charles Max Wood
Joe Eames
AJ O’Neil
Chris Ferdinandi

Special Guests: Charles Lowell (New Mexico) & Taras Mankovski (Toronto)In this episode, the panel talks with two special guests Charles and Taras. Charles Lowell is a principle engineer at Frontside, and he loves to code. Taras works with Charles and joined Frontside, because of Charles’ love for coding. There are great personalities at Frontside, which are quite diverse. Check out this episode to hear about microstates, microstates with react, Redux, and much more!Show Topics:1:20 – Chuck: Let’s talk about microstates – what is that?1:32 – Guest: My mind is focused on the how and not the what. I will zoom my mind out and let’s talk about the purposes of microstates. It means a few things. 1.) It’s going to work no matter what framework you are using. 2.) You shouldn’t have to be constantly reinventing the wheel. React Roundup – I talked about it there at this conference. Finally, it really needs to feel JavaScript. We didn’t want you to feel like you weren’t using JavaScript. It uses computer properties off of those models. It doesn’t feel like there is anything special that you are doing. There are just a few simple rules. You can’t mutate the state in place. If you work with JavaScript you can use it very easily. Is that a high-level view?7:13 – Panel: There are a lot of pieces. If I spoke on a few specific things I would say that it enables programming with state machines.7:42 – Panel: We wanted it to fell like JavaScript – that’s what I heard.7:49 – Aimee: I heard that, too.7:59 – Guest.8:15 – Aimee: Redux feels like JavaScript to me.8:25 – Guest: It’s actually – a tool – that it feels natural so it’s not contrived. It’s all JavaScript.8:49 – Panel.9:28 – Guest: Idiomatic Ember for example. Idiomatic in the sense that it gives you object for you to work with, which are simple objects.10:12 – Guest: You have your reducers and your...we could do those things but ultimately it’s powerful – and not action names – we use method names; the name of the method.11:20 – Panel: I was digging through docs, and it feels like NORMAL JavaScript. It doesn’t seem like it’s tied to a certain framework or library platform?11:45 – Guest: Yes, we felt a lot of time designing the interfaces the API and the implementation. We wanted it to feel natural but a tool that people reach for.(Guest continues to talk about WHY they created microstates.)Guest: We wanted to scale very well what you need when your needs to change.13:39 – Chuck: I have a lot of friends who get into React and then they put in Redux then they realize they have to do a lot of work – and that makes sense to do less is more.14:17 – Guest: To define these microstates and build them up incrementally...building smaller microstates out of larger ones.Guest continued: Will we be able to people can distribute React components a sweet array of components ready for me to use – would I be able to do the same for a small piece of state? We call them state machines, but ultimately we have some state that is driving it. Would we be able to distribute and share?16:15 – Panel: I understand that this is tiny – but why wouldn’t I just use the native features in specific the immutability component to it?16:42 – Guest: I’m glad you asked that question. We wanted to answer the question...Guest: With microstates you can have strict control and it gives you the benefit of doing sophisticated things very easily.18:33 – Guest: You mentioned immutability that’s good that you did. It’s important to capture – and capturing the naturalness of JavaScript. It’s easy to build complex structures – and there is an appeal to that. We are building these graphs and these building up these trees. You brought up immutability – why through it away b/c it’s the essence of being a developer. If you have 3-4-5 levels of nesting you have to de-structure – get to the piece of data – change it – and in your state transition 80% of your code is navigating to the change and only 20% to actually make the change. You don’t have to make that tradeoff.21:25 – Aimee: The one thing I like about the immutability b/c of the way you test it.21:45 – Guest: There a few things you can test. 23:01 – Aimee: You did a good job of explaining it.23:15 – Guest: It makes the things usually hard  easy! With immutability you can loose control, and if that happens you can get so confused. You don’t have a way to have a way to navigate to clarity. That’s what this does is make it less confusing. It gives you order and structure. It gives you a very clear path to do things you need to do. If there is a property on your object, and if there is a way to change it...25:29 – Guest: The only constant is change no matter what framework you are working on.24:46 – Chuck: We are talking about the benefits and philosophy. What if I have an app – and I realize I need state management – how do I put microstates into my app? It’s using Angular or React – how do I get my data into microstates?26:35 – Guest: I can tell you what the integration looks like for any framework. You take a type and you passed that type and some value to the create function so what you get is a microstate.(The Guest continues diving into his answer.)28:18 – Guest: That story is very similar to Redux, basically an event emitter. The state changes on the store.Maybe this is a good time to talk about the stability benefits and the lazy benefits because microstates is both of those things.Stability – if I invoke a transition and the result is unchanged – same microstate – it doesn’t emit an event. It recognizes it internally. It will recognize that it’s the same item. Using that in Ember or Redux you’d have to be doing thousands of actions and doing all that computation, but stability at that level.Also, stability in the sense of a tree. If I change one object then that changes it won’t change an element that it doesn’t need to change.31:33 – Advertisement: Sentry.io32:29 – Guest: I want to go back to your question, Chuck. Did we answer it?32:40 – Chuck: Kind of.32:50 – Guest.32:59 – Guest: In Angular for example you can essentially turn a microstate...33:51 – Guest: You could implement a connect, too. Because the primitive is small – there is no limit.34:18 – Chuck summarizes their answers into his own words.34:42 – Guest: If you were using a vanilla React component – this dot – I will bind this. You bind all of these features and then you pass them into your template. You can take it as a property...those are those handlers. They will perform the transition, update and what needs to be updated will happen.35:55 – Chuck: Data and transitions are 2 separate things but you melded them together to feel like 1 thing. This way it keeps clean and fast.36:16 – Guest: Every framework helps you in each way.Microstates let’s you do a few things: the quality of your data all in one place and you can share.38:12 – Guest: He made and integrated Microstates with Redux tools.38:28 – Guest talks about paths, microstates to trees.39:22 – Chuck.39:25 – Panel: When I think about state machines I have been half listening / half going through the docs. When I think of state machines I think about discreet operations like a literal machine. Like a robot of many steps it can step through. We have been talking about frontend frameworks like React - is this applicable to the more traditional systems like mechanical control or is it geared towards Vue layered applications?40:23 – Guest: Absolutely. We have BIG TEST and it has a Vue component.41:15 – Guest: when you create a microstate from a type you are creating an object that you can work with.42:11 – Guest: Joe, I know you have experience with Angular I would love to get your insight.42:33 – Joe: I feel like I have less experience with RX.js. A lot of what we are talking about and I am a traditionalist, and I would like you to introduce you guys to this topic. From my perspective, where would someone start if they haven’t been doing Flux pattern and I hear this podcast. I think this is a great solution – where do I get started? The official documents? Or is it the right solution to that person?43:50 – Guest: Draw out the state machine that you want to represent in your Vue. These are the states that this can be in and this is the data that is required to get from one thing to the other. It’s a rope process. The arrow corresponds to the method, and...44:49 – Panel: It reminds me back in the day of rational rows.44:56 – Guest: My first job we were using rational rows.45:22 – Panelist: Think through the state transitions – interesting that you are saying that. What about that I am in the middle – do you stop and think through it or no?46:06 – Guest: I think it’s a Trojan horse in some ways. I think w

Become a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

Upptäck Premium

Prova 14 dagar kostnadsfritt

Skaffa Premium

Avsnitt(734)

Can You Really Trust AI-Generated Code? - JSJ 699

AI is writing more of our code than ever before—but should we actually trust it? In this episode of JavaScript Jabber, I sat down with Itamar Friedman from Codo (formerly Quoto) to dig into one of the biggest questions developers are wrestling with right now: What happens when AI is generating code, reviewing code, and shaping how we ship software?We explore where AI fits into modern code review, whether developers should be worried about job security, and how human responsibility still plays a critical role—even in an AI-powered workflow. From guardrails and quality standards to the future of agent-driven development, this conversation goes beyond hype and gets into what’s actually working today (and what still needs a human in the loop).AI isn’t replacing developers—it’s changing how we build, review, and take ownership of software. If you enjoyed this conversation, make sure to rate, follow, share, and review JavaScript Jabber. It really helps the show, and it helps more developers join the conversation. Thanks for listening—and we’ll see you next time!Become a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

24 Dec 46min

The Real State of Tech Hiring: AI, Ghosting, and the Developer Drought - JSJ 698

In this episode of JavaScript Jabber, Steve Edwards and I kick things off by catching up on life — from winter weather and marathon training to health journeys, CrossFit, and some behind-the-scenes personal stories that shaped how we think about wellness and longevity. After warming up, we shift our focus to the state of the tech job market, something both of us have been watching closely and experiencing firsthand.We dive into the challenges developers are facing today — especially juniors — and compare our hiring and job-hunting experiences, the impact of AI on resumes and screening, the slowdown in bootcamps, and why the industry feels different than it did even a few years ago. We also unpack economics, incentives, and business realities affecting hiring, plus what developers should be doing right now to stand out.Become a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

10 Dec 1h 4min

Why Astro Is Winning Developers Over with Sagi Carmel - JSJ 697

In this episode, I sit down with developer and speaker Sagi Carmel to dive deep into Astro, why it’s gaining so much traction, and how it compares to frameworks like Next.js, Nuxt, Remix, and SvelteKit. We explore what makes Astro uniquely powerful — from its server-first approach and island architecture to its simplicity, speed, and ability to integrate with any front-end framework you want.Sagi also walks me through real-world use cases, including how he built Israel’s official Census website with Astro, why scoped CSS and server components simplify the development experience, and how tools like HTMX and view transitions make web UX buttery smooth. If you’ve been curious about Astro, this conversation is a terrific deep dive into both its fundamentals and its advanced capabilities.🔗 Links & ResourcesAstro Documentation: https://astro.buildHTMX: https://htmx.orgLooker (Google Cloud): https://cloud.google.com/lookerBigQuery: https://cloud.google.com/bigquerySagi Carmel on YouTube: @SagiCarmelSagi Carmel on LinkedIn: Search “Sagi Carmel”Become a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

23 Nov 1h 3min

The Truth About AI in Everyday JavaScript Development - JSJ 696

It feels great to finally be back on the mic after a stretch of travel, work, and general chaos, and in this episode we’re diving into a topic that’s been coming up more and more in everyday developer conversations: how to actually use AI in your JavaScript development workflow. This isn’t about adding AI features to your app — it’s about using LLMs and AI-powered tools as part of your day-to-day coding practice.We talk through the tools we each rely on, how they’ve changed the way we write code, where they fall short, and where they can save hours of work. We also dig into the real differences between “AI-assisted coding” and “vibe coding,” the unexpected pitfalls of having AI write your tests, and the growing concerns juniors are facing in a job market that looks very different than it did just a few years ago. If you’re trying to figure out how to work with AI without losing your sanity (or your code quality), this one’s worth a listen.Become a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

14 Nov 1h 15min

Guarding the JavaScript Supply Chain: Preventing NPM Attacks with Feross Aboukhadijeh - JSJ 695

Hey everyone—it’s Steve Edwards here, and in this episode of JavaScript Jabber, I’m joined by returning guest Feross Aboukhadijeh, founder of Socket.dev, for a deep dive into the dark and fascinating world of open source supply chain security. From phishing campaigns targeting top NPM maintainers to the now-infamous Chalk library compromise, we unpack the latest wave of JavaScript package attacks and what developers can learn from them.Feross explains how some hackers are even using AI tools like Claude and Gemini as part of their payloads—and how defenders like Socket are fighting back with AI-powered analysis of their own. We also dive into GitHub Actions vulnerabilities, the role of two-factor authentication, and the growing need for “phishing-resistant 2FA.” Whether you’re an open source maintainer or just someone who runs npm install a little too often, this episode will open your eyes to how much happens behind the scenes to keep your code safe.🔗 Links & ResourcesSocket.dev – Protect your open source dependenciesFeross Aboukhadijeh on X (Twitter)GitHub Actions Security Best PracticesTruffleHog Blog – On secrets exposure in Git reposBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

1 Nov 1h

Making Monorepos Breakproof with Anton Stoychev - JSJ 694

In this solo-hosted episode, I (Steve Edwards) dive deep into the world of modern monorepos with special guest Anton Stoychev from Yotpo. Anton shares his journey from the early days of PHP and IE6 nightmares to his current work in front-end infrastructure, performance optimization, and developer tooling.We talk about the challenges of managing dependencies, upgrading tools without breaking your codebase, and the evolution of developer experience across teams and companies. Anton also introduces Breakproof, Yotpo’s open-source monorepo template designed to make dependency management and tool upgrades painless—even when working with multiple Node.js versions, runtimes like Bun and Deno, and complex CI environments.If you’ve ever struggled with upgrading Jest, ESLint, or TypeScript in a large monorepo, or you’re curious how to isolate dependencies to keep your codebase maintainable over time, this episode is a must-listen.🔗 Links & Resources🔧 Breakproof on GitHub: breakproof.dev🧠 Yotpo LTD on GitHub: Yotpo Breakproof Base Monorepo💬 Follow Anton Stoychev: stoychev.dev on BlueSkyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

24 Okt 1h 13min

Spec-Driven Development and the Future of AI IDEs with AWS’s Kiro - JSJ 693

In this episode of JavaScript Jabber, I sit down with AWS’s Clare Liguori and Erik Hanchett to talk about Kiro, a brand-new AI-powered IDE that’s reimagining the way developers build software. We dive into how Kiro takes “AI-assisted coding” to a new level through spec-driven development — a process that focuses on defining requirements and collaborating with AI to break projects into clear, manageable tasks.We unpack what sets Kiro apart from tools like Cursor and Copilot, explore its supervised vs. autopilot coding modes, and even talk about how it handles UI design, planning, and complex legacy codebases. Clare and Erik share behind-the-scenes insights on how Kiro was built using Kiro itself, what’s coming next for the platform, and how developers can join the early-access community to help shape its future.🔗 Links & Resources:🌐 Kiro Official Site🧠 AWS Developer Advocate TeamBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

9 Okt 43min

Modern JavaScript Testing: Integration, Contract Testing & AI Tools - JSJ 692

In this episode of JavaScript Jabber, I sit down with Dan Shapir and our special guest, Yoni Goldberg, to dive deep into the ever-evolving world of JavaScript testing. Yoni, a consultant who’s worked with over 40 organizations to refine developer workflows, shares valuable lessons learned from helping teams design efficient and reliable tests.We explore emerging trends in testing, including the rise of browser-based test runners, the shift from unit testing toward more integration and component testing, and how modern frameworks like Playwright, Vite Test Browser Mode, and Storybook are changing the way developers think about confidence in their code. We also tackle the role of AI in writing and maintaining tests, the pros and cons of mocking vs. real backends, and why contract testing is becoming essential in 2025.If you’ve ever struggled with flaky end-to-end tests, wondered how to balance speed with confidence, or wanted a clear breakdown of modern testing tools, this conversation will give you practical insights and fresh perspectives to take back to your projects.Links & ResourcesYoni Goldberg’s GitHubGoldbergYoni.comBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

29 Sep 1h 6min

Allt en och samma app

Lyssna på dina favoritpoddar och ljudböcker på ett och samma ställe.

Noga utvalt innehåll

Njut av handplockade tips som passar din smak – utan ändlöst scrollande.

Fortsätt när du vill

Fortsätt lyssna där du slutade – även offline.

Premium

99 kr/ månad

Tillgång till alla Premium-poddar
Reklamfritt premium-innehåll
Avsluta när du vill

Prova 14 dagar gratis

Premium

129 kr/ månad

Tillgång till alla Premium-poddar
Reklamfritt premium-innehåll
Avsluta när du vill
Ett extra konto

Prova 14 dagar gratis

Populärt inom Business & ekonomi

Berättelserna och rösterna du älskar att lyssna på

Obegränsad lyssning på alla dina favoritpoddar och ljudböcker

Upptäck Premium