POPULARITY
Remix is a full-stack, open-source web framework that was developed by the creators of the popular React Router library. It focuses on features such as server-side rendering and efficient data loading, and it emphasizes developer experience. Ryan Florence is a co-creator of React Remix and in this episode he speaks with Josh Goldberg about the The post React Remix with Ryan Florence appeared first on Software Engineering Daily.
Remix is a full-stack, open-source web framework that was developed by the creators of the popular React Router library. It focuses on features such as server-side rendering and efficient data loading, and it emphasizes developer experience. Ryan Florence is a co-creator of React Remix and in this episode he speaks with Josh Goldberg about the The post React Remix with Ryan Florence appeared first on Software Engineering Daily.
Sam tells Ryan about a recent talk he gave at BigSkyDevCon. They chat about how backend frameworks are raising the ceiling of what UIs they're capable of delivering, how frontend frameworks are raising the floor of what backend features they come bundled with, and what each community can learn from the other.Timestamps:0:00 - Intro4:23 - Recap of Ryan Florence's talk6:49 - Overview of "High floor, high ceiling"10:02 - Cohesion is the biggest strength of backend frameworks17:10 - Why doesn't Rails for JavaScript exist?23:48 - Locality of behavior is the biggest strength of frontend frameworks33:14 - The use of lexical scope in React50:27 - Which community is raising both the floor and ceiling the most?Links:"High floor, high ceiling" talk
Sam and Ryan talk about the difference between the costs of building a feature and the benefits that feature brings to our end users. They discuss how libraries and frameworks can lower the technical cost of building a given feature, how Ryan Florence framed this calculation in his talk at Big Sky Dev Con, and how sometimes developers' opinions and tastes about tech can smuggle their way from the cost side of the equation into the benefit side.Topics include:0:00 - Intro6:53 - How Ryan Florence framed the problem in his talk “Mind the Gap”14:38 - How frontend frameworks and backend frameworks both have their own ways of crossing the network gap19:11 - How Network-Sensitive Interactions force technologies to grapple with both server and client environments23:02 - How React is trying to lower the cost of moving interactions between the server and client with Server Components and Server Actions26:53 - Why “Use the right tool for the job” doesn't capture the dynamic requirements of living software31:53 - How discussions about the product benefits of a feature and the technical costs of that feature are often conflated with each other34:08 - A thought experiment from economics that highlights how uncertainty plays a role in the estimation of product benefits56:54 - How to think about tech choice independently of the estimation of product benefitsLinks:"Mind the Gap" by Ryan FlorenceZero-JavaScript View Transitions in Astro
Taylor Otwell and Ryan Florence join us to talk about whether "full stack" is a term worth using in 2024, how Laravel differs from Rails, why there isn't a real JavaScript community, what Taylor would like to see from the Remix community, and whether Laravel is like Canada. Want to carry on the conversation? Join us in Discord.wip: terminalButcherBox: Meat Delivery SubscriptionCloud Monitoring as a Service | DatadogConnect, Protect and Build Everywhere | CloudflareAdam Wathan (@adamwathan) / XWhat is Amazon API Gateway? - Amazon API GatewayInertia.js - The Modern MonolithReason · Reason lets you write simple, fast and quality type safe code while leveraging both the JavaScript & OCaml ecosystems.Topics:(00:00) - Filthy JavaScript developers (00:30) - What does full stack mean? (10:46) - How Laravel different from Rails? (16:17) - Is the frontend and backend team divide real? (18:47) - Why isn't there a JavaScript community? (36:32) - Are JavaScript frameworks in the best position to be the fullest stack? (46:18) - What about Blitz.js? (49:34) - What would Tayor like to see from the Remix community? (54:41) - Is Rails worse than building an app with Cloudflare? (56:38) - Is the top of funnel for web development JavaScript? (01:07:17) - Is Laravel like Canada?
Wes and Scott talk through server components, the difference between server components and client components, reasons to run something server side, how server components work, using forms and buttons, what they like and don't like about it, and tips to learn more. Show Notes 00:10 Welcome 00:52 Syntax Brought to you by Sentry 01:39 New Heights with Scott and Wes 04:33 What are React Server Components? 10:52 The difference between server components and client components Tweet: "React Server + Client Components Visualized There is a bit of a learning curve to learn new patterns, but the ease of going between client and server will be worth it. 11:37 Why would you want to run something server side? 15:22 Components are server rendered by default 16:40 What is JS sprinkles? 17:29 How do server components work? 18:51 Moving an existing site to React server components take a while 20:27 The rules 27:12 Form Actions + Server Actions 32:07 Buttons can have actions 36:32 React Suspense 39:13 What we like Ryan Florence thread 41:54 What we don't like 47:13 Design patterns 47:35 Other things RSC Devtools Introducing Waku Mux 49:22 Sick Picks Sick Picks Scott: ASUS ZenDrive V1M External DVD Drive Wes: Leatherman Arc Shameless Plugs Scott: Syntax YouTube Wes: Wes Bos Courses Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott: X Instagram Tiktok LinkedIn Threads
Kent C. Dodds, a JavaScript engineer and teacher known for Epic Web Dev and the Remix web framework, reflects on his journey in tech, including his tenure at PayPal and his transition to full-time teaching. Kent's passion for teaching is a constant theme throughout. He transitioned from corporate roles to full-time education, capitalizing on his ability to explain complex concepts in an accessible manner. This transition was marked by the creation of successful online courses like "Testing JavaScript and Epic React," which have significantly influenced the web development community. An interesting aspect of Kent's career is his involvement with Remix, including his decision to leave Shopify (which acquired Remix) to return to teaching, which led to the development of his latest project, Epic Web Dev, an extensive and innovative web development course. This interview provides a comprehensive view of Kent C. Dodds's life and career, showcasing his professional achievements in web development and teaching, his personal life as a family man, and his unique upbringing in a large family. Epic Web (https://www.epicweb.dev/) Remix (https://remix.run/) Follow Kent C. Dodds on LinkedIn (https://www.linkedin.com/in/kentcdodds/) or X (https://twitter.com/kentcdodds). Visit his website at kentcdodds.com (https://kentcdodds.com/). Follow thoughtbot on X (https://twitter.com/thoughtbot) or LinkedIn (https://www.linkedin.com/company/150727/). Become a Sponsor (https://thoughtbot.com/sponsorship) of Giant Robots! Transcript: WILL: This is the Giant Robots Smashing Into Other Giant Robots podcast, where we explore the design, development, and business of great products. I'm your host, Will Larry. And with me today is Kent C. Dodds. Kent is a JavaScript engineer and teacher. He has recently released a massive workshop called epicweb.dev. And he is the father of four kids. Kent, thank you for joining me. KENT: Thank you so much for having me. It's an honor to be here. WILL: Yeah. And it's an honor for me to have you. I am a huge fan. I think you're the one that taught me how to write tests and the importance of it. So, I'm excited to talk to you and just pick your brain and learn more about you. KENT: Oh, thank you. WILL: Yeah. So, I just want to start off just: who is Kent? What do you like to do? Tell us about your family, your hobbies, and things like that. KENT: Yeah, sure. So, you mentioned I'm the father of four kids. That is true. We are actually expecting our fifth child any day now. So, we are really excited to have our growing family. And when I'm not developing software or material for people to learn how to develop software, I'm spending time with my family. I do have some other hobbies and things, but I try to share those with my family as much as I can. So, it's starting to snow around here in Utah. And so, the mountains are starting to get white, and I look forward to going up there with my family to go skiing and snowboarding this season. During the summertime, I spend a lot of time on my one-wheel just riding around town and bring my kids with me when I can to ride bikes and stuff, too. So, that's sort of the personal side of my life. And then, professionally, I have been in this industry developing for the web professionally for over a decade. Yeah, web development has just worked out super well for me. I kind of focused in on JavaScript primarily. And when I graduated with a master's degree in Information Systems at Brigham Young University, I started working in the industry. I bounced around to a couple of different companies, most of them you don't know, but you'd probably be familiar with PayPal. I was there for a couple of years and then decided to go full-time on teaching, which I had been doing as, like, a part-time thing, or, like, on the side all those years. And yeah, when teaching was able to sustain my family's needs, then I just switched full-time. So, that was a couple of years ago that I did that. I think like, 2018 is when I did that. I took a 10-month break to help Remix get off the ground, the Remix web framework. They got acquired by Shopify. And so, I went back to full-time teaching, not that I don't like Shopify, but I felt like my work was done, and I could go back to teaching. So, that's what I'm doing now, full-time teacher. WILL: Wow. Yes, I definitely have questions around that. KENT: [laughs] Okay. WILL: So many. But I want to start back...you were saying you have four kids. What are their ages? KENT: Yeah, my oldest is 11, youngest right now is 6, and then we'll have our fifth one. So, all four of the kids are pretty close in age. And then my wife and I thought we were done. And then last December, we kind of decided, you know what? I don't think we're done. I kind of think we want to do another. So, here we go. We've got a larger gap between my youngest and the next child than we have between my oldest and the youngest child. WILL: [chuckles] KENT: So, we're, like, starting a new family, or [laughs] something. WILL: Yeah [laughs]. I just want to congratulate you on your fifth child. That's amazing. KENT: Thank you. WILL: Yeah. How are you feeling about that gap? KENT: Yeah, we were pretty intentional about having our kids close together because when you do that, they have built-in friends that are always around. And as they grow older, you can do the same sorts of things with them. So, like, earlier this year, we went to Disneyland, and they all had a great time. They're all at the good age for that. And so, they actually will remember things and everything. Yeah, we were pretty certain that four is a good number for us and everything. But yeah, we just started getting this nagging feeling we wanted another one. So, like, the fact that there's a big gap was definitely not in the plan. But I know a lot of people have big gaps in their families, and it's just fine. So, we're going to be okay; just it's going to change the dynamic and change some plans for us. But we're just super excited to have this next one. WILL: I totally understand what you mean by having them close together. So, I have three little ones, and my oldest and my youngest share the same exact birthday, so they're exactly three years apart. KENT: Oh, wow. Yeah, that's actually...that's fun. My current youngest and his next oldest brother are exactly two years apart. They share the same birthday, too [laughs]. WILL: Wow. You're the first one I've heard that their kids share a birthday. KENT: Yeah, I've got a sister who shares a birthday with her son. And I think we've got a couple of birthdays that are shared, but I also have 11 brothers and sisters [laughs]. And so, I have got a big family, lots of opportunity for shared birthdays in my family. WILL: Yeah, I was actually going to ask you about that. How was it? I think you're the 11th. So, you're the youngest of 11? KENT: I'm the second youngest. So, there are 12 of us total. I'm number 11. WILL: Okay, how was that growing up with that many siblings? KENT: I loved it. Being one of the youngest I didn't really...my experience was very different from my older siblings. Where my older siblings probably ended up doing a fair bit of babysitting and helping around the house in that way, I was the one being babysat. And so, like, by the time I got to be, like, a preteen, or whatever, lots of my siblings had already moved out. I was already an uncle by the time I was six. I vaguely remember all 12 of us being together, but most of my growing up was just every other year; I'd have another sibling move out of the house, which was kind of sad. But they'd always come back and visit. And now I just have an awesome relationship with every one of my family members. And I have something, like, 55 nieces and nephews or more. Yeah, getting all of us together every couple of years for reunions is really a special experience. It's a lot of fun. WILL: Yeah. My mom, she had 12 brothers and sisters. KENT: Whoa. WILL: And I honestly miss it because we used to get together all the time. I used to live a lot closer. Most of them are in Louisiana or around that area, and now I'm in South Florida, so I don't get to see them as often. But yeah, I used to love getting together. I had so many cousins, and we got in so much trouble...and it was -- KENT: [laughs] WILL: We loved it [laughs]. KENT: Yeah, that's wonderful. I love that. WILL: Yeah. Well, I want to start here, like, how did you get your start? Because I know...I was doing some research, and I saw that, at one point, you were an AV tech. You were a computer technician. You even did maintenance. Like, what was the early start of your career like, and how did you get into web dev? KENT: I've always been very interested in computers, my interest was largely video games. So, when I was younger, I had a friend who was a computer programmer or, like, would program stuff. We had visions of...I don't know if you're familiar with RuneScape, but it's this game that he used to play, and I would play a little bit. It was just a massive online multiplayer game. And so, we had visions of building one of those and having it just running in the background, making us money, as if that's how that works [laughter]. But he tried to teach me programming, and I just could not get it at all. And so I realized at some point that playing video games all the time wasn't the most productive use of my time on computers, and if I wanted my parents to allow me to be on computers, I needed to demonstrate that I could be productive in learning, and making things, and stuff. So, I started blogging and making videos and just, like, music videos. My friend, who was the programmer, he was into anime, or anime, as people incorrectly pronounce it. And [laughs] there was this website called amv.com or .org or something. It's Anime Music Videos. And so, we would watch these music videos. And I'd say, "I want to make a music video with Naruto." And so, I would make a bunch of music videos from the Naruto videos I downloaded, and that was a lot of fun. I also ran around with a camera to do that. And then, with the blog, I wrote a blog about Google and the stuff that Google was, like, doing because I just thought it was a fascinating company. I always wanted to work at Google. In the process of, like, writing the blog, I got exposed to CSS and HTML, but I really didn't do a whole lot of programming. I also did a little bit of Google Docs. Spreadsheets had some JavaScript macros-type things that you could do. So, I did a little bit of that, but I never really got too far into programming. Then I go to college, I'm thinking, you know what? I think I want to be a video editor. I really enjoy that. And so, my brother, who at the time was working at Micron, he did quality assurance on the memory they were making. So, he would build test automation, software and hardware for testing the memory they build. And so, he recommended that I go into electrical engineering. Because what he would say is, "If you understand computers at that foundational level, you can do anything with computers." And I'd say, "Well, I like computers. And if I go into video editing, I'm going to need to understand computers, too. So yeah, sure, let's let's do that." I was also kind of interested in 3D animation and stuff like that, too. Like, I wasn't very good at it, but I was kind of interested in that, too. So, I thought, like, having a really good foundation on computers would be a good thing for me. Well, I was only at school for a semester when I took a break to go on a mission for my church [inaudible 09:42] mission. And when I got back and started getting back into things, I took a math refresher course. That was, like, a half a credit. It wasn't really a big thing, but I did terrible in it. I did so bad. And it was about that time that I realized, you know what? I've been thinking my whole life that I'm good at math. And just thinking back, I have no idea why or any justification for why I thought I was good at math because in high school, I always struggled with it. I spent so much time with it. And in fact, my senior year, I somehow ended up with a free period of nothing else to do. I don't know how this happened. But, I used that free period to go to an extra edition of my calculus class. So, I was going to twice as much calculus working, like, crazy hard and thinking that I was good at this, and I superduper was not [laughter]. And so, after getting back from my mission and taking that refresher course, I was like, you know what? Math is a really important part of engineering, and I'm not good at it at all, obviously. And so, I've got to pivot to something else. Well, before my mission, as part of the engineering major, you needed to take some programming classes. So, there was a Java programming class that I took and a computer systems class that included a lot of programming. The computer systems was very low level, so we were doing zeros and ones. And I wrote a program in zeros and ones. All that it did was it would take input from the keyboard, and then spit that back out to you as output. That was what it did. But still, you know, many lines of zeros and ones and just, like, still, I can't believe I did that [laughter]. And then we upgraded from that to Assembly, and what a godsend that was [laughs], how wonderful Assembly was after working in machine code. But then we upgraded from that to C, and that's as far as that class went. And then, yeah, my Java class, we did a bunch of stuff. And I just remember thinking or really struggling to find any practicality to what we were doing. Like, in the Java class, we were implementing the link to list data structure. And I was like, I do not care about this. This does not make any sense. Why should I care? We were doing these transistor diagrams in the computer systems class. And why do I care about that? I do not care about this at all. Like, this is not an interesting thing for me. So, I was convinced computer programming was definitely not what I wanted to do. So, when I'm switching from electrical engineering, I'm thinking, well, what do I do? And my dad convinced me to try accounting. That was his profession. He was a certified public accountant. And so, I said, "Okay, I'll try that." I liked the first class, and so I switched my major to go into the business school for accounting. I needed to take the next accounting class, and I hated that so much. It was just dull and boring. And I'm so glad that I got out of that because [laughs] I can't imagine doing anything like that. WILL: [laughs] KENT: But as part of switching over to business school, I discovered information systems. What's really cool about that is that we were doing Excel spreadsheets and building web pages. But it was all, like, with a practical application of business and, like, solving business problems. And then, I was like, oh, okay, so I can do stuff with computers in a practical setting, and that's what got me really interested. So, I switched, finally, to information systems–made it into that program. And I was still not convinced I wanted to do programming. I just wanted to work with computers. What ended up happening is the same time I got into the information systems program, I got married to my wife, and then I got this part-time job at a company called the More Good Foundation. It's a non-profit organization. And one of my jobs was to rip DVDs and upload those videos to YouTube, and then also download videos from one site and upload those to YouTube as well. And so, I was doing a lot of stuff with YouTube and video stuff. And as part of my information systems class, I was taking another Java class. At that same time, I was like, you know, what I'm doing at work is super boring. Like, can you imagine your job is to put in a [inaudible 13:45] and then click a couple of buttons? And, like, it was so boring and error-prone, too. Like, okay, now I've got to type this out and, you know, I got to make sure it's the same, try and copy-paste as much as I can. And it was not fun. And so, I thought, well, I'm pretty sure there are pieces of this that I could automate. And so, with the knowledge that I was getting in my information systems programming class, that was another Java class, I decided to write a program that automated a bunch of my stuff. And so, I asked my boss, like, "Can I automate this with writing software?" And I'm so glad that they said I could. WILL: [laughs] KENT: Because by the end of it, I had built software that allowed me to do way more than I ever could have before. I ended up uploading thousands of videos to their YouTube channels, which would have taken years to do. And they ended up actually being so happy with me. They had me present to the board of directors when they were asking for more money [laughs] and stuff. And it was really awesome. But still, I was not interested in being a programmer. Programming, to me, was just a means to an end. WILL: Oh, wow. KENT: Yeah, I guess there was just something in me that was like, I am not a programmer. So, anyway, further into the program of information systems, I interned as a business intelligence engineer over that next summer, and I ended up staying on there. And while I was supposed to be a business intelligence engineer, I did learn a lot about SQL, and star schema, and denormalized databases to optimize for read speed and everything. I learned a lot about that. But I just kept finding myself in positions where I would use my programming experience to automate things that were problematic for us in the business realm. And this was all still Java. It was there that I finally realized, you know what? I think I actually do want to be a programmer. I actually really do enjoy this. And I like that it's practical, and it makes sense for me, so… WILL: What year was that? KENT: That would have been 2012. Then I got a new job where my job was actually to be a programmer at a company called Domo, where they do business intelligence, actually. So, it got my foot in the door a little bit since I was a business intelligence engineer already. I got hired on, actually, as a QA engineer doing automated testing, but I never really got into that. And they shifted me over pretty quick into helping with the web app. And that is when I discovered JavaScript, and the whole, like, everything flooded out from there. I was like, wow, I thought I liked programming, but I had no idea how fun it could be. Because I felt like the chains had been broken. I no longer have to write Java. I can write JavaScript, and this was just so much better. WILL: [laughs] KENT: And so, yeah, I was there for a year and a half before I finally graduated. And I took a little break to work at USAA for a summer internship. And when I came back, I had another year and then converted to full-time. And so, yeah, there's my more detail than you were probably looking for, story of how I got into programming [laughs]. WILL: No, I actually love it because like I said, I've used your software, your teachings, all that. And it's amazing to hear the story of how you got there. Because I feel like a lot of times, we just see the end result, but we don't know the struggle that you went through of even trying to find your way through what your purpose was, what you're trying to do. Because, at one point, you said you were trying to do accounting, then you were trying to do something else. So, it's amazing to see, like, when it clicked for you when you got into JavaScript, so that's amazing. KENT: Yeah, it is kind of funny to think, like, some people have the story of, like, I knew I wanted to be a programmer from the very beginning, and it's just kind of funny for me to think back and, like, I was pretty certain I didn't want to be a programmer. WILL: [laughs] KENT: Like, not only did I, like, lots of people will say, "I never really thought about it, and then I saw it, and it was great." But I had thought about it. And I saw it, and I thought it was awful [laughter]. And so, yeah, I'm really glad that it worked out the way it did, though, because programming has just been a really fun thing. Like, I feel so blessed to be doing something that I actually enjoy doing. Like so many of our ancestors, they would go to work because they cared about their family and they just wanted to feed their family. I'm so grateful to them for doing that. I am so lucky that I get to go to work to take care of my family, but also, I just love doing it. WILL: Yeah, I feel the same way, so yeah, totally agree. After you found out about JavaScript, when did you figure out that you want to teach JavaScript? What was that transition like? KENT: I've been teaching for my whole life. It's ingrained in my religion. Even as a kid, you know, I'd prepare a talk, a five-minute talk, and stand up in front of 30 of my peers. And even when you're an early teenager, you get into speaking in front of the entire congregation. It took a while before I got good enough at something, enough hubris to think that people would care about what I have to say -- WILL: [laughs] KENT: Outside of my religion where, like, they're sitting there, and I've been asked to speak, and so they're going to listen to me. And so, when I started getting pretty good at programming, I decided, hey, I want to teach this stuff that I'm learning. And so, when I was still at school and working at Domo, the business intelligence company, one of our co-workers, Dave Geddes, he put together a workshop to teach AngularJS because we were migrating from Backbone to Angular. And I asked him if I could use his workshop material to teach my classmates. This was, like, soon after ng-conf, the first ng-conf, which my co-workers at Domo actually put on. So, I wasn't involved in the organization, but I was very much present when it was being organized. I attended there and developed a relationship with Firebase with the people there. I was actually...they had a developer evangelist program, which they called Torchbearers or something. And actually, that was my idea to call them Torchbearers. I think they wanted to call us torches, and I'm like, that just doesn't make sense. WILL: [laughs] KENT: I developed a relationship with them. And I asked them, "Hey, I want to teach my classmates AngularJS. Would you be interested in sponsoring some pizza and stuff?" And they said, "Yeah, we'll send you stickers, and hot sauce, and [laughs] a bunch of..." Like, they sent us, like, headphones [laughs] and stuff. So, I was like, sweet. I taught my classmates AngularJS in a workshop, brought a bunch of pizza, and it was, you know, just an extracurricular thing. And actually, the recording is still on my YouTube channel, so if you want to go look at one of my early YouTube videos. I was very into publishing video online. So, if you are diligent, you'll be able to find some of my very early [laughter] videos from my teenage years. But anyway, so, yes, I've been teaching since the very beginning. As soon as I graduated from college, I started speaking at meetups. I'd never been to a meetup before, and I just saw, oh, they want a speaker. I can talk about something. WILL: Wow. KENT: And not realizing that, like, meetups are literally always looking for speakers. This wasn't some special occasion. WILL: [laughs] KENT: And one of the meetups I spoke at was recorded and put on YouTube. And the guy who started Egghead io, John Lindquist, he is local here in Utah. And he saw that I spoke at that meetup, but he wasn't able to attend. So, he watched the recording, and he thought it was pretty good. He thought I would do a good job turning that into a video course. And that first video course paid my mortgage. WILL: Wow. KENT: And I was blown away. This thing that I had been doing just kind of for fun speaking at meetups, and I realized, oh, I can actually, like, make some legit good money out of this. From there, I just started making more courses on the side after I put the kids to bed. My wife is like, "Hey, I love you, but I want you to stay away for now because I've just been with these tiny babies all day. WILL: [laughs] KENT: And I just need some alone time." WILL: Yes. KENT: And so, I was like, okay. WILL: [laughs] KENT: I'll just go and work on some courses. And so, I spent a lot of time for the next couple of years doing course material on the side. I reached out to Frontend Masters and just told them, "Hey, I've been doing courses for Egghead." I actually met Marc Grabanski at a conference a couple of years before. And so, we established a little bit of relationship. And I just said, "Hey, I want to come and teach there." So, I taught at Frontend Masters. I started putting on my own workshops at conferences. In fact, just a few months after graduating, I got accepted to speak at a conference. And only after I was accepted did I realize it was in Sweden [laughter]. I didn't think to look where in the world this conference was. So, that was my first international trip, actually, and I ended up speaking there. I gave, actually, two talks. One of them was a three-hour talk. WILL: Whoa. KENT: Which was, yeah, that was wild. WILL: [laughs] KENT: And then, yeah, I gave a two-day workshop for them. And then, I flew straight from there to Amsterdam to give another talk and also do a live in-person podcast, which I'd been running called ngAir, an Angular podcast. It just kept on building from there until finally, I created testingjavascript.com. And that was when I realized, oh, okay, so this isn't just a thing I can use to pay my mortgage, and that's nice. This is, like, a thing I can do full-time. Because I made more with Testing JavaScript than I made from my PayPal salary. WILL: Oh wow. KENT: I was like, oh, I don't need both of these things. I would rather work half as much one full-time job; that's what I want, one full-time job and make enough to take care of my family. And I prefer teaching. So, that's when I left PayPal was when I released Testing JavaScript. WILL: Wow. So, for me, I think so many times the imposter syndrome comes up whenever I want to teach or do things at the level you're saying you're doing. Because I love teaching. I love mentoring. I remember when I came into development, it was hard. I had to find the right person to help me mentor. So now, I almost made a vow to myself that if someone wants to learn and they're willing to put in the energy, I'm going to sit down however long it takes to help them because I remember how hard it was for me whenever I was doing it. So, you said in 2014, you were only a couple years doing development. How did you overcome impostor syndrome to stand in front of people, teach, go around the world, and give talks and podcasts? Like, how did you do that portion? KENT: Part of it is a certain level of hubris like I said. Like, you just have to be willing to believe that somebody's going to care. You know, the other part of it is, it's a secret to getting really, really good at something. They sometimes will say, like, those who can't do teach. That's total baloney because it requires a lot of being able to do to get you in a position where you can teach effectively. But the process of teaching makes you better at the process of doing as well. It's how you solidify your experience as a whatever. So, if you're a cook, you're really good at that; you will get better by teaching other people how to cook. There's an element of selfishness in what I do. I just want to get really, really good at this, and so I'm going to teach people so that I can. So yeah, I think there's got to be also, like, a little bit of thick skin, too, because people are going to maybe not like what you have to share or think that you're posing or whatever. Learn how to let that slide off you a little bit. But another thing is, like, as far as that's concerned, just being really honest about what your skill set is. So, if somebody asks me a question about GraphQL, I'm going to tell them, "Well, I did use GraphQL at PayPal, but I was pretty limited. And so, I don't have a lot of experience with that," and then I'll answer their question. And so, like, communicating your limitations of knowledge effectively and being okay being judged by people because they're going to judge you. It just is the way it is. So, you just have to learn how to cope well with that. There are definitely some times where I felt like I was in over my head on some subjects or I was involved in a conversation I had no business being there. I actually felt that a lot when I was sent as PayPal's delegate to the TC39 meetings. Wow, what am I doing here? I've only been in the industry for, like, two or three years at [laughter] that point. It takes a certain level of confidence in your own abilities. But also, like, being realistic about your inexperience as well, I think, is important too. WILL: Yeah, I know that you had a lot of success, and I want to cover that next. But were there any failures when you were doing those teaching moments? KENT: Years ago, Babel was still a new thing that everybody was using to compile their JavaScript with new syntax features down to JavaScript that the browser could run. There was ES Modules that was introduced, and lots of us were doing global window object stuff. And then we moved to, like, defining your dependencies with r.js or RequireJS. And then, there was CommonJS, and Universal Module Definition, and that sort of thing. So, ECMAScript modules were very exciting. Like, people were really interested in that. And so, Babel added support to it. It would compile from the module syntax down to whatever you wanted: CommonJS or...well, I'm pretty sure it could compile to RequireJS, but I compiled it to CommonJS. And so, there was a...yeah, I would say it's a bug in Babel at that time, where it would allow you to write your ES modules in a way that was not actually spec-compliant. It was incorrect. So, I would say export default some object, and then in another module, I would say import. And then, I'd select properties off of the object that I exported, that default I exported. That was allowed by Babel, but it is superduper, not how ECMAScript modules work. Well, the problem is that I taught, like, a ton of people how to use ECMAScript modules this way. And when I realized that I was mistaken, it was just, like, a knife to the heart because I was, like, I taught so many people this wrong thing. And so, I wrote a blog post about it. I gave a big, long talk titled “More Than You Want to Know About ECMAScript Modules,” where I talk about that with many other things as well. And so, yeah, just trying to do my part to make up for the mistake that I made. So yes, I definitely have had mistakes like that. There's also, like, the aspect that technology moves at a rapid pace. And so, I have old things that I would show people how to do, which they still work just as well as they worked back then. But I wouldn't recommend doing it that way because we have better ways now. For some people, the old way to do it is the only way they can do it based on the constraints they have and the tools that they're using and stuff. And so, it's not, like, it's not valuable at all. But it is a struggle to make sure that people understand that, like, this is the way that you do it if you have to do it this way, but, like, we've got better ways. WILL: I'm glad you shared that because it helps. And I love how you say it: when I make a mistake, I own up to it and let everyone know, "Hey, I made a mistake. Let's correct it and move on." So, I really like that. KENT: Yeah, 100%. MID-ROLL AD: Are your engineers spending too much time on DevOps and maintenance issues when you need them on new features? We know maintaining your own servers can be costly and that it's easy for spending creep to sneak in when your team isn't looking. By delegating server management, maintenance, and security to thoughtbot and our network of service partners, you can get 24x7 support from our team of experts, all for less than the cost of one in-house engineer. Save time and money with our DevOps and Maintenance service. Find out more at: tbot.io/devops. WILL: I want to go back to what you were saying. When you left PayPal, you released Testing JavaScript. How did you come up with the idea to write a Testing JavaScript course? And, two, how long did it take to take off and be successful? KENT: That was a pretty special thing, honestly. In 2018, I had put together a bunch of workshops related to testing. There was this conference called Assert(js) that invited me to come, taught them. In the year prior, I went to Midwest JS and taught how to test React. I had this material about testing. I'd gotten into testing just because of open-source stuff. I didn't want to have to manually go through all my stuff again every time I wanted to check for breakages and stuff, so that got me into testing. And whatever I'm into is what I'm going to teach. So, I started teaching that testing. And then my friend, Ryan Florence, put together...he separated from Michael Jackson with React Training, and built his own thing called Workshop.me. He asked me to join up with him. And he would, like, put together these workshops for me, and I would just...my job was just to show up and teach. And so, I did that. I have a picture, actually, in this blog post, The 2010s Decade in Review, of me in front of 60 people at a two-day workshop at Trulia in San Francisco. WILL: Oh, wow. KENT: And this is where I was teaching my testing workshop. Well, what's interesting about that photo is that two weeks before that, I had gotten really frustrated with the tool that everybody uses or used at the time for testing React, and that was Enzyme. And so I was preparing this workshop or working on it. I had already delivered it a number of times, but I was working on it, improving it, as I always do [laughs] when I'm preparing. WILL: [laughs] KENT: I can never give the same workshop twice, I guess. And I was just so frustrated that Enzyme was so difficult to work with. And, like, I was going to prepare this document that said, "Here are all the things you should never do with Enzyme. Like, Enzyme encourages you to do these things; you should not do these things. And let me explain why." And I just hated that I needed a document like that. And so, I tweeted, "I'm seriously starting to think that I should make my own very small testing lib and drop Enzyme entirely. Most of Enzyme's features are not at all useful and many damaging to my test bases. I'd rather have something smaller that encourages better practices." And so, I tweeted that March 15th, 2018. I did that. I did exactly that. What I often do in my workshops is I try to build the abstraction that we're going to use so that you can use it better. So, I was, like, building Enzyme, and I realized the jump between what I had built, the little utilities that I had built as part of the workshop, from that to Enzyme was just a huge leap. And so, I thought, you know what? These utilities that I have built to teach Enzyme are actually really good. What if I just turned that into a testing utility? And that became Testing Library, which, fast forward to today, is the number one testing library for React. And it's recommended for testing React, and Vue, and Angular. The ideas that are in Testing Library got adopted by Playwright. If you're writing tests for anything in the browser, you are very likely using something that was either originally developed by me or inspired by the work that I did. And it all came from that testing workshop that I was working on. So, with that, I had not only that testing workshop; I had a number of other workshops around testing. And so I approached Joel Hooks from Egghead.io. I say, "Hey, I'm getting ready to record a bunch of Egghead courses. I've got, like, six or seven courses I want to do." And he'd seen my work before, you know, I was a very productive course creator. And he said, "Hey, how about we, you know, we've been thinking about doing this special thing. How about we make a website just dedicated to your courses?" And I said, "That sounds great." I was a little bit apprehensive because I knew that putting stuff on Egghead meant that I had, like, a built-in audience and everything that was on Egghead, so this would be really the first time of me just branching out with video material on my own. Because, otherwise, if it wasn't Egghead, it was Frontend Masters, and there was the built-in audience there. But yeah, we decided to go for it. And we released it in, I think, November. And it was that first week...which is always when you make the most is during the launch period. But that launch week, I made more than my PayPal salary for the entire year. And so, that was when I realized, oh, yeah, okay, let's go full-time on this because I don't need two PayPal salaries. I just need one. And then I can spend more time with my family and stuff. And especially as the kids are getting older, they're staying up later, and I want to hang out with them instead of with my computer at night [laughter], and so... WILL: I love how you explain that because I came in around 2018, 2019. And I remember Enzyme, and it was so confusing, so hard to work with, especially for, you know, a junior dev that's just trying to figure it out. And I remember Testing JavaScript and then using that library, and it was just so much easier to, like, grab whatever you needed to grab. Those utils made the biggest difference, and still today, they make a huge difference. So yes, I just resonate with what you're saying. That's amazing. KENT: Aw, thank you so much. WILL: Yeah. You did Testing JavaScript. And then what was your next course that you did? KENT: I quit PayPal, go full-time teaching. That first year, I actually did an update to Testing JavaScript. There were a couple of changes in Testing Library and other things that I needed to update it for. And then I started working on Epic React. So, while I was doing all this testing stuff, I was also very into React, creating a bunch of workshops around that. I was invited to speak all over the world to talk about React. And I had a couple of workshops already for React. So, I was invited to give workshops at these conferences about React. And so, I thought, you know, let's do this again, and we'll do it with React this time. The other thing was, I'd never really planned on being the testing guy. It just kind of happened, and I actually didn't really like it either. I wanted to be more broad than just testing. So, that kind of motivated me to say, hey, let's do something with React to be a little bit more broad. Yeah, so I worked on putting those workshops together and delivered them remotely. And then, yeah, COVID hit, and just really messed everything up [laughs] really bad. So, I had everything done on my end for Epic React by March of 2020, which is, like, immediately after COVID got started, in the U.S. at least. And so, yeah, then we actually didn't end up releasing Epic React until October that year, which, honestly [laughs], was a little bit frustrating for me because I was like, "Hey, guys, I have recorded all the videos and everything. Can we get this released?" But, like, that just was a really rough year for everybody. But yeah, so Egghead got the site put together. I did a bunch of interviews and stuff. And then we launched in October of 2020. That was way bigger than Testing JavaScript because Testing JavaScript was still very informed by my experience as an Egghead instructor, which, typically, the Egghead courses are, like, a video where watch me do this thing, and then you'll learn something and go apply it to your own stuff. And that's kind of what Testing JavaScript was built as. But as part of the update of Testing JavaScript in 2019, I added another workshop module called Testing Node Applications. And in that one, I decided, hey, typically, I would have a workshop version of my material and a course version. The workshop version had like instructions and exercises. And the course version was no instructions or anything. It was just, like, watch these videos. And it was just me doing the exercises. And with the update of Testing JavaScript, I added that Testing Node workshop, and I said, hey, what if we just, like, embrace the fact that these are exercises, and it's just, like, me recording the workshop? How I would deliver the workshop? And so, I tested that out, and that went really well. And so, I doubled down on that with Epic React. And I said, okay, now, this isn't just, like, watch these videos. This is a do the exercise and then watch me do the exercise. So, Epic React was not only a lot more material but the format of the material was more geared for retention and true practice and learning. And so, Epic React ended up doing much better than Testing JavaScript, and even still, is still doing a remarkable job as far as course material is concerned. And, like, so many people are getting a lot of really great knowledge from Epic React. So yeah, very gratifying to have that. WILL: Once again, I've used Epic React. It's taught me so many...stretched me. And I do like the format, so yes, I totally agree with that, yeah. The next thing, Remix, correct? KENT: Yeah. So, how I got into Remix, around the same time we finished recording Epic React videos, I was doing some other stuff kind of to keep content going and stuff while we were waiting to launch Epic React. And around that same time, my friend Ryan Florence and Michael Jackson––they were doing the React training thing. And so, we were technically competitors. Like I said, Ryan and I kind of joined forces temporarily for his Workshop Me thing, but that didn't end up working out very well. And Michael really wanted Ryan back, and so they got back together. And their React training business went way better than it had before. They were hiring people and all sorts of stuff. And then, a training business that focuses on in-person training just doesn't do very well when COVID comes around. And so, they ended up having to lay off everybody and tried to figure out, okay, now what are we going to do? Our income has gone overnight. This is a bit of a simplification. But they decided to build software and get paid for it like one does. So, they started building Remix. Ryan, actually, around that time, moved back to Utah. He and I would hang out sometimes, and he would share what he was working on with Michael. We would do, like, Zoom calls and stuff, too. I just got really excited about what they were working on. I could see the foundation was really solid, and I thought it was awesome. But I was still working on Epic React. I end up launching Epic React. He launches Remix the very next month as a developer preview thing. Yeah, it definitely...it looked a lot like current Remix in some ways but very, very different in lots of others. But I was super hooked on that. And so, I paid for the developer preview and started developing my website with it. And around the next year in August, I was getting close to finishing my website. My website is, like, pretty legit. If you haven't gone to kentcdodds.com. Yet, it is cooler than you think it is. There's a lot that goes into that website. So, I had a team help me with the product planning and getting illustrations and had somebody help me implement the designs and all that stuff. It was a pretty big project. And then, by August of 2021, Ryan and I were talking, and I said, "Hey, listen, I want to update Epic React to use Remix because I just think that is the best way to build React applications. But I have this little problem where Remix is a paid framework. That's just going to really reduce the number of people who are interested in learning what I have to teach. And on top of that, like, it just makes it difficult for people to test things out." And so, he, around that time, was like, "Hey, just hold off a little bit. We've got some announcements." And so, I think it was September when they announced that they'd raised VC money and they were going to make Remix open source. That was when Ryan said, "Hey, listen, Kent, I think that it's awesome you want to update Epic React to use Remix. But the problem is that Remix isn't even 1.0 yet. The community is super small. It needs a lot of help. If you release a course on Remix right now, then you're not going to get any attention because, like, nobody even knows what it is." So, part of me is like, yeah, that's true. But also, the other part of me is like, how do people find out what it is [laughs] unless there's, like, material about it? But he was right. And he said, "Listen, we've got a bunch of VC money. I've always wanted to work with you. How about we just hire you? And you can be a full-time teacher about Remix. But you don't have to charge anything. You just, like, make a bunch of stuff for free about Remix." I said, "That sounds great. But, you know, to make that worth my while because I'm really happy with what I'm doing with this teaching thing, like, I'm going to need a lot of Remix." And so, Michael Jackson was like, "How about we just make you a co-founder, and we give you a lot of Remix?" And I said, "Okay, let's do this." And so I jumped on board with them as a year-delayed co-founder. I guess that's pretty common. But, like, that felt kind of weird to me [laughs] to be called a co-founder. But yeah, so I joined up with them. I worked on documentation a little bit, mostly community building. I ran Remix Conf. Shopify was interested in what we were doing. And we were interested in what Shopify was doing because, at the time, they were working on Hydrogen, which was one of the early adopters of React Server Components. And, of course, everybody was interested in whether Remix was going to be adding support for server components. And Ryan put together a couple of experiments and found out that server components were nowhere near ready. And we could do better than server components could as of, you know, the time that he wrote the blog posts, like, two years ago. So, Hydrogen was working with server components. And I put us in touch with the Hydrogen team—I think it was me—to, like, talk with the Hydrogen team about, like, "Hey, how about instead of spending all this time building your own framework, you just build on top of Remix then you can, you know, make your Shopify starter projects just, like, a really thin layer on top of Remix and people will love it? And this is very important to us because we need to get users, especially really big and high profile users, so people will take us seriously." And so, we have this meeting. They fly a bunch of their people out to Salt Lake. They're asking us questions. We're asking them questions and saying, "Hey, listen, this is why server components are just not going to work out for you." Well, apparently, they didn't listen to us. It felt like they were just like, "No, we're highly invested in this. We've already sunk all this cost into this, but we're going to keep going." And they did end up shipping Hydrogen version 1 on top of server components, which I just thought was a big mistake. And it wasn't too long after that they came back and said, "Hey, we're kind of interested in having you guys join Shopify." So, right after Remix Conf, I go up into Michael's room at the hotel with Ryan. And they say, "Hey, listen, Kent, we're talking with Shopify about selling Remix and joining Shopify," and kind of bounced back and forth on whether we wanted to do it. All of us were just not sure. Because when I joined Remix, I was thinking, okay, we're going to build something, and it's going to be huge. This is going to be bigger than Vercel, like multibillion-dollar company. So, I really kind of struggled with thinking, hey, we're selling out. Like, we're just getting started here. So, Ryan and I ended up at RenderATL in Atlanta at that conference. We were both speaking there. And Ryan didn't fill out the right form. So, he actually didn't have a hotel room [laughs], and so he ended up staying in my room. I intentionally always get a double bedroom just in case somebody needs to stay with me because somebody did that for me once, and I just...it was really nice of them. So, I've always done that since. And so, I said, "Yeah, Ryan, you can stay with me." And so, we spent just a ton of time together. And this was all while we were trying to decide what to do with Shopify. And we had a lot of conversations about, like, what do we want for Remix in the future? And it was there that I realized, oh if I want to take this to, like, multi-billion dollar valuation, I've got to do things that I am not at all interested in doing. Like, you've got to build a business that is worth that much money and do business-related things. On top of all of that, to get any money out of it...because I just had a percentage of the company, not actually any money. There was no stock. So, the only way you can get money out of a situation like that is if you have a liquidation event like an IPO, which sounds, like, awful—I [laughs] would hate to go through an IP0—or you have to be bought. And if you're worth $2 billion, or 3, or whatever, who can buy you? There's almost nobody who can buy you at that valuation. Do you really want to outprice anybody that could possibly buy you? And then, on top of that, to get there, that's, like, a decade worth of your life of working really superduper hard to get to that point, and there's no guarantee. Ryan would always say a bird in the hand is worth two in the bush. He was saying Shopify is a bird in the hand, and we do not know what the future holds. And so, we were all finally convinced that, yeah, we want to sell, and so we decided, yeah, let's sell. And as the sale date grew closer, I was getting excited because I was like, oh, I can be back on the TC39 because Shopify is, like, I don't know if they're actually sending delegates to the TC39, but I'm sure that they would be interested if I ask them to, like, "Hey, let's be involved in the evolution of JavaScript." And I know they're on the Web Working Group. Like, they're on a bunch of different committees and stuff. And I just thought it'd be really cool to get involved in the web platform again. And then, on top of that, I just thought, you know what? I'll just spend all my time teaching Shopify developers how to use Remix. That sounds like a lot of fun. As things drew closer, I got more and more uneasy about that. And I thought, you know, I could probably do just as well for myself by going full-time teacher again. I've done this thing before. I just really like being a teacher and, like, having total control over everything that I do. And if I work at Shopify, they're going to tell me, "Hey, you need to, like, do this, and that, and the other." And I don't know if I want to go back to that. And so, I decided, this is awesome. Super, super good job, folks. I think I've done everything for you that you need me to do. I'm going to bail out. And so, yeah, Shopify wasn't super jazzed about that. But the deal went through anyway. And that's how I ended my time at Shopify. WILL: I love it. It's lining up perfectly because you say you left Shopify to go back doing more teaching. And then you released another course; that's Epic Web, correct? KENT: Right. That was the reason I left Shopify or I didn't join up with Shopify is because I wanted to work on Epic Web. In this 2010s blog post, one of the last things that I mention...toward the bottom, there's a section, KCD EDU, which is basically, like, I wanted to help someone go from zero to my level as an engineer in a single place where I teach just all of the things that I can teach to get somebody there. And so I wanted to call it KCD EDU, but I guess you have to be an accredited university to get that domain or something. But that was the idea. Erin Fox, back in 2020 she said, "I'm expecting you to announce your online Kent C. Dodds engineering bootcamp." And I replied, "I'm planning on doing this, no joke." So, I've been wanting to do this for a really long time. And so, leaving Remix was like, yeah, this is what I'm going to go do. I'm going to go build KCD EDU. And I was talking with Ryan at some point about, like, what I was planning on doing in the future. And something he said or something I said in that conversation made me realize, oh, shoot, I want to build Epic Web Dev. So, I've got Epic React. I don't want Epic Remix. I want people to, like, be web developers. Remix is just, like, an implementation detail. And so, I went and I was relieved to find that the domain was still available: epicweb.dev, and so I bought that. And so, I was always planning on, like, even while I was at Remix, eventually, I would leave Remix and go build Epic Web Dev. So, that's what I did. Starting in August, I decided, okay, how about this: I will build a legit real-world web application, and then I will use that to teach people how to build legit real-world web applications from start to finish. If it's included as, like, knowledge you would need to build this web app, then that's knowledge you need to be able to build a full-stack application. That was the idea. So, I started live streaming in, like, August or September, and I would live stream almost everyday development of this web app. So, people can go and watch those on my YouTube channel. I would livestream for, like, sometimes six hours at a time with breaks every 45 minutes. So, I'd just put it on a break slide, go for a quick walk, or take a drink, whatever, and then I would come back. And I would just, like, so much development and live streaming for a long time. Once I got, like, in a pretty good place with that, the app I was building was called Rocket Rental. It's like Airbnb for rocket ships. So, you could rent, like, your own rocket ship to other people to fly. So, it had to be, like, realistic enough that, like, you could relate it to whatever you were building but not realistic enough that people would actually think it was a real product [laughs]. I worked with Egghead again. They actually have a sister company now called Skill Recordings that's responsible for these types of products. And so, I was working with Skill Recordings on, like, they would get me designs. And then I would, like, work with other people to help implement some of those designs. And then, I started working on turning this stuff into workshops. And with Epic React, we have this workshop app that you run locally so that you can work in your own editor, in your own environment, and with your own editor plugins and all that stuff. I want you to practice the way that you're going to actually exercise that practice when you're done––when you're working at work. And so we have this workshop app with Epic React. Well, that was built with Create React app, very limited on what you could do. And so, I started working on a new workshop app that I just called KCD Shop, that was built with Remix. And so, now we've got a bunch of server-side stuff we can do. And this server side is running on your machine. And so, so much stuff that I can do with this thing. One of the big challenges with Epic React was that the video you watch is on epicreact.dev, but the exercises you run are on localhost. And so, you have to keep those things in sync. You'd see, okay, I'm in exercise one on the videos. Let me go find exercise one in the app and then find the file exercise one. So, you've got, like, three different things you've got to keep in sync. And so, with the workshop app for Epic Web, I said, how about we make it so that we can embed the video into the app? And so, you just have localhost running, and you see the video right above the instructions for the exercise. And so, you watch the video that kind of introduces the problem that you're going to be doing, and then you read the instructions. And then we can also make it so that we have links you can click or buttons you can click in the app that will open your editor exactly where you're supposed to go. So you don't have to keep anything in sync. You go to the app, and you watch the video. You read the instructions. You click this button. It opens your editor. And so, that's exactly what I did. And it's an amazing experience. It is phenomenal, not just for the workshop learners but for me, as a workshop developer, like, creating the workshop––it's just been phenomenal. Because, like, we also have this diff view where you can see the difference between your work in progress and the solution. So, if you get stuck, then it's very easy to see where you went wrong. It also means that we can build even very large applications as part of our workshop and our exercise where there are dozens or hundreds of files. And you don't have to worry about finding them because it'll tell you exactly which ones you need to be working in, so all sorts of really, really cool things. So, this workshop app––actually, took a lot of time and effort to build. But now that it's done, like, people are going through it now, and they're just loving it. So, I built the workshop app, I put the first workshop of Rocket Rental into this workshop app, and I delivered it. And I found out very quickly that a full application with all the bells and whistles you'd expect, like, tons of different routes and stuff, was just too much. Even with the workshop app, it was just really pretty difficult for people to gain enough context around what they were building to be effective. So, I was concerned about that. But then, around the same time, I started realizing that I had a marketing problem. And that is that with Testing JavaScript, people know that they're customers because they're like, I'm a JavaScript developer, and I know how to test––boom. I'm a Testing JavaScript customer. With Epic React, I join this company; they're using React; I need to know React, boom. I'm a customer of Epic React. But with something like Epic Web, it's just so broad that, like, yeah, I am a web developer. I just don't know if I'm a customer to Epic Web. Like, is Epic Web for only really advanced people, or is it only for really beginner people? Or is it only for people who are using this set of tools or... Like, it's just a very difficult thing to, like, identify with. And so I wanted to de-emphasize the fact that we used Remix because the fact is that you can walk away from this material and work in a Next.js app or a SvelteKit app and still use so much of the knowledge that you gained in that environment. So, I didn't want to focus on the fact that we're using any particular set of tools because the tools themselves I select them, not only because I think that they are really great tools but also because the knowledge you gain from these tools is very transferable. And I'm going to teach it in a way that's very transferable. That was the plan. But I still had this issue, like, I need people to be able to identify themselves as customers of this thing. So, what I decided to do through some, like, hints and inspiration from other people was how about I turn Rocket Rental into a much simpler app and make that a project starter? And while I was at Remix, actually, I directed the creation of this feature called Remix Stacks. It's basically the CLI allows you to create a Remix app based on a template. I said I can make a Remix Stack out of this, and I called it the Epic Stack. And so, just took all of the concepts that came from Rocket Rental; applied it to a much simpler app. It's just a note-taking app, but it has, like, all of the features that you would need to build in a typical application. So, it's got a database. It's got deployment, GitHub integration. So, you have GitHub Actions to run tests and stuff. It has the tests. It has authentication already implemented, and even two-factor auth, and third-party auth, and file upload, and, like, just tons and tons of stuff built in. And so, people can start a new project and ship that and have a lot of success, like, skip all the basic stuff. So, I presented that at Remix Conf. I wasn't working at Remix anymore, but they asked me to run Remix Conf again, so I did. And I told them, "If I'm running it this year, I'm going to select myself to speak." And I spoke and introduced the Epic Stack there. And then that was when I started to create the workshops based on the Epic Stack. And so, now it was no longer we're going to have workshops to build Rocket Rental; it was we're going to have workshops to build the Epic Stack, with the idea being that if you build the thing, you are able to use it better, like, still following the same pattern I did with Testing JavaScript where we build a framework first. Like, before you start using Jest, we're building Jest and same with Testing Library. We do the same thing with React. Before we bring in React, I teach you how to create DOM nodes yourself and render those to the page and all of that. And so, here with Epic Web, I'm going to teach you how to build the framework that you can use to build applications. So, that is what Epic Web is, it's effectively we're building the Epic Stack. In the process, you learn all about really basic things, like, how do you get styles onto the page all the way to really complex things like, how do you validate a user's email? Or how do you implement two-factor auth? Or how do you create a test database? So, you don't have to mock out the database, but you can still run your test in isolation. Around this time was when my wife and I were trying to become pregnant. And we got the news that we were expecting, and we were super excited. And so, I'm thinking, okay, I've got to ship this thing before the baby comes. Because who knows what happens after this baby comes? So, I am talking with Skill Recordings. I'm saying, "We've got to get this done by October." I think it was May. And so, I was thinking like, okay, I've probably got, like, maybe eight days worth of workshops here. And so, kind of outlined all of the workshops. Like, I know what needs to be included. I know what the end looks like because I've got the Epic Stack. The end is the Epic Stack. The beginning is, like, a brand new create Remix app creation right there. So, I know what the start and the end looks like. I kind of can figure out how much time I need to teach all of that. And I said, "Let's do eight days." And so, we got that scheduled and started selling tickets. And we sold out 30 tickets in just a couple of days, and that's what we originally planned for. I'm like, well, gosh, I can handle 80 people in a workshop. I've done that before, but that's about as far as I go. I don't really like going that much. In fact, online, especially, I only like to go up to, like, 40. But we said, "Hey, let's knock this out of the park." So, we doubled it, and we sold another 30 seats. And so, it was sold out before even the early bird sale was over. So, that was pretty encouraging. The problem was that I hadn't actually developed this material. I'd already given one workshop about testing with Rocket Rental, and I'd given one workshop about the fundamentals with Rocket Rental. But I hadn't done anything of the authentication or, the forms, or data modeling. Also, like, Epic Notes app is different from Rocket Rental. So, I got to rebuild those workshops. Like, the first workshop was going to start in, like, two weeks, maybe three weeks. And so, I'm working on these workshops. And I'm like, I've finished the first workshop, which was going to be a two-day workshop, and so I get that done. And so, that next week, I'm getting close to finished on the forms workshop, and then I start the workshops. And that was when I started to realize, oh, shoot, I am in huge trouble because I have to not only deliver two workshops a week, so that's two days a week that I'm not able to work on the workshops, really. And then also develop the material as I go, which I don't normally do this at all because I just don't like stressing myself out so much. But, like, I'd had this timeline put together, and I'm like, I need to ship this by October. For about five weeks, I worked 80 to 100 hours a week, maybe more, in a row to get those workshops created [laughs]. And I do not recommend this, and I will never do it again. I can tell you this now. I didn't tell anybody at the time because I was worried that people would think, well, geez, is that the type of product you create, like, you're just rushing through this stuff? But I can tell you this safely now because the results speak for themselves. Like, these people loved this stuff. They ate it up. It was so good. I won't do this again. It's not something that I typically do. But it worked. And, like, I put in a crazy amount of work to make this work. People loved it. And yeah, I'm really, really happy with that. The next step, though, so it was eight days' worth of workshops in four weeks. And I realized, as I almost always realize when I'm presenting workshops, that, like, oh my gosh, I have way more material than I have time for. So, by
In this supper club episode of Syntax, Wes and Scott talk with Ryan Florence about Remix, working at Shopify, the history of licensing and pricing, quitting Twitter, the state of React Server components, and more. Show Notes 00:35 Welcome Ryan Florence Ryan Florence (@ryanflorence) / X React Training React Router Docs Moved ryanflorence (Ryan Florence) · GitHub 01:42 Collarbone update 06:47 What is Remix? Remix.run 11:43 Server actions 15:33 What was the history around licensing? 20:30 Open source is weird now 22:21 Working with Shopify and Hydrogen Remixing Shopify | Remix CSS Zen Garden: The Beauty of CSS Design The Zen of CSS Design: Visual Enlightenment for the Web: Shea, Dave, Holzschlag, Molly E.: 9780321303479: Amazon.com: Books 28:04 On quitting Twitter 35:33 What's coming up with v2 of Remix? 40:30 The reality of breaking changes 44:18 What's the status of React Server components? 49:46 Will Remix ever have React Server components in it? 50:55 How should we be fetching our data? 53:04 Do you have a wishlist for JSX? 58:45 Supper Club questions Strapi - Open source Node.js Headless CMS
Sam and Ryan chat about how to avoid a flicker of content on initial render due to mismatched server/client rendering. They also chat about the pros and cons of React Hooks, and using StackBlitz containers to debug OSS issues.Topics include:0:00 – Intro1:46 – Ryan Florence's tweets about Hooks, useEffect and refs18:12 – How to avoid SSR/CSR rendering mismatches when your initial render depends on client-side APIs37:40 – Using StackBlitz for reproduction in open source45:17 – Isolated app development environments with JavaScript containersLinks:Ryan Florence's tweets on HooksDan Abramov's replyReact beta docs on bugs found from double renderingReact beta docs on bugs found from re-running EffectsStackBlitzChangelog episode with Ryan Dahl about Deno Deploy as a platform
Remix is a full stack web framework that lets you focus on the user interface and work back through web fundamentals to deliver a fast, slick, and resilient user experience that deploys to any Node.js server and even non-Node.js environments at the edge like Cloudflare Workers. In this episode, we interviewed Ryan Florence, co-founder at The post Remix with Ryan Florence appeared first on Software Engineering Daily.
Remix is a full stack web framework that lets you focus on the user interface and work back through web fundamentals to deliver a fast, slick, and resilient user experience that deploys to any Node.js server and even non-Node.js environments at the edge like Cloudflare Workers. In this episode, we interviewed Ryan Florence, co-founder at The post Remix with Ryan Florence appeared first on Software Engineering Daily.
Remix is a full stack web framework that lets you focus on the user interface and work back through web fundamentals to deliver a fast, slick, and resilient user experience that deploys to any Node.js server and even non-Node.js environments at the edge like Cloudflare Workers. In this episode, we interviewed Ryan Florence, co-founder at The post Remix with Ryan Florence appeared first on Software Engineering Daily.
Remix is a full stack web framework that lets you focus on the user interface and work back through web fundamentals to deliver a fast, slick, and resilient user experience that deploys to any Node.js server and even non-Node.js environments at the edge like Cloudflare Workers. In this episode, we interviewed Ryan Florence, co-founder at The post Remix with Ryan Florence appeared first on Software Engineering Daily.
Steph has an update and a question wrapped into one about the work that is being done to migrate the Test::Unit test over to RSpec. Chris got to do something exciting this week using dry-monads. Success or failure? This episode is brought to you by BuildPulse (https://buildpulse.io/bikeshed). Start your 14-day free trial of BuildPulse today. Bartender (https://www.macbartender.com/) dry-rb - dry-monads v1.0 - Pattern matching (https://dry-rb.org/gems/dry-monads/1.0/pattern-matching/) alfred-workflows (https://github.com/tupleapp/alfred-workflows/blob/master/scripts/online_users.rb) Raycast (https://www.raycast.com/) ruby-science (https://github.com/thoughtbot/ruby-science) Inertia.js (https://inertiajs.com/) Remix (https://remix.run/) Become a Sponsor (https://thoughtbot.com/sponsorship) of The Bike Shed! Transcript: AD: Flaky tests take the joy out of programming. You push up some code, wait for the tests to run, and the build fails because of a test that has nothing to do with your change. So you click rebuild, and you wait. Again. And you hope you're lucky enough to get a passing build this time. Flaky tests slow everyone down, break your flow, and make things downright miserable. In a perfect world, tests would only break if there's a legitimate problem that would impact production. They'd fail immediately and consistently, not intermittently. But the world's not perfect, and flaky tests will happen, and you don't have time to fix all of them today. So how do you know where to start? BuildPulse automatically detects and tracks your team's flaky tests. Better still, it pinpoints the ones that are disrupting your team the most. With this list of top offenders, you'll know exactly where to focus your effort for maximum impact on making your builds more stable. In fact, the team at Codecademy was able to identify their flakiest tests with BuildPulse in just a few days. By focusing on those tests first, they reduced their flaky builds by more than 68% in less than a month! And you can do the same because BuildPulse integrates with the tools you're already using. It supports all of the major CI systems, including CircleCI, GitHub Actions, Jenkins, and others. And it analyzes test results for all popular test frameworks and programming languages, like RSpec, Jest, Go, pytest, PHPUnit, and more. So stop letting flaky tests slow you down. Start your 14-day free trial of BuildPulse today. To learn more, visit buildpulse.io/bikeshed. That's buildpulse.io/bikeshed. STEPH: What type of bird is the strongest bird? CHRIS: I don't know. STEPH: A crane. [laughter] STEPH: You're welcome. And on that note, shall we wrap up? CHRIS: Let's wrap up. [laughter] Hello and welcome to another episode of The Bike Shed, a weekly podcast from your friends at thoughtbot about developing great software. I'm Chris Toomey. STEPH: And I'm Steph Viccari. CHRIS: And together, we're here to share a bit of what we've learned along the way. So, Steph, what's new in your world? STEPH: Hey, Chris, I saw a good movie I'd like to tell you about. It was just over the weekend. It's called The Duke, and it's based on a real story. I should ask, have you seen it? Have you heard of this movie called The Duke? CHRIS: I don't think so. STEPH: Okay, cool. It's a true story, and it's based on an individual named Kempton Bunton who then stole a particular portrait, a Goya portrait; if you know your artist, I do not. But he stole a Goya portrait and then essentially held at ransom because he was a big advocate that the BBC News channel should be free for people that are living on a pension or that are war veterans because then they're not able to afford that fee. But then, if you take the BBC channel away from them, it disconnects them from society. And it's a very good movie. I highly recommend it. So I really enjoyed watching that over the weekend. CHRIS: All right. Excellent recommendation. We will, of course, add that to the show notes mostly so that I can find it again later. STEPH: On a more technical note, I have a small update, or it's more of a question. It's an update and a question wrapped into one about the work that is being done to migrate the Test::Unit test over to RSpec. This has been quite a journey that Joël and I have been on for a while now. And we're making progress, but we're realizing that we're spending like 95% of our time in the test setup and porting that over, specifically because we're mapping fixture data over to FactoryBot, and we're just realizing that's really painful. It's taking up a lot of time to do that. And initially, when I realized we were just doing that, we hadn't even really talked about it, but we were moving it over to FactoryBot. I was like, oh, cool. We'll get to delete all these fixtures because there are around 208 files of them. And so that felt like a really good additional accomplishment to migrating the test over. But now that we realize how much time we're spending migrating the data over for that test setup, we've reevaluated, and I shared with Joël in the Slack channel. I was like, crap. I was like, I have a bad idea, and I can't not say it now because it's crossed my mind. And my bad idea was what if we stopped porting over fixtures to FactoryBot and then we just added the fixtures to a directory that RSpec would look so then we can rely on those fixtures? And then that way, we're literally then ideally just copying over from Test::Unit over to RSpec. But it does mean a couple of things. Well, one, it means that we're now running those fixtures at the beginning of RSpec test. We're introducing another pattern of where these tests are already using FactoryBot, but now they have fixtures at the top, and then we won't get to delete the fixtures. So we had a conversation around how to manage and mitigate some of those concerns. And we're still in that exploratory. We're going to test it out and see if this really speeds us up referencing the fixtures. The question that's wrapped up in this is there's something different between how fixtures generate data and how factories generate data. So I've run into this a couple of times now where I moved data over to just call a factory. But then I was hitting these callbacks or after-save-hooks or weird things that were then preventing me from creating the record, even though fixtures was creating them just fine. And then Joël pointed out today that he was running into something similar where there were private methods that were getting called. And there were all sorts of additional code that was getting run with factories versus fixtures. And I don't have an answer. Like, I haven't looked into this. And it's frankly intentional because I was trying hard to not dive into understanding the mechanics. We really want to get through this. But now I'm starting to ponder a little more as to what is different with fixtures and factories? And I liked that factories is running these callbacks; that feels correct. But I'm surprised that fixtures doesn't, or at least that's the experience that I'm having. So there's some funkiness there that I'd like to explore. I'll be honest; I don't know if I'm going to. But if anybody happens to know what that funkiness is or why fixtures and factories are different in that regard, I would be very intrigued because, at some point, I might look into it just because I would like to know. CHRIS: Oh, that is interesting. I have not really worked with fixtures much at all. I've lived a factory life myself, and thus that's where almost all of my experience is. I'm not super surprised if this ends up being the case, like, the idea that fixtures are just some data that gets shoveled into the database directly as opposed to FactoryBot going through the model layer. And so it's sort of like that difference. But I don't know that for certain. That sounds like what this is and makes sense conceptually. But I think this is what you were saying like, that also kind of pushes me more in the direction of factories because it's like, oh, they're now representative. They're using our model layer, where we're defining certain truths. And I don't love callbacks as a mechanism. But if your app has them, then getting data that is representative is useful in tests. Like one of the things I add whenever I'm working with FactoryBot is the FactoryBot lint rake task RSpec thing that basically just says, "Are your factories valid?" which I think is a great baseline to have. Because you may add a migration that adds a default constraint or something like that to the database that suddenly all your factories are invalid, and it's breaking tests, but you don't know it. Like subtly, you change it, and it doesn't actually break a test, but then it's harder later. So that idea of just having more correctness baked in is always nice, especially when it can be automated like that, so definitely a fan of that. But yeah, interested if you do figure out the distinction. I do like your take, though, of like, but also, maybe I just won't figure this out. Maybe this isn't worth figuring it out. Although you were in the interesting spot of, you could just port the fixtures over and then be done and call the larger body of work done. But it's done in sort of a half-complete way, so it's an interesting trade-off space. I'm also interested to hear where you end up on that. STEPH: Yeah, it's a tough trade-off. It's one that we don't feel great about. But then it's also recognizing what's the true value of what we're trying to deliver? And it also comes down to the idea of churn versus complexity. And I feel like we are porting over existing complexity and even adding a smidge, not actual complexity but adding a smidge of indirection in terms that when someone sees this file, they're going to see a mixed-use of fixtures and factories, and that doesn't feel good. And so we've already talked about adding a giant comment above fixtures that just is very honest and says, "Hey, these were ported over. Please don't mimic this. But this is some legacy tests that we have brought over. And we haven't migrated the fixtures over to use factories." And then, in regards to the churn versus complexity, this code isn't likely to get touched like these tests. We really just need them to keep running and keep validating scenarios. But it's not likely that someone's going to come in here and really need to manage these anytime soon. At least, this is what I'm telling myself to make me feel better about it. So there's also that idea of yes, we are porting this over. This is also how they already exist. So if someone did need to manage these tests, then going to Test::Unit, they would have the same experience that they're going to have in RSpec. So that's really the crux of it is that we're not improving that experience. We're just moving it over and then trying to communicate that; yes, we have muddied the waters a little bit by introducing this other pattern. So we're going to find a way to communicate why we've introduced this other pattern, but that way, we can stay focused on actually porting things over to RSpec. As for the factories versus fixtures, I feel like you're onto something in terms of it's just skipping that model layer. And that's why a lot of that functionality isn't getting run. And I do appreciate the accuracy of factories. I'd much rather know is my data representative of real data that can get created in the world? And right now, it feels like some of the fixtures aren't. Like, how they're getting created seemed to bypass really important checks and validations, and that is wrong. That's not what we want to have in our test is, where we're creating data that then the rest of the application can't truly create. But that's another problem for another day. So that's an update on a trade-off that we have made in regards to the testing journey that we are on. What's going on in your world? CHRIS: Well, we got to do something exciting this week. I was working on some code. This is using dry-monads, the dry-rb space. So we have these result objects that we use pretty pervasively throughout the app, and often, we're in a controller. We run one of these command objects. So it's create user, and create user actually encompasses a ton of logic in our app, and that object returns a result. So it's either a success or a failure. And if it's a success, it'll be a success with that new user wrapped up inside of it, or if it's a failure, it's a specific error message. Actually, different structured error messages in different ways, some that would be pushed to the form, some that would be a flash message. There are actually fun, different things that we do there. But in the controller, when we interact with those result objects, typically what we'll do is we'll say result equals create user dot run, (result=createuser.run) and then pass it whatever data it needs. And then on the next line, we'll say results dot either, (results.either), which is a method on these result objects. It's on both the success and failure so you can treat them the same. And then you pass what ends up being a lambda or a stabby proc, or I forget what they are. But one of those sort of inline function type things in Ruby that always feel kind of weird. But you pass one of those, and you actually pass two of them, one for the success case and one for the failure case. And so in the success case, we redirect back with a notice of congratulations, your user was created. Or, in the failure case, we potentially do a flash message of an alert, or we send the errors down, or whatever it ends up being. But it allows us to handle both of those cases. But it's always been syntactically terrible, is how I would describe it. It's, yeah, I'm just going to leave it at that. We are now living in a wonderful, new world. This has been something that I've wanted to try for a while. But I finally realized we're actually on Ruby 2.7, and so thus, we have access to pattern matching in Ruby. So I get to take it for a spin for the first time, realizing that we were already on the correct version. And in particular, dry-monads has a page in their docs specific to how we can take advantage of pattern matching with the result objects that they provide us. There's nothing specific in the library as far as I understand it. This is just them showing a bunch of examples of how one might want to do it if they're working with these result objects. But it's really great because it gives the ability to interact with, you know, success is typically going to be a singular case. There's one success branch to this whole logic, but there are like seven different ways it can fail. And that's the whole idea as to why we use these command objects and the whole Railway Oriented Programming and that whole thing which I have...what is this word? [laughs] I feel like I should know it. It's a positive rant. I have raved; that is how our users kindly pointed that out to us. I have raved about the Railway Oriented Programming that allows us to do. But it's that idea that they're actually, you know, there's one happy path, and there are seven distinct failure modes, seven unhappy paths. And now, using pattern matching, we actually get a really expressive, readable, useful way to destructure each of those distinct failures to work with the particular bits of data that we need. So it was a very happy day, and I got to explore it. This is, again, a feature of Ruby, not a feature of dry-monads. But dry-monads just happens to embrace it and work really well with it. So that was awesome. STEPH: That is awesome. I've seen one or two; I don't know, I've seen a couple of tweets where people are like, yeah, Ruby pattern matching. I haven't found a way to use it. So I'm excited that you just shared a way that you found to use it. I'm also worried what it says about our developer culture that we know the word rant so well, but rave, we always have to reach back into our memory to be like, what's that positive word or something that we like? [laughs] CHRIS: And especially here on The Bike Shed, where we try to gravitate towards the positive. But yeah, it's an interesting point that you make. STEPH: We're a bunch of ranters. It's what we do, pranting ranters. I don't know why we're pranting. [laughs] CHRIS: Because it's that exciting. That's what it is. Actually, there was an interesting thing as we were playing around with the pattern matching code, just poking around in the console session with it, and it prints out a deprecation warning. It's like, warning: this is an experimental feature. Do not use it, be careful. But in the back of my head, I was like, I actually know how this whole thing plays out, Ruby 2.7, and I assure you, it's going to be fine. I have been to the future, at least I'm pretty sure. I think the version that is in Ruby 2.7 did end up getting adopted basically as it stands. And so, I think there is also a setting to turn off that deprecation warning. I haven't done it yet, but I mostly just enjoyed the conversation that I had with this deprecation message of like, listen, I've been to the future, and it's great. Well, it's complicated, but specific to this pattern matching [laughs] in Ruby 3+ versions, it went awesome. And I'm really excited about that future that we now live in. STEPH: I wish we had that for so many more things in our life [laughs] of like, here's a warning, and it's like, no, no, I've seen the future. It's all right. Or you're totally right; I should avoid and back out of this now. CHRIS: If only we could know how the things would play out, you know. But yeah, so pattern matching, very cool. I'll include a link in the show notes to the particular page in the dry-monads docs. But there are also other cool things on the internet. In an unrelated but also cool thing that I found this week, we use Tuple a lot within our organization for pair programming. For anyone who's not familiar with it, it's a really wonderful piece of technology that allows you to pair program pretty seamlessly, better video quality, all of those nice things that we want. But I found there was just the tiniest bit of friction in starting a Tuple call. I know I want to pair with this person. And I have to go up and click on the little menu bar, and then I have to find their name, then I have to click a button. That's just too much. That's not how...I want to live my life at the keyboard. I have a thing called Bartender, which is a little menu bar manager utility app that will collapse down and hide the icons. But it's also got a nice, little hotkey accessible pop-up window that allows me to filter down and open one of the menu bar pop-out menus. But unfortunately, when that happens, the Tuple window isn't interactive at that point. I can't use the arrow keys to go up and down. And so I was like, oh, man, I wonder if there's like an Alfred workflow for this. And it turns out indeed there is actually managed by the kind folks at Tuple themselves. So I was able to find that, install it; it's great. I have it now. I can use that. So that was a nice little upgrade to my workflow. I can just type like TC space and then start typing out the person's name, and then hit enter, and it will start a call immediately. And it doesn't actually make me more productive, but it makes me happier. And some days, that's what matters. STEPH: That's always so impressive to me when that happens where you're like, oh, I need a thing. And then you went through the saga that you just went through. And then the people who manage the application have already gotten there ahead of you, and they're like, don't worry, we've created this for you. That's one of those just beautiful moments of like, wow, y'all have really thought this through on a bunch of different levels and got there before me. CHRIS: It's somewhat unsurprising in this case because it's a very developer-centric organization, and Ben's background being a thoughtbot developer and Alfred user, I'm almost certain. Although I've seen folks talking about Raycast, which is the new hotness on the quick launcher world. I started eons ago in Quicksilver, and then I moved to Alfred, I don't know, ten years ago. I don't know what time it is anymore. But I've been in Alfred land for a while, but Raycast seems very cool. Just as an aside, I have not allowed myself... [laughs] this is another one of those like; I do not have permission to go explore this new tool yet because I don't think it will actually make me more productive, although it could make me happier. So... STEPH: I haven't heard of that one, Raycast. I'm literally adding it to the show notes right now as a way so you can find The Duke later, and I can find Raycast later [chuckles] and take a look at it and check it out. Although I really haven't embraced the whole Alfred workflow. I've seen people really enjoy it and just rave about it and how wonderful it is. But I haven't really leaned into that part of the world; I don't know why. I haven't set any hard and fast rules for myself where I can't play around with these technologies, but I haven't taken the time to do it either. CHRIS: You've also not found yourself writing thousands of lines of Vimscript because you thought that was a good idea. So you don't need as many guardrails it would seem. That's my guess. STEPH: This is true. CHRIS: Whereas I need to be intentional [laughs] with how I structure my interaction with my dev tools. STEPH: Instead, I'm just porting over fixtures from one place to another. [laughs] That's the weird space that I'm living in instead. [laughs] CHRIS: But you're getting paid for that. No one paid me for the Vimscript I wrote. [laughter] STEPH: That's fair. Speaking around process-y things, there's something that's been on my mind that Valeria, another thoughtboter, suggested around how we structure our meetings and the default timing that we have for meetings. So Thursdays are my team-focused day. And it's the day where I have a lot of one on ones. And I realized that I've scheduled them back to back, which is problematic because then I have zero break in between them, which I'm less concerned about that because then I can go for an hour or something and not have a break. And I'm not worried about that part. But it does mean that if one of those discussions happens to go over just even for like two or three minutes, then it means that someone else is waiting for me in those two to three minutes. And that feels unacceptable to me. So Valeria brought up a really good idea where I think it's only with the Google Meet paid version. I could be wrong there. But I think with the paid version of it that then you can set the new default for how long a meeting is going to last. So instead of having it default to 30 minutes, have it default to 25 minutes. So then, that way, you do have that five-minute buffer. So if you do go over just like two or three minutes with someone, you've still got like two minutes to then hop to the next call, and nobody's waiting for you. Or if you want those five minutes to then grab some water or something like that. So we haven't implemented it just yet because then there's discussion around is this a new practice that we want everybody to move to? Because I mean, if just one person does it, it doesn't work. You really need everybody to buy into the concept of we're now defaulting to 25 versus 30-minute meetings. So I'll have to let you know how that goes. But I'm intrigued to try it out because I think that would be very helpful for me. Although there's a part of me that then feels bad because it's like, well, if I have 30 minutes to chat with somebody, but now I'm reducing it to 25 minutes each time, I didn't love that I'm taking time away from our discussion. But that still feels like a better outcome than making somebody wait for three to five minutes if something else goes over. So have you ever run into something like that? How do you manage back-to-back meetings? Do you intentionally schedule a break in between or? CHRIS: I do try to give myself some buffer time. I stack meetings but not so much so that they're just back to back. So I'll stack them like Wednesdays are a meeting-heavy day for me. That's intentional just to be like, all right, I know that my day is going to get chopped up. So let's just really lean into that, chop the heck out of Wednesday afternoons, and then the rest of the week can hopefully have slightly longer deep work-type sessions. And, yeah, in general, I try and have like a little gap in between them. But often what I'll do for that is I'll stagger the start of the next meeting to be rather than on the hour or the half-hour, I start it on the 15th minute. And so then it's sort of I now have these little 15-minute gaps in my workflow, which is enough time to do one or two small things or to go get a drink or whatever it is or if things do run over. Like, again, I feel what you're saying of like, I don't necessarily want to constrain a meeting. Or I also don't necessarily want to go into the habit of often over-running. I think it's good to be intentional. Start meetings on time, end meetings on time. If there's a great conversation that's happening, maybe there's another follow-up meeting that should happen or something like that. But for as nonsensical of a human as I believe myself to be, I am rather rigid about meetings. I try very hard to be on time. I try very hard to wrap them up on time to make sure I go to the next one. And so with that, the 15-minute staggering is what I've found works for me. STEPH: Yeah, that makes sense. One-on-ones feels special to me because I wholeheartedly agree with being very diligent about like, hey, this is our meeting time. Let's do a time check. Someone says that at the end, and then that way, everybody can move on. But one on ones are, there's more open discussion space, and I hate cutting people off, especially because it might not be until the last 15 minutes that you really got into the meat of the conversation. Or you really got somewhere that's a little bit more personal or things that you want to talk about. So if someone's like, "Yeah, let me tell you about my life goals," and you're like, "Oh, no, wait, sorry. We're out of time." That feels terrible and tragic to do. So I struggle with that part of it. CHRIS: I will say actually, on that note, I'm now thinking through, but I believe this to be true. Everyone that reports to me I have a 45-minute one-on-one with, and then my CEO I set up the one-on-one. So I also made that one a 45-minute one-on-one. And that has worked out really well. Typically, I try and structure it and reiterate this from time to time of, like, hey, this is your space, not mine. So let's have whatever conversation fits in here. And it's fine if we don't need to use the whole time, but I want to make sure that we have it and that we protect it. Because I often find much like retro, I don't know; I think everything's fine. And then suddenly the conversation starts, and you're like, you know what? Actually, I'm really concerned now that you mentioned it. And you need that sort of empty space that then the reality sort of pop up into. And so with one on one, I try and make sure that there is that space, but I'm fine with being like, we can cut this short. We can move on from one-on-one topics to more of status updates; let's talk about the work. But I want to make sure that we lead with is there anything deeper, any concerns, anything you want to talk through? And sort of having the space and time for that. STEPH: I like that. And I also think it speaks more directly to the problem I'm having because I'm saying that we keep running over a couple of minutes, and so someone else is waiting. So rather than shorten it, which is where I'm already feeling some pain...although I still think that's a good idea to have a default of 25-minute meetings so then that way, there is a break versus the full 30. So if people want to have back-to-back meetings, they still have a little bit of time in between. But for one on ones specifically, upping it to 45 minutes feels nice because then you've got that 15-minute buffer likely. I mean, maybe you schedule a meeting, but, I don't know, that's funky. But likely, you've got a 15-minute buffer until your next one. And then that's also an area that I feel comfortable in sharing with folks and saying, "Hey, I've booked this whole 45 minutes. But if we don't need the whole time, that's fine." I'm comfortable saying, "Hey, we can end early, and you can get more of your time back to focus on some other areas." It's more the cutting someone off when they're talking because I have to hop to the next thing. I absolutely hate that feeling. So thanks, I think I'll give that a go. I think I'll try actually bumping it up to 45 minutes, presuming that other people like that strategy too, since they're opting in [laughs] to the 45 minutes structure. But that sounds like a nice solution. CHRIS: Well yeah, happy to share it. Actually, one interesting thing that I'm realizing, having been a manager at thoughtbot and then now being a manager within Sagewell, the nature of the interactions are very different. With thoughtbot, I was often on other projects. I was not working with my team day to day in any real capacity. So it was once every two weeks, I would have this moment to reconnect with them. And there was some amount of just catching up. Ideally, not like status update, low-level sort of thing, but sort of just like hey, what have you been working on? What have you been struggling with? What have you been enjoying? There was more like I needed bigger space, I would say for that, or it's not surprising to me that you're bumping into 30 minutes not being quite long enough. Whereas regularly, in the one on ones that I have now, we end up cutting them short or shifting out of true one-on-one mode into more general conversation and chatting about Raycast or other tools or whatever it is because we are working together daily. And we're pairing very regularly, and we're all on the same project and all sorts of in sync and know what's going on. And we're having retro together. We have plenty of places to have the conversation. So the one-on-one again, still, I keep the same cadence and the same time structure just because I want to make sure we have the space for any day that we really need that. But in general, we don't. Whereas when I was at thoughtbot, it was all the more necessary. And I think for folks listening; I could imagine if you're in a team lead position and if you're working very closely with folks, then you may be on the one side of things versus if you're a little bit more at a distance from the work that they're doing day to day. That's probably an interesting question to ask, and think about how you want to structure it. STEPH: Yeah, I think that's an excellent point. Because you're right; I don't see these individuals. We may not have really gotten to interact, except for our daily syncs outside of that. So then yeah, there's always like a good first 10 minutes of where we're just chatting about life and catching up on how things are going before then we dive into some other things. So I think that's a really good point. Cool, solving management problems on the mic. I dig it. In slightly different news, I've joined a book club, which I'm excited about. This book club is about Ruby. It's specifically reading the book Ruby Science, which is a book that was written and published by thoughtbot. And it requires zero homework, which is my favorite type of book club. Because I have found I always want to be part of book clubs. I'm always interested in them, but then I'm not great at budgeting the time to make sure I read everything I'm supposed to read. And so then it comes time for folks to get together. And I'm like, well, I didn't do my homework, so I can't join it. But for this one, it's being led by Joël, and the goal is that you don't have to do the homework. And they're just really short sections. So whoever's in charge of leading that particular session of the book club they're going to provide an overview of what's covered in whatever the reading material that we're supposed to read, whatever topic we're covering that day. They're going to provide an overview of it, an example of it, so then we can all talk about it together. So if you read it, that's wonderful. You're a bit ahead and could even join the meeting like five minutes late. Or, if you haven't read it, then you could join and then get that update. So I'm very excited about it. And this was one of those books that I'd forgotten that thoughtbot had written, and it's one that I've never read. And it's public for anybody that's interested in it. So to cover a little bit of details about it, so it talks about code smells, ways to refactor code, and then also common patterns that you can use to solve some issues. So there's a lot of really just great content that's in it. And I'll be sure to include a link in the show notes for anyone else that's interested. CHRIS: And again, to reiterate, this book is free at this point. Previously, in the past, it was available for purchase. But at one point a number of years ago, thoughtbot set all of the books free. And so now that along with a handful of other books like...what's Edward's DNS book? Domain Name Sanity, I believe, is Edward's book name that Edward Loveall wrote when he was not a thoughtboter, [laughs] and then later joined as a thoughtboter, and then we made the book free. But on the specific topic of Ruby Science, that is a book that I will never forget. And the reason I will never forget it is that book was written by the one and only CTO Joe Ferris, who is an incredibly talented developer. And when I was interviewing with thoughtbot, I got down to the final day, which is a pairing session. You do a morning pairing session with one thoughtbot developer, and you do an afternoon pairing session with another thoughtbot developer. So in the morning, I was working with someone on actually a patch to Rails which was pretty cool. I'd never really done that, so that was exciting. And that went fine with the exception that I kept turning on Caps Lock on their keyboard because I was used to Caps Lock being CTRL, and then Vim was going real weird for me. But otherwise, that went really well. But then, in the afternoon, I was paired with the one and only CTO Joe Ferris, who was writing the book Ruby Science at that time. And the nature of the book is like, here's a code sample, and then here's that code sample improved, just a lot of sort of side-by-side comparisons of code. And I forget the exact way that this went, but I just remember being terrified because Joe would put some code up on the screen and be like, "What do you think?" And I was like, oh, is this the good code or the bad code? I feel like I should know. I do not know. I'm not sure. It worked out fine, I guess. I made it through. But I just remember being so terrified at that point. I was just like, oh no, this is how it ends for me. It's been a good run. STEPH: [laughs] CHRIS: I made it this far. I would have loved to work for this nice thoughtbot company, but here we are. But yeah, I made it through. [laughs] STEPH: There are so many layers to that too where it's like, well if I say it's terrible, are you going to be offended? Like, how's this going to go for me if I speak my truths? Or what am I going to miss? Yeah, that seems very interesting (I kind of like it.) but also a terrifying pairing session. CHRIS: I think it went well because I think the code...I'd been following thoughtbot's work, and I knew who Joe was and had heard him on podcasts and things. And I kind of knew roughly where things were, and I was like, that code looks messy. And so I think I mostly got it right, but just the openness of the question of like, what do you think? I was like, oh God. [laughs] So yeah, that book will always be in my memories, is how I would describe it. STEPH: Well, I'm glad it worked out so we could be here today recording a podcast together. [laughs] CHRIS: Recording a podcast together. Now that I say all that, though, it's been a long time since I've read the book. So maybe I'll take a revisit. And definitely interested to hear more about your book club and how that goes. But shifting ever so slightly (I don't have a lot to say on this topic.) but there's a new framework technology thing out there that has caught my attention. And this hasn't happened for a while, so it's kind of novel for me. So I tend to try and keep my eye on where is the sort of trend of web development going? And I found Inertia a while ago, and I've been very, very happy with that as sort of this is the default answer as to how I build websites. To be clear, Inertia is still the answer as to how I build websites. I love Inertia. I love what it represents. But I'm seeing some stuff that's really interesting that is different. Specifically, Remix.run is the thing that I'm seeing. I mentioned it, I think, in the last episode talking about there was some stuff that they were doing with data loading and async versus synchronous, and do you wait on it or? They had built some really nice levers and trade-offs into the framework. And there's a really great talk that Ryan Florence, one of the creators of Remix.run, gave about that and showed what they were building. I've been exploring it a little bit more in-depth now. And there is some really, really interesting stuff in Remix. In particular, it's a meta-framework, I think, is the nonsense phrase that we use to describe it. But it's built on top of React. That won't be true for forever. I think it's actually they would say it's more built on top of React Router. But it is very similar to Next.js for folks that have seen that. But it's got a little bit more thought around data loading. How do we change data? How do we revalidate data after? There's a ton of stuff that, having worked in many React client-side API-heavy apps that there's so much pain, cache invalidation. How do you think about the cache? When do you fetch from the network? How do you avoid showing 19 different loading spinners on the page? And Remix as a framework has some really, I think, robust and well-thought-out answers to a lot of that. So I am super-duper intrigued by what they're doing over there. There's a particular video that I think shows off what Remix represents really well. It's Ryan Florence, that same individual, the creator of Remix, building just a newsletter signup page. But he goes through like, let's start from the bare bones, simplest thing. It's just an input, and a form submits to the server. That's it. And so we're starting from web 2.0, long, long ago, sort of ideas, and then he gradually enhances it with animations and transitions and error states. And even at the end, goes through an accessibility audit using the screen reader to say, "Look, Remix helps you get really close because you're just using web fundamentals." But then goes a couple of steps further and actually makes it work really, really well for a screen reader. And, yeah, overall, I'm just super impressed by the project, really, really intrigued by the work that they're doing. And frankly, I see a couple of different projects that are sort of in this space. So yeah, again, very early but excited. STEPH: On their website...I'm checking it out as you're walking me through it, and on their website, they have "Say goodbye to Spinnageddon." And that's very cute. [laughs] CHRIS: There's some fundamental stuff that I think we've just kind of as a web community, we made some trade-offs that I personally really don't like. And that idea of just spinners everywhere just sending down a ball of application logic and a giant JavaScript file turning it on on someone's computer. And then immediately, it has to fetch back to the server. There are just trade-offs there that are not great. I love that Remix is sort of flipping that around. I will say, just to sort of couch the excitement that I'm expressing right now, that Remix exists in a certain place. It helps with building complex UIs. But it doesn't have anything in the data layer. So you have to bring your own data layer and figure out what that means. We have ActiveRecord within Rails, and it's deeply integrated. And so you would need to bring a Prisma or some other database connection or whatever it is. And it also doesn't have more sort of full-featured framework things. Like with Rails, it's very easy to get started with a background job system. Remix has no answer to that because they're like, no, no, this is what we're doing over here. But similarly, security is probably the one that concerns me the most. There's an open conversation in their discussion portal about CSRF protection and a back and forth of whether or not Remix should have that out of the box or not. And there are trade-offs because there are different adapters that you can use for auth. And each would require their own CSRF mitigation. But to me, that is the sort of thing that I would want a framework to have. Or I'd be interested in a framework that continues to build on top of Remix that adds in background jobs and databases and all that kind of stuff as a complete solution, something more akin to a Rails or a Laravel where it's like, here we go. This is everything. But again, having some of these more advanced concepts and patterns to build really, really delightful UIs without having to change out the fundamental way that you're building things. STEPH: Interesting. Yeah, I think you've answered a couple of questions that I had about it. I am curious as to how it fits into your current tech stack. So you've mentioned that you're excited and that it's helpful. But given that you already have Rails, and Inertia, and Svelte, does it plug and play with the other libraries or the other frameworks that you have? Are you going to have to replace something to then take advantage of Remix? What does that roadmap look like? CHRIS: Oh yeah, I don't expect to be using Remix anytime soon. I'm just keeping an eye on it. I think it would be a pretty fundamental shift because it ends up being the server layer. So it would replace Rails. It would replace the Inertia within the stack that I'm using. This is why as I started, I was like, Inertia is still my answer. Because Inertia integrates really well with Rails and allows me to do the sort of it's not progressive enhancement, but it's like, I want fancy UI, and I don't want to give up on Rails. And so, Inertia is a great answer for that. Remix does not quite fit in the same way. Remix will own all of the request-response lifecycle. And so, if I were to use it, I would need to build out the rest of that myself. So I would need to figure out the data layer. I would need to figure out other things. I wouldn't be using Rails. I'm sure there's a way to shoehorn the technologies together, but I think it sort of architecturally would be misaligned. And so my sense is that folks out there are building...they're sort of piecing together parts of the stack to fill out the rest. And Remix is a really fantastic controller and view from their down experience and routing layer. So it's routing, controller, view I would say Remix has a really great answer to, but it doesn't have as much of the other stuff. Whereas in my case, Inertia and Rails come together and give me a great answer to the whole story. STEPH: Got it. Okay, that's super helpful. CHRIS: But yeah, again, I'm in very much the exploratory phase. I'm super intrigued by a lot of what I've seen of it and also just sort of the mindset, the ethos of the project as it were. That sounds fancy as I say it, but it's what I mean. I think they want to build from web fundamentals and then enhance the experience on top of that, and I think that's a really great way to go. It means that links will work. It means that routing and URLs will work by default. It means that you won't have loading spinner Armageddon, and these are core fundamentals that I believe make for good websites and web applications. So super interested to see where they go with it. But again, for me, I'm still very much in the Rails Inertia camp. Certainly, I mean, I've built Sagewell on top of it, so I'm going to be hanging out with it for a while, but also, it would still be my answer if I were starting something new right now. I'm just really intrigued by there's a new example out there in the world, this Remix thing that's pushing the envelope in a way that I think is really great. But with that, my now…what was that? My second or my third rave? Also called the positive rant, as we call it. But yeah, I think on that note, what do you think? Should we wrap up? STEPH: Let's wrap up. CHRIS: The show notes for this episode can be found at bikeshed.fm. STEPH: This show is produced and edited by Mandy Moore. CHRIS: If you enjoyed listening, one really easy way to support the show is to leave us a quick rating or even a review on iTunes, as it really helps other folks find the show. STEPH: If you have any feedback for this or any of our other episodes, you can reach us at @_bikeshed or reach me on Twitter @SViccari. CHRIS: And I'm @christoomey. STEPH: Or you can reach us at hosts@bikeshed.fm via email. CHRIS: Thanks so much for listening to The Bike Shed, and we'll see you next week. ALL: Byeeeeeeee!!!!!!!!! ANNOUNCER: This podcast was brought to you by thoughtbot. thoughtbot is your expert design and development partner. Let's make your product and team a success.
Another toaster strudel debate?! Plus, the results are in for the most listened-to podcast in the RoR community! :: drum roll :: Steph has a "Dear Gerrit" message to share. Chris has a follow-up on mobile app strategy. The Bike Shed: 328: Terrible Simplicity (https://www.bikeshed.fm/328) When To Fetch: Remixing React Router - Ryan Florence (https://www.youtube.com/watch?v=95B8mnhzoCM) Virtual Event - Save Time & Money with Discovery Sprints (https://thoughtbot.com/events/save-time-money-with-discovery) Become a Sponsor (https://thoughtbot.com/sponsorship) of The Bike Shed! Transcript: STEPH: thoughtbot's next virtual event "Save Time & Money with Discovery Sprints" is coming up on June 17th, from 2 - 3 PM Eastern. It's a discussion with team members from product management, design and development. From a developer perspective, topics will include how to plan a product's architecture, both the MVP and future version, how to lead a tech spikes into integrations and conduct a build vs buy reviews of third party providers. Head to thoughtbot.com/events to register, the event is June 17th 2 - 3 PM ET. Even if you can't make it, registering will get you on the list for the recording. CHRIS: We're the second-best. We're the second-best. Hello and welcome to another episode of The Bike Shed, a weekly podcast from your friends at thoughtbot about developing great software. I'm Chris Toomey. STEPH: And I'm Steph Viccari. CHRIS: And together, we're here to share a bit of what we've learned along the way. So, Steph, what's new in your world? STEPH: I'm very happy to report that I picked up a treat from the store recently. So while I was in Boston and we were hanging out in person, we talked about Pop-Tarts because that always comes up as a debate, as it should. And then also Toaster Strudels came up, so I now have a package of Toaster Strudels, and those are legit. Pop-Tart or Toaster Strudel, I am team Toaster Strudel, which I know you're going to ask me about icing and if I put it on there, so go ahead. I'm going to pause. [laughs] CHRIS: It sounds like I don't even need to say anything. But yes, inquiring minds want to know. STEPH: I think that's also my very defensive response because yes, I put icing on my Toaster Strudel. CHRIS: How interesting. [laughs] STEPH: But it feels like a whole different class of pastry. So I'm very defensive about my stance on Pop-Tarts with no icing put Strudel with icing. CHRIS: A whole different class of pastry. Got it. Noted. Understood. So did you travel? Like, were these in your luggage that you flew back with? STEPH: [laughs] Oh no. They would be all gooey and melty. No, we bought them when we got back to North Carolina. Oh, that'd be a pro move; just pack little individual Strudels as your airplane snack. Ooh, I might start doing that now. That sounds like a great airplane snack. CHRIS: You got to be careful though if the icing, you know, if it's pressurized from ground level and then you get up there, and it explodes. And you gotta be careful. Or is it the reverse? It's lower pressure up in the plane. So it might explode. STEPH: [laughs] Either way, it might explode. CHRIS: Well, yeah. If you somehow buy a packet of icing that is sky icing that is at that pressure, and you bring it down, then...but if you take it up and down, I think it's fine. If you open it at the top, you might be in danger. If you open icing under the ocean, I think nothing's going to happen. So these are the ranges that we're playing with. STEPH: I will be very careful sky icing and probably pack two so that way I have a backup just in case. So if one explodes, we'll be like, all right, now I know what I'm working with and be more prepared for the next one. CHRIS: That's just smart. STEPH: I try to make smart travel decisions, Toaster Strudels on the go. Aside from travel treats and sky icing, I have some news regarding Planet Argon, who is a Ruby on Rails consultancy regarding their latest published this year's Ruby on Rails community survey results. And so they list a lot of fabulous different topics in there. And one of them includes a learning section that highlights most listened to podcasts in the Ruby on Rails community as well as blogs and some other resources. And Bike Shed is listed as the second most listened to podcast in the Ruby on Rails community, so whoo, golf clap. CHRIS: Fantastic. STEPH: And in addition to that, the thoughtbot blog got a really nice shout-out. So the thoughtbot blog is in the number two spot for the most visited blogs in the community. In the first spot is Ruby Weekly, which is like, you know, okay, that feels fair, that feels good. So it's really exciting for the thoughtbot blog because a lot of people work really hard on curating and creating that content. So that's wonderful that so many people are enjoying it. And then I should also highlight that for the podcast in first place is Remote Ruby, so congrats to Chris, Jason, and Andrew for grabbing that number one spot. And Brittany Martin, host of the Ruby on Rails Podcast, along with Brian Mariani, Jemma Issroff, and Nick Schwaderer, are in the number three spot. And some people say that Ruby is losing steam but look at all that content and all those highly ranked podcasts. I mean, we like Ruby so much we're spending time recording ourselves talking about it. So I say long live Ruby, long live Rails. CHRIS: Yes. Long live Ruby indeed. And yeah, it's definitely an honor to be on the list and to be amongst such other wonderful shows. Certainly big fans of the work of those other podcasts. We even did a joint adventure with them at one point, and that was a really wonderful experience, so yeah, honored to be on the list alongside them. And to have folks out there in the world listening to our tech talk and nonsense always nice to hear. STEPH: Yeah. You and I show up and say lots of silly things and technical things into the podcast. The true heroes are the ones that went and voted. So thank you to everybody who voted. That's greatly appreciated. It's really nice feedback. Because we get listener responses and questions, and those are wonderful because it lets us know that people are listening. But I have to say that having the survey results is also really nice. It lets us know people like the show. Oh, but I did go back and look at some of the previous stats because then I was like, huh, so I'm paying attention. I looked at this year's, and I was like, I wonder what last year's was or the year before that. And I think this survey comes out every two years because I didn't see one for 2021. But I did find the survey results for 2020, which we were in the number one spot for 2020, and Remote Ruby was in the second spot. So I feel like now we've got a really nice, healthy podcasting war situation going on to see who can grab the first spot. We've got two years, everybody, to see who [laughs] grabs the number one spot. That's a lot of prep time for a competition. CHRIS: Yeah, I feel like we should be like, I don't know, planning elaborate pranks on them or something like that now. Is that where this is at? It's something like that, I think. STEPH: I think so. I think this is where you put like sky frosting inside someone's suitcase, and that's the type of prank that you play. [laughs] CHRIS: The best of pranks. STEPH: We'll definitely put together a little task force. And we'll start thinking of pranks that we all need to start playing on each other for the podcasting wars that we're entering for the next few years. But anywho, what's going on in your world? CHRIS: Let's see, what's going on in my world? A fun thing happened recently. I had a chance to reflect back on some architectural choices that we've made in the Sagewell platform. And one of those specific choices is how we've approached building our native mobile apps. We made what some listeners may remember is an interesting set of choices. In particular, in Episode 328, which we'll include a link to in the show notes, I shared with you the approach that we're doing, which is basically like, Inertia is great, web user great. We like the web as a platform. What if we were to wrap it in a native shell and find this interesting and somewhat unique hybrid trade-off point? And so, at that point, we were building it. We had most of it built out, and things were going quite well. I think we maybe had the iOS app in the store and the Android app approaching the store or something like that. At this point, both apps have been released to the store, so they are live. Production users are signing in. It's wonderful. But I had a moment in the past couple of weeks to reassess or look at that set of choices and evaluate it. And thankfully, I'm happy with the choices that we've made. So that's good. But to get into the specifics, there were two things that happened that really, really framed the choice that we made, so one was we introduced a major new feature. We basically overhauled the first-run experience, the onboarding that users experience, and added a new, pretty fundamental facet to the platform. It's a bunch of new screens, and flows, and error states, and all of this complexity. And in the process, we iterated on it a bunch. Like, first, it looked like this, and then we changed the order of the screens and switched out the error messages, and et cetera, et cetera. And I'll be honest, we never even thought about the mobile apps. It just wasn't even a consideration. And interestingly, we did as a final check before going fully live and releasing this out to the full production audience; we did spot check it in the mobile apps, and it didn't work. But it didn't work for a very specific, boring, technical reason that we were able to resolve. It has to do with iframes and WebViews and embedded something, something. And we had to set a flag. Thankfully, it was solvable without a deploy of the native mobile apps. And otherwise, we never thought about the native apps. Specifically, we were able to add this fundamental set of features to our platform. And they just worked in native mobile. And they were the same as they roughly are if you're on a mobile WebView or if you're on a desktop web, you know, slightly different in terms of form factor. But the functionality was all the same. And critically, the error states and the edge cases and the flow, there's so much to think about when you're adding a nontrivial feature to an app. And the fact that we didn't have to consider it really spoke to the choice that we made here. And again, to name it, the choice that we made is we're basically just reusing the same WebViews, the same Rails controllers, and the same what are Svelte components under the hood but the same essentially view layer as well. And we are wrapping that in a native iOS. It's a Swift application shell, and on Android, it's a Kotlin application shell. But under the hood, it's the same web stuff. And that was really great. We just got these new features. And you know what? If we have to rip that whole set of functionality out, again, we won't need to deploy. We won't need to rethink it. Or, if we want to subtly tweak it, we can do that. If we want to think about feature flags or analytics, or error states or error reporting, all of this just naturally falls out of the approach that we took. And that was really wonderful. STEPH: That's super nice. I also love this saga of like, you made a choice, and then you're coming back to revisit and share how it's going. So as someone who's never done this before, in regards of wrapping an application in the manner that you have and then publishing it and distributing it that way, what does that process look like? Is this one of those like you run a command, and literally, it's going to wrap the application and then make it hostable on the different mobile app stores? Or what's that? Am I oversimplifying the process? What does that look like? CHRIS: I think there are a lot of platforms or frameworks I think would probably be the better word like Capacitor is something that comes to mind or Ionic or Expo. There are a handful of them that are a little more fully featured in what they provide. So you just point us at your React Views and whatnot, and we'll wrap that up, and it'll be great. But those are for, I may be overgeneralizing here, but my understanding is those are for more heavy client-side bundles that are talking to a common API. And so you're basically taking your same rich client-side application and bundling that up for reuse on the native app, the native app platforms. And so I think those do have some release to the store sort of thing. In our case, we went a little bit further with that integration wrapper thing that we built. So that is a thing that we maintain. We have a Sagewell iOS repo and a Sagewell Android repo. There's a bunch of Swift and Kotlin code, respectively, in each of them, and we deploy to the stores manually. We're doing that whole process. But critically, the code that is in each of those repositories is just the bridge glue code that says, oh, when this Inertia navigation event happens, I'm going to push a WebView to the navigation stack. And that's what that is. I'm going to render the tab bar of buttons at the bottom with the navigation elements that I get from the server. But it's very much server-driven UI, is the way that I would describe it. And it's wrapping WebViews versus actually having the whole client bundle wrapped up in the thing. It's unfortunately subtle to try and talk through on the radio, but yeah. [laughs] STEPH: You're doing great; this is helping. So if there's a change that you want to make, you go to the Rails application, and you make that change. And then do you need to update anything on that iOS repo? It sounds like you don't, which then you don't have to push a new update to the store. CHRIS: Correct. For the vast majority of things, we do not need to make any changes. It's very rare for us to deploy the iOS or the Android app is a different way to put it or to push new releases to the store. It happens we may want to add a new feature to the sort of bridge layer that we built, but increasingly, those are rare. And now it's basically like, yeah, we're just wrapping those WebViews, and it's going great. And again, to name it, it's a trade-off. It's an intentional trade-off that we've made. We're never going to have the richest, most deep platform integration, smooth experience. We are making a small trade-off on that front. But given where we're at as an organization, given how early we are, how much iteration and change, we chose an architecture that optimizes for that change. And so again, like what you just said, yeah, I can...you know how it's really nice to be able to deploy six times a day on a web app, and that's a very straightforward thing to do? It is not so straightforward in the native mobile world. And so, we now have afforded ourselves the ability to do that. But critically, and this is the fun part in my mind, have the trade-offs in the controls. So if we were just like, it's just a WebView, and that's it, and we put it in the stores, and we're done, that is too far of an extreme in my mind. I think the performance trade-offs, the experience trade-offs, it wouldn't feel like a native app like in a deep way, in a problematic way. And so as an example, we have a navigation bar at the top of our app, particularly on iOS, that is native iOS navigation. And we have a tab bar at the bottom, which is native tab UI element. I forget actually what it's called, but it's those elements. And we hide the web application navigation when we're in the mobile context. So we actually swap those out and say, like, let's actually promote these to formal native functionality. We also, within our UI on the web, have a persistent button in the top right corner of your screen that says, "Need help? Reach out to your retirement advocate." who is the person that you get to work with. You can send questions, et cetera, et cetera. It's this little help sidebar drawer thing that pops out. And we have that as a persistent HTML button in the top corner of the web frame. But when we're on native, we push that up as a distinct element in the native UI section. And then again, the bridge that I'm talking about allows for bi-directional communication between the JavaScript side and the native side or the native side and the JavaScript side. And so it's those sorts of pieces that have now afforded us all of the freedom to tinker, and we don't need to re-release where we're like, oh, we want to add a new weird button that does a thing in the WebView when you click on a button outside the WebView. We now just have that built-in. STEPH: Yeah, I really like the flexibility that you're describing. When you promoted those elements to be more native-friendly so, like the navigation or the footer or the little get help chat, is that something that then your team implemented in like the iOS or the Kotlin repo? Okay, I see you nodding, but other people can't see that, so...[laughs] CHRIS: Yeah. I was going to also say the words, but yes, those are now implemented as native parts. So the thing that we built isn't purely agnostic decoupled. It is Sagewell-specific; a lot of it is low-level. Like, let's say we want to wrap an Inertia app in a native mobile wrapper. Like, 90% of the code in it is that, but then there are little bits that are like, and put a button up there. And that button is the Sagewell button. And so it's not entirely decoupled from us. But it mostly is this agnostic bridge to connect things together. STEPH: Yeah, the way you're describing it sounds really nice in terms of you're able to get out the app quickly and have a mobile app quickly that works on both platforms, and then you're still able to deploy changes without having to push that. That was always my biggest mental, or emotional hurdle with the idea of mobile development was the concept of that you really had to batch everything together and then submit it for review and approval and then get it released. And then you got to hope people then upgrade and get the newest version. And it just felt like such a process, not that I ever did much of it. This was all just even watching like the mobile team and all the work that they had to do. And I had sympathy pains for them. But the fact that this approach allows you to avoid a lot of that but still have some nice, customized, more native elements. Yeah, I'm basically just recapping everything you said because I like all of it. CHRIS: Well, thank you, friend. Like I said, I've really enjoyed it, and similar to you, I'm addicted to the feedback loop of the web. It's beautiful. I can deploy ten times or however many I want. Anytime I want, I can push out a new version. And that ability to iterate, to test, to explore, to tweak, to not have to do as much formal testing upfront because I'm terrified that if a bug sneaks out, then, it'll take me two weeks to address it; it just is so, so freeing. And so to give that up moving into a native context. Perhaps I'm fighting too hard to hold on to my dream of the ability to rapidly iterate. But I really do believe in that and especially for where we're at as an organization right now. But, and a critical but here, again, it's a trade-off like anything else. And recently, I happened to be out about in the town, and I decided, oh, you know what? Let me open up the app. Let me see what it's like. And I wasn't on great internet. And so I open the app, and it loads because, you know, it's a native app, so it pops up. But then the thing that actually happened is a loading spinner in the middle of the screen and sort of a gray nothing for a little while until the server request to fetch the necessary UI elements to render the login screen appeared. And that experience was not great. In particular, that experience is core to the experience of using the app every single time. Every time you use it, you're going to have a bad time because we're re-downloading that UI element. And there's caching, and there's things that could happen there to help with that. But fundamentally, that experience is going to be a pretty common one. It's the first thing that you experience when you're opening the app. And so I noticed that and I chatted with the team, and I was like, hey, I feel like this is actually something that fixing this I think would really fundamentally move us along that spectrum of like, we've definitely made some trade-offs here. But overall, it feels snappy and like a native app. And so, we opted to prioritize work on a native login screen for both platforms. This also allows us to more deeply integrate. So particularly, we're going to get biometric logins like fingerprints or face scans, or whatever it is. But critically, it's that experience of like, I open the Sagewell native app on my iOS phone, and then it loads immediately. And then I show it my face like we do these days, and then it opens up and shows me everything that I want to see inside of it. And it's that first-run experience that feels worth the extra effort and the constraints. Because now that it's native mobile, that means in order to change it, we have to do a deploy, not a deploy, release; that's what they call it in the native world. [laughs] You can tell I'm well-versed in this ecosystem. But yeah, we're now choosing that trade-off. And what I really liked about this sort of set of things like the feature that we were able to just accidentally get for free on native because that's how this thing is built. And then likewise, the choice to opt into a fully native login screen like having that lever, having that control over I'm going to optimize for iteration generally, but where it's important, we want to optimize for performance and experience. And now we have this little slider that we can go back and forth. And frankly, we could choose to screen by screen just slowly replace everything in the app with true native WebViews backed by APIs. And we could Ship of Theseus style replace every element of the app with true native mobile things until none of the old bridge code exists. And our users, in theory, would never know. Having that flexibility is really nice given the trade-off and the choice that we've made. STEPH: You said a word there that I missed. You said ship something style. CHRIS: Ship of Theseus. STEPH: What is that? CHRIS: It's like an old biblical story, I want to say, but it's basically the idea of, like, you have the ship. And then some boards start to rot out, so replace those boards. And then the mast breaks, you replace the mast. And slowly, you've replaced every element on the ship. Is it still the same ship at that point? And so it's sort of a philosophical question. So if we replace every single view in this app with a native view, is it still the same map? Philosophers will philosophize about it forever, but whatever. As long as we get to keep iterating and shipping software, then I'm happy. STEPH: [laughs] Y'all philosophize. That's that word, right? CHRIS: Yeah. STEPH: And do your philosopher thing. We'll just keep building and shipping. CHRIS: I don't know if I pronounced it right. It's like either Theseus or Theseus, and I'm sure I said the wrong one. And now that I've said the other, I'm sure both of them are wrong somehow. It's like a USB where there's up and down, and yet somehow it takes three tries. So anyway, I may have mispronounced it, and I may be misattributing it, but that's the idea I was going for. STEPH: Well, given I wasn't even familiar with the word until just now, I'm going to give both pronunciations a thumbs up. I also really like how you decided that for the login screen, that's the area that you don't want people to wait because I agree if you're opening an application or opening...maybe it's the first time, maybe it's the 100th time. Who knows? But that feels important. Like, that needs to be snappy. I need to know it's responsive. And it builds trust from the minute that I clicked on that application. And if it takes a long time, I just immediately I'm like, what are y'all doing? Are y'all real? Do you know what you're doing over there? So I like how you focused on that experience. But then once I log in, like if something is slow to log me in, I will make up excuses for the application all day where I'm like, well, you know, maybe it's my connection. It's fine. I can wait for the next screen to load. That feels more reasonable. And it doesn't undermine my trust nearly as much as when I first click on the app. So that feels like a really nice trade-off as well, or at least a nice area that you've improved while still having those other trade-offs and benefits that you mentioned. CHRIS: To highlight it, you used a phrase there which I really liked. Like, it's building trust. If something's a little bit off in that first run experience every single time, then it kind of puts a question in the back of your head, maybe not even consciously. But you're just kind of looking at it, and you're like, what are you doing there? What are you up to, friend? Humans say to the apps they use on their phone. That's normal, right? When you talk... But to name it, we've also done a round of performance work throughout the app. And so there are a couple of layers to it. But it was work that we had planned for a while, but we kept deferring. But now that we're seeing more usage of the native apps, the native apps experience the same surface area of performance stuff but all the more so because they may be on degraded network connections, et cetera. And so this is another example where this whole thing kind of pays off. The performance work that we did affects everything. It affects the web. It's the same under the hood. It's let's reduce the network requests that we're making in the payloads that we're sending, particularly the network requests to upstream things, so like the banking partner that we're using and those APIs, like, collating all the data to then render the screen. Because of Inertia, we only have a single sort of back and forth conversation via the API as opposed to I think it's pretty common to have like seven different APIs and four different spinners on the screen. We're not doing that, none of that on my watch. [chuckles] But we minimize the background calls to the other parties that we're integrating with. And then, we reduce the payload of data that we're sending on each request. And each of those were like, we had to think about things and tweak and poke, but again it's uniform. So mobile web has that now, desktop web has that now. Android, iOS, they all just inherited it sort of that just happened one day without a deploy or release, without a release of either of the native mobile apps. We did deploy to the web to make that happen, but that's easy. I can do that a bunch of times a day. One last thing I want to share as we're on this topic of trade-offs and levers, there was a really great conference talk that I watched recently, which was Ryan Florence of remix.run also React Router fame if you're familiar with him from that. But he was talking about the most recent version of Remix, which is their meta framework on top of React. But they've done some really interesting stuff around processing data, fetching data, when and how to sequence that. And again, that thing that I talked about of nine different loading spinners on the screen, Remix is taking a very different approach but is targeting that same thing of like, that's not great for user experience. Cumulative layout shift being the actual number that you can monitor for this. But in that talk, there are features that they've added to Remix as a framework where you can just decide, like, do we wait for this or do we not? Do we make sure we have all of the data, or do we say, you know what? Actually, this is going to be below the fold. So it's okay to defer loading this until after we send down the first payload. And then we'll kick in, and we'll do it from the client-side. But it's this wonderful feature of the framework that they're adding in where there's basically just a keyword that you can add to sort of toggle that behavior. And again, it's this idea of like trade-offs. Are we okay with more layout shift, or are we okay with more waiting? Which is it that we're going to optimize for? And I really love that idea of putting that power very simply in the hands of the developers to make those trade-off decisions and optimize over time for what's important. So we'll share a link to that talk in the show notes as well. But it was very much in the same space of like, how do I have the power to decide and to change my mind over time? That's what I want. But yeah, with that, I think that's enough of me updating on the mobile app. I'll continue to share as new things happen. But again, I'm at this point very happy with where we're at. So yeah, it's been fun. But yeah, what else is up in your world? STEPH: I have a dear Gerrit message that I wrote earlier, so I want to share that with you. Gerrit is the system that we're using for when we push up code changes that then manages very similar in the competitive space of like GitHub and GitLab, and Bitbucket. And so the team that I'm working with we are using Gerrit. And Gerrit and I, you know, we get along for the most part. We've managed to have a working relationship. [chuckles] But this week, I wrote my dear Gerrit letter is that I really miss being able to tell a story with my commit messages. That is the biggest pain that I'm feeling right now. So for anyone that's less familiar or if you already are familiar with Gerrit, each change that Gerrit shows represents a single commit that's under review. And each change is identified by a Change-Id. So the basic concept of Gerrit is that you only have one commit per review. So if you were to translate that to GitHub terminology, every pull request is only going to have one commit, and so you really can't push up multiple. And so, where that has been causing me the most pain is I miss being able to tell a story. So like even simple stories that are like, hey, I removed something that's not used. I love separating that type of stuff into its own commit just so then people can see that as they're going through review. Now, before I merge, I'm likely to squash, and that doesn't feel important that it needs to be its own commit. That's really just for the reviewer so they can follow along for the changes. But the other one, I can slowly get over that one. Because essentially, the way I get around that is then when I do push up my code for review, is I then go through my change request, and then I just add comments. So I will highlight that line and say, "Hey, I'm removing this because it's not in use." And so, I found a workaround for that one. But the one I haven't found a workaround for is that I don't push up my local work very often because I love having lots of local, tiny, green commits so that way I can know the progress that I'm at. I know where I'm headed. Also, I have a safe space to roll back to, but then that means that I may have five or six commits that I have locally, but I haven't pushed up somewhere. And that is bothering me more and more hour by hour the more I think about it that I can't push stuff up because it makes me nervous. Because, I mean, usually, at least by the end of the day, I push everything up, so it's stored somewhere. And I don't have to worry about that work disappearing. Now I am working on a dev machine. So there is that aspect of it's technically...it's not even on my local machine. It is stored somewhere that I should still be able to access. CHRIS: What's a dev machine? The way you're saying it, it sounds like it's a virtual machine, not like a laptop. But what's a dev machine? STEPH: Good question. So the dev machine is a remote server or remote machine that then I am accessing, and then that's where I'm performing. That's where I'm writing all of my work. And then that's also kind of the benefit is everything is not local; it's controlled by the team. So then that also means that other teams, other individuals can help set up these environments for future developers. So then you have that consistency across everyone's working with the same Rails version, or gems, or has access to the same tools. So in that sense, my work isn't just on my laptop because then that would really worry me because then I've got nowhere...it's not backed up anywhere. So at least it is somewhere it's being stored that then could be accessed by someone. So actually, now, as I'm talking this through, that does help alleviate my concern about this a bit. [laughs] But I still miss it; I still miss being able to just push up my work and then have multiple commits. And I looked into it because I was like, well, maybe I'm misunderstanding something about Gerrit, and there's a way around this. And that's still always a chance. But from the research that I've done, it doesn't seem to be. And there are actually two very fiery takes that I saw that I have to share because they made me laugh. When I was Googling, the question of like, "Can I push up multiple commits to one single Gerrit CR? Or is there just a way to, like, can I have this concept of like a branch and then I have many commits, but then I turn it into one CR? Whatever the world would give me. What do they have? [laughs] I'm laughing just looking at this now. One of the responses was, have you tried squashing your commits into one commit? And I was like, [laughs] "Yeah, that's not what I had in mind, but sure." And then the other one, this is the more fiery take. They were very defensive about Gerrit, and they wrote that "People who don't like Gerrit usually just hack shit together. They cut corners and love squashing commits or throwing away history. And those people hate Gerrit. Developers who care love it. It's definitely possible and easy to produce agile software." And I just...that made me laugh. I was like, cool, I'm a developer that cuts corners and loves squashing commits. [laughs] CHRIS: So you don't care is what that take says. STEPH: I'm a developer who does not care. CHRIS: You know, Steph, I've worked with you for a while. And I've been looking for the opportunity to have this hard conversation with you. But I just wish you cared a little more about the software that you're writing, about the people that you're working with, about the commits that you're authoring. I just see it in every facet of your work. You just don't care. To be very clear for anyone listening at home, that is the deepest of sarcasm that I can make. Steph cares so very much. It's one of the things that I really enjoy about you. STEPH: I mean, we had the episode about toxic traits. This would have been the perfect time to confront me about my lack of caring about software and the processes that we have. So winding down on that saga, it seems to be the answer is no, friend; I cannot push up multiple commits. Oh, I tried to hack it. I am someone that tries to hack shit together because I tried to get around it just to see what would happen. [laughs] Because the docs had suggested that each change is identified by a Change-Id. And I was like, hmm, so what if there were two commits that had the same Change-Id, would Gerrit treat those as patch sets? Because right now, when you push up a change, you can see all the different patch sets, so that's nice. So that's a nice feature of Gerrit as you can see the history of, like, someone pushed up this change. They took in some feedback. They pushed up a new change. And so that history is there for each push that someone has provided. And I wondered maybe if they had the same Change-Id that then the patch sets would show the first commit and then the second commit. And so I manually altered the commits two of them to reference the same Change-Id. And I have to say, Gerrit was on to me because they gave me a very nice error message that said, "Same Change-Id and multiple changes. Squash the commits with the same Change-Ids or ensure Change-Ids are unique for each commit. And I thought, dang, Gerrit, you saw me coming. [laughs] So that didn't work either. I'm still in a world of where I now wait. I wait until I'm ready for someone to review stuff, and I have to squash everything, and then I go comment on my CRs to help out reviewers. CHRIS: I really like the emotional backdrop that you provided here where you're spending a minute; you're like, you know what? Maybe it's me. And there's the classic Seymour Skinner principle from The Simpsons. Am I out of touch? No, it's the children who are wrong. [laughs] And I liked that you took us on a whole tour of that. You're like, maybe it's me. I'll maybe read up. Nope, nope. So yeah, that's rough. There's a really interesting thing of tools constraining you. And then sometimes being like, I'm just going to yield control and back away and accept this thing that doesn't feel right to me. Like, Prettier does a bunch of stuff that I really don't like. It shapes code in a way, and I'm just like, no, that's not...nope, you know what? I've chosen to never care about this again. And there's so much utility in that choice. And so I've had that work out really well. Like with Prettier, that's a great example whereby yielding control over to this tool and just saying, you know what? Whatever you produce, that is our format; I don't care. And we're not going to talk about it, and that's that. That's been really useful for myself and for the teams that I'm on to just all kind of adopt that mindset and be like, yeah, no, it may not be what I would choose but whatever. And then we have nice formatted code; it's great. It happens automatically, love it. But then there are those times where I'm like; I tried to do that because I've had success with that mindset of being like, I know my natural thing is to try and micromanage and control every little bit of this code. But remember that time where it worked out really well for me to be like, I don't care, I'm just going to not care about this thing? And I try to not care about some stuff, which it sounds like that's what you're doing right here. [laughs] And you're like, I tried to not care, but I care. I care so much. And now you're in that [chuckles] complicated space. So I feel for you, Steph. I'm sorry you're in that complicated space of caring so much and not being able to turn that off [laughs] nor configure the software to do the thing you want. STEPH: I appreciate it. I should also share that the team that I'm working with they also don't love this. Like, they don't love Gerrit. So when I shared in the Slack channel my dear Gerrit message, they're both like, "Yeah, we feel you. [laughs] Like, we're in the same spot," which was also helpful because I just wanted to validate like, this is the pain I'm feeling. Is someone else doing something clever or different that I just don't know about? And so that was very helpful for them to say, "Nope, we feel you. We're in the same spot. And this is just the state that we're in." I think they have started transitioning some other repos over to GitLab and have several repos in Gitlab, but this one is still currently using Gerrit. So they very much commiserate with some of the things that I'm feeling and understand. And this does feel like one of those areas where I do care deeply. And frankly, this is one of those spaces that I do care about, but it's also like, I can work around it. There are some reasonable things that I can do, and it's fine as we just talked through. Like, the fact that my commits are not just locally on my machine already makes me feel better now that I've really processed that. So there are lower risks. It is more of just like a workflow. It's just, you know, it's crushing my work vibe. CHRIS: Harshing your buzz. STEPH: In the great words of Queen Elsa, I gotta let it go. This is the thing I'm letting go. So that's kind of what's going on in my world. What else is going on in your world? CHRIS: Well, first and foremost, fantastic reference and segue. I really liked that. But yeah, let's see, [laughs] what else is going on in my world? We had an interesting thing happen last week. So we had an outage on the platform last week. And then we had an incident review today, so a formal sort of post-mortem incident review. There are a couple of different names that folks have given to these. But this is a practice that we want to build within our engineering culture is when stuff goes wrong, we want to make sure that we have meaningful conversations around to try to address the root causes. Ideally, blameless is a word that gets used often in this context. And I've heard folks sort of take either side of that. Like, it's critical that it's blameless so that it doesn't feel like it's an attack. But also, like, I don't know, if one person did something, we should say that. So finding that gentle middle ground of having honest, real conversations but in a context of safety. Like, we're all going to make mistakes. We're all going to ship bugs; let's be clear about that. And so it's okay to sort of...anyway, that's about the process. We had an outage. The specific outage was that we have introduced a new process. This is a Sidekiq process to work off a specific queue. So we wanted that to have discrete treatment. That had been running, and then it stopped running; we still don't know why. So we never got to the root-root cause. Well, we know what the mechanism was, which was the dyno count for that process was at zero. And so, eventually, we found a bunch of jobs backed up in the Sidekiq admin. We're like, that's weird. And then, we went over to Heroku's configuration dashboard. And we saw, huh, that's weird. There are zero dynos processing this. That wasn't true yesterday. But unfortunately, Heroku doesn't log or have an audit trail around changes to those process counts. It's just not available. So that's unfortunate. And then the actual question of like, how did this happen? It probably had to be someone on the team. So there is like, someone did a thing. But that is almost immaterial because, again, people are going to do things, bugs will get shipped, et cetera. So the conversation very quickly turned to observability and understanding. I think we've done a pretty good job of instrumenting error reporting and being quite responsive to that, making sure the signal-to-noise ratio is very actionable. So if we see a bug or a Sentry alert come through, we're able to triage that pretty quickly, act on it where it is a real bug, understand where it's a bit of noise in the system, that sort of thing. But in this case, there were no errors. There was no Sentry. There was nothing; there was the absence of something. And so it was this really interesting case of that's where observability, I think, can really come in and help. So the idea of what can we do here? Well, we can monitor the count of jobs backed up in Sidekiq queue. That's one option. We could do some threshold alerting around the throughput of processed events coming from this other backend. There are a bunch of different ways, but it basically pushed us in the direction of doubling down and reinforcing the foundation of our observability within the platform. So we're just kicking that mini-project off now, but it is something we're like, yeah, we feel like we could add some here. In particular, we recently added Datadog to the stack. So we now have Datadog to aggregate our logs and ideally do some metric analysis, those sort of things, build some dashboards, et cetera. I haven't explored Datadog much thus far. But my sense is they've got the whiz-bang things that we need here. But yeah, it was an interesting outage. That wasn't fun. The incident conversation was actually a good conversation as a team. And then the outcome of like, how do we double down on observability? I'm actually quite excited for. STEPH: This is a fun moment for me because I have either joined teams that didn't have Datadog or have any of that sort of observability built into their system or that sort of dashboard that people go to. Or I've joined teams, and they already have it, and then nobody or people rarely look at it. And so I'm always intrigued between like what's that catalyst that then sparked a team to then go ahead and add this? And so I'm excited to hear you're in that moment of like, we need more observability. How do we go about this? And as soon as you said Datadog, I was like, yeah, that sounds nice because then it sounds like a place that you can check on to make sure that everything is still running. But then there's still also that manual process where I'm presuming unless there's something else you have in mind. There's still that manual process of someone has to check the dashboard; someone then has to understand if there's no count, no squiggly lines, that's a bad thing and to raise a concern. So I'm intrigued with my own initial reaction of, like, yeah, that sounds great. But now I'm also thinking about it still adds a lot of...the responsibility is still on a human to think of this thing and to go check it. Versus if there's something that gets sent to someone to alert you and say like, "Hey, this queue hasn't been processed in 48 hours. There may be a concern that actually feels nicer." It feels safer. CHRIS: Oh yeah, definitely. I think observability is this category of tools and workflows and whatnot. But I think what you're describing of proactive alerting that's the ideal. And so it would be wonderful if I never had to look at any of these tools ever. And I just knew if I got, let's say, it's PagerDuty connected up whatever, and I got a push notification from PagerDuty saying, "Hey, go look at this thing." That's all I ever need to think about. It's like, well, I haven't gotten a PagerDuty in a while, so everything must be fine, and having a deep trust in that. Similar to like, if we have a great test suite and it's green, I feel confident deploying the sort of absence of an alert being the thing that I can trust. But right now, we're early enough in this journey that I think what we need to do is stand up a bunch of these different graphs and charts and metric analysis and aggregations and whatnot, and then start to squint at it for a while and be like, which of these would I be really concerned if it started to wibble? And then you can figure the alerting around said wibble rate. And that's the dream. That's where we want to get to, but I think we've got to crawl, walk, run on this. So it'll be an adventure. This is very much the like; we're starting a thing. I'll tell you about it more when we've done it. But what you're describing is exactly what we want to get to. STEPH: I love wibble rate. That's my new measurement I'm going to start using for everything. It's funny, as you're bringing this up, it's making me think about the past week that Joël Quenneville and I have had with our client work. Because a somewhat similar situation came up in regards where something happened, and something was broken. And it seemed it was hard to define exactly what moment caused that to break and what was going on. But it had a big impact on the team because it essentially meant none of the bills were going through. And so that's a big situation when you got 100-plus people that are pushing up code and expecting some of the build processes to run. But it was one of those that the more we dug into it, the more it seemed very rare that it would happen. So, in this case, as a sort of a juxtaposition to your scenario, we actually took the opposite approach of where we're like; this is rare. But we did load up a lot of contexts. Actually, I was thinking back to the advice that you gave me in a previous episode where I was talking about at what point do you dig in versus try to stay at surface level? And this was one of those, like, we've spent a couple of days on getting context for this and understanding. So it felt really important and worthwhile to then invest a little bit more time to then document it. But then we still went with the simplest approach of like, this is weird. It shouldn't happen again. We think we understand it but then let's add a little bit of documentation or wiki page around like, hey, if you do run into this, here are some steps that will fix everything. And then, if you need to use this, let somebody know because this is so odd it shouldn't happen. So we took that approach in this case where we didn't increase the observability. It was more like we provided a fire extinguisher very close to the location in case it happens. And so that way, it's there should the need arise, but we're hoping it just never gets used. We're also in the process of changing how a lot of that logic works. So we didn't really want to optimize for observability into a system that is actively being changed because it should look very different in upcoming months. But overall, I love the conversations that you bring about observability, and I'm excited to hear about what wibble rates you decide to add to your Datadog dashboard. CHRIS: There's a delicate art and science to the selection of the wibble rates. So I will certainly report back as we get into that work. But with that, shall we wrap up? STEPH: Let's wrap up. CHRIS: The show notes for this episode can be found at bikeshed.fm. STEPH: This show is produced and edited by Mandy Moore. CHRIS: If you enjoyed listening, one really easy way to support the show is to leave us a quick rating or even a review on iTunes, as it really helps other folks find the show. STEPH: If you have any feedback for this or any of our other episodes, you can reach us at @_bikeshed or reach me on Twitter @SViccari. CHRIS: And I'm @christoomey. STEPH: Or you can reach us at hosts@bikeshed.fm via email. CHRIS: Thanks so much for listening to The Bike Shed, and we'll see you next week. ALL: Byeeeeeeee!!!!!!!! ANNOUNCER: This podcast was brought to you by thoughtbot. thoughtbot is your expert design and development partner. Let's make your product and team a success.
In this Coffee Talk Aleksandra Desmurs-Linczewska (https://www.callstack.com/team/aleksandra-desmurs-linczewska) and Łukasz Chludziński (https://www.callstack.com/team/lukasz-chludzinski) provide a lot of ideas for staying up to date with the community news. They discuss the most valuable resources such as newsletters, top Twitter accounts, blogs, podcasts, conferences, GitHub and release notes: Newsletters: The React Native Newsletter, Tyler's (ui.dev) newsletter, JavaScript Weekly, Cassidy Williams's newsletter Twitter accounts: official React and React Native accounts Callstack, Remix, Next, Vercel accounts of people who are well-known in the community: Angie Jones (@techgirl1908), Sara Vieira (@NikkitaFTW), Kadi Kraman (@kadikraman), Evan Bacon (@Baconbrix), Dan Abramov (@dan_abramov), Lorenzo Sciandra (@Kelset), Rick Hanloni (@rickhanlonii), Ryan Cavanaugh (@SeaRyanC), Cassidy Williams (@cassidoo), Michal Pierzchala (@thymikee), Wes Bos (@wesbos), Jamon Holmgren (@jamonholmgren), Kent C Dodds (@kentcdodds), Michael Jackson (@mjackson), Ryan Florence (@ryanflorence), Sebastien Lorber (@sebastienlorber) Conferences: React Native EU https://hubs.li/Q01bt5WQ0 React Summit https://reactsummit.com/ Chain React https://cr.infinite.red/ Podcasts: The React Native Show https://hubs.li/Q01bt7gK0 React Native Radio https://reactnativeradio.com/ DevSpresso JS News https://bit.ly/3LnLYmC YouTube channels: Ben Awad https://www.youtube.com/c/BenAwad97 William Candilion https://www.youtube.com/c/wcandillon Fireship.io https://www.youtube.com/c/Fireship The overview of resources will come in handy for every React Native developer regardless of whether you have much experience or you are new to the React Native world.
Voltamos! 🎉Chegou a edição 411 da BrazilJS Weekly, em podcast!Depois de merecidos dias de férias, estamos de volta com a BrazilJS Weekly.Enquanto organizamos as coisas por aqui, a Weekly ficará disponível apenas no formato newsletter e post no site.Nessa semana iniciamos com mais um bug crítico no Safari. O bug em questão é no IndexedDB do Safari 15 e permite que qualquer site possa saber a atividade de navegação recente e atual de um visitante 😳Ryan Florence, criador do framework Remix, fez uma análise comparativa muito legal entre Next.js e Remix. Vale a pena conferir para aprender sobre as duas tecnologias.A Microsoft está adquirindo a Activision Blizzard (Call of Duty, World of Warcraft, Diablo) em um acordo que deve avaliar a Activision em US$ 68,7 bilhões. Get full access to BrazilJS at www.braziljs.org/subscribe
Joining us this week is Michael Jackson, creator of unpkg, a CDN for all things NPM, as well as co-creator of react router, and co-founder of react training.He has now created, alongside his long time cohort Ryan Florence, Remix a a full stack react framework built on modern web standards.
Modern web development has given us a cornucopia of powerful abstractions. But as we've moved to higher levels of abstraction Ryan has noticed that we are reinventing the wheel in places, especially with what the browser provides by default. Remix aims to solve this problem. Remix is trying today's benefits of a highly dynamic page, but still have that same feeling of simplicity that we had with PHP. The whole point of Remix is to emulate what the browser does so that you don't need those full page reloads, but programmers get to just develop with the same mental model as if there was no JavaScript on the pageAs you use Remix what ends up happening is that you accidentally become a better web developer as become a lot more familiar with the browser's abilities.HomeworkSpend an hour or two reading the MDN docs on HTTPResourcesRyan Florence: Embularactymerbone JSConf2014Guest: Ryan FlorenceTwitter: @ryanflorenceGitHub: @ryanflorenceWebsite: ryanflorence.comHost: Kent C. DoddsWebsite: kentcdodds.comTwitter: @kentcdoddsGitHub: @kentcdoddsYouTube: Kent C. DoddsEpic React: epicreact.dev
https://youtube.com/c/RyanFlorence Hey friends So I was watching a live stream from Ryan Florence last night while I was putting my kids to bed They were falling asleep and I was in the room to make sure that they didn't go all whacko and stuff while they're trying to fall asleep. And so I was just watching Ryan codeps some stuff. You should check it out. Actually Ryan has gotten some really good live streams recently, especially if you're interested in remix and stuff. And and actually sometimes I'll just watch it during the day. I'll just have it on in a different tab while I'm working and if I hear something that sounds interesting I can go over there. So, it's kind of fun and interesting.And and yeah it's kind of fun to be on this side of the live streaming stuff at home but anyway one thing that I noticed that Ryan doesn't and I've seen him do this any time that I've seen him code not just in this livestream. So he's been doing this for a while as far as I know. But he has this document open in his editor that's just like marked down format stuff. That outlines exactly what he plans on doing for that coding session, or at least he kind of keeps notes of the things that he's still needs to do. That's not exactly pseudo code, but like, you know, create a user then save that users.Session in the database and then, you know, whatever else. And it I I I like this approach for me. I typically just have in my mind this idea of what I want to do and then I just go scramble around and and do the activities until those things are all finished but it's not as directed and I feel like I could definitely improve in this way and and get a little bit better at making sure that I'm accomplishing some specific tasks and and it also at the end of the day, you feel like you got a lot more done. I do have a notepad that I,Where I write down all the things that I'm gonna do for the day but normally that includes stuff outside of coding and then I've got like work on this work on the website or whatever. And it would be cool to get a little more granular especially when you're working on new features and and stuff like that. So I just thought that would be an interesting tip to share so next time you start working on a particular feature go ahead and just open up a text file and write out kind of outline the different tasks that you need to get accomplished and every couple minutes or so review that. And see what you've finished and and what you need to work on next kind of help direct your your thought process and and implementation so that you get things done. And of course, you can always do it like test-driven development style if you want to but some of these things would be a little hard to test drive. So in those situations having a list can be really helpful. Anyway, I'm gonna give this a shot some time and hope you do too and I hope it's helpful to you. Have a good day.
Live stream link: https://youtu.be/4dOAFJUOi-s Hey friends. So today is an important day for a friend of mine. Our friends of mine Michael Jackson and Ryan Florence are releasing the beta 1.0 release of remix. And if you've been watching my Twitter or just kind of me in general, I've been really excited about remix. I've been reading writing can't seedance.com to remix and it's just been a total joy. I am super excited about the potential that remakes has and really excited about the approach that they're taking and.From a progressive web app standpoint whatever So if you're listening to this on the same day that I'm recording it then don't miss their live stream that's happening later today because it's going to be great. I'm certain of it like they haven't given me a preview or anything but I'm sure it's going to be great. And I really encourage you to give some serious thought to remix as an option for the apps that you build in the future because it's phenomenal. The their approach to focusing on the foundations of the web and the and the features like we spend so much time. Building JavaScript libraries and and abstractions for what is already built into the web platform just because we don't want to use it the way that the web platform has it for whatever reason but remix kind of brings it all back to those fundamentals and what that means is that the knowledge that you gain as you work with Remix is very transferable. It's all based on the the platform that we've had for decades and it's much more powerful than just our own little abstractions that that we try to build.So anyway, it is really incredible. I'm really excited about remix and I am yeah don't miss their live stream about it today. I will put a link in the transcript here but you can just go on YouTube and search for remix JS and you'll find their channel and you can watch the live stream today. Yeah. I think that's all that. I I don't want to dive too deep into things because I don't have enough time in this three-minute podcast, but yeah, I have never felt. So excited about a framework before or like a meta framework like remix. It is phenomenal. So anyway, I'll stop using all these fluffy words to describe it. And you'll see more about remix coming from me, absolutely. So look forward to that. Hope you have a great day and I'll see you around.
So I've been working with Remax for a little while and I'm still trying to learn enough about it that I can articulate my feelings on it really well because I know a lot of people are comparing it to next year yes and and likewise should I pay for something when there's a free option? Trust me, this is gonna be huge and I'm super excited for when they do things to make it so people can try it out a little bit more. But as I was working with it, I,Am or just over the last few months that I've been working with it it embraces browser-level caching and CDN caching so naturally that this becomes really nice. So when we're talking about like resources that can be cached heavily regardless of the user even with the user honestly like with user data one of the nice things about that sort of caching strategy is it means that?You can not be lazy but be more ambitious with the sorts of performance things that you're doing on the server. And so like, for example, I had I'm able to have my blogs be built and calculated or like compiled from MDX on the fly because I know that the like things are going to be cash and no users actually going to have to wait for the time that it takes to compile on the flying. And yeah, so it's really,Awesome that way like we don't have to worry about building ahead of time we can update the blog post and then have it immediately update the cache and and and no users have to wait or anything. There's actually a really great video that Ryan Florence put together on the remix channel on YouTube talking about caching and you should definitely go look that up but being able to just say I'm gonna do this performance intensive thing or maybe not even like perform or like computationally expensive butWe have to like hit the network and go get this and whatever, I don't care how long it takes because none of my users is gonna feel that I'm going to hit it first as part of my build problem or part of my deployment process or my cash invalidation strategy and so I'll hit it first. I'll make sure that the cash is updated before any users even and know that the cash risk changed. I'm really looking forward to being able to actually demo some of this stuff. Remix is amazing. I can't wait for you all to see this stuff that I'm thinking about doing with my web. Site with it. It's gonna be awesome. Okay, hope that's useful in interesting have a wonderful day.
Hey friends I've just been thinking a lot about remix recently, so if you haven't heard of remix this that's what I want to tell you about just to try and convince you to go give it a serious look so remakes is a react framework that is both server side and client side it's a lot of people compare it to next but it's pretty fundamentally different from the way that next operates it is file system based routing though, there is a imperative API that you can use to declare routes programming programmatically, but what? Makes remix really special is it's embracing of the web platform and not just brand new features though, it does leverage newer features and things and take advantage of those when they're available but also like age-old features like http caching very heavily and gives you just really nice APIs for that sort of thing and I'm like resource preloading and prefetching a lot of really really cool things. Frankly that we reached for or we were excited about suspense for so like react suspense we're trying to optimize for loading resources and preloading them and whatever remix has like solves pretty much all the same problems and it's built in and it works for the first initial load where suspense can't help you with any of that stuff you have to get suspense into the browser before it can do anything to help you so yeah anyway, I'm just super impressed by what remix has to offer and what's cool is I've talked with Ryan Florence about this. Right so remix has created by Ryan Florence and Michael Jackson's Jackson the creator creators of Reactor and Ryan has told me that their plan is to put a lot of what is in remakes into react router and there will be plenty of stuff that's in remix to like all the build and the file system stuff and whatever but a lot of the really cool features that I I'm personally really enjoying will be a part of React router and so I think that that's gonna be pretty legit we'll look forward to. An official release of reactive router V6, you know nested routing oh it's awesome yeah lots of really cool things coming to react around her but in general remix will wire things together for us really nicely to make some really fantastic user experiences and just with a really great developer experience so I would encourage you to take a look at remix maybe you don't have to buy a license right away but like go to check out the YouTube channel and watch a couple videos, it's awesome take care. Yeah.
Hey there friend so today I wanted to talk about something that I've been thinking about a little bit and it is client side routing. So Ryan Florence actually tweeted about this. I think like a year ago or something and and I talked about it recently on a podcast that I was on I think Dev mode FM or something. But yeah his tweet was basically like I kind of feel like client side routing is a mistake and we're better off with like actually going to get the document on it, you know, full-page refresh basically on every page. AndI I've talked with Ryan Florence about this quite a bit. And here are just some thoughts that I have about it. And I kind of agree with him sort of. So basically what what I'm thinking is that with client side routing by default or let's take a step back. So like before client side routing goes the thing you'd find a link on the page you'd click on that link and then you would see like the browser would give you some indication that something's happening. So you'd get the spinner at the top where the favicon is and you'd get.Like some information on the bottom typically telling you that you're waiting on a particular resource and then while that's happening you actually still get to see the page that you were on before. So you still may be able to make use of that information or something or notice something or whatever. And then when we move to client side routing then pretty often what happens is you click on the link and you immediately navigate to the page that you're going to and then you see a bunch of spinners all over the place. Or even worse you don't see spinners andYou just you land on the page and then things pop into place as they become available and that typically will happen when the developer who worked on the page was on a really fast internet connection just didn't really consider what a loading experience would be like. And in fact, very very often our designers don't design loading experiences. And so we have to be explicit about it. And so what's interesting is that the the default behavior gives you all the right affordances for the loading state. And when you go to client side routing,You have to opt into giving those affordances so there's some indication that a loading state is showing it's something is loading and you have to worry about when things load and when things pop into place and stuff and so yeah, it's it's a little bit of a step back maybe you just have to be a lot more intentional and so maybe the default of having it do a full page refresh essentially is an entirely a bad one from that perspective and then when you go to client side routing, you just really have to think about those things. So anyway, just some thoughts hopefully,
Hello there. Friends, it is a little late for me. I was hanging out with the family today, but I did want to get my three minute podcast in for today and so I'm doing it while I am changing laundry. So what I wanted to talk about today was just a little bit about reactor server components and that thing that everybody's super excited about I think we have good reason to be excited. It I'm not going to explain exactly what it is. So you have to go Google it and and get an idea there's a video with.Stuff. But yeah, my initial reaction to it was pretty met just like huh. And what's interesting is that like this is probably not not quite as big as hooks at all but it is like some progress on the whole solving the problem that suspense and concurrent mode is supposed to solve or at least helping solve some of those problems. And so it is a big deal and there's a lot of cool things that it does. But the reason that I was so just like,Not impressed or not super interested. It isn't because it's not impressive and it's not like great in whatever but because I discovered solutions to most of these problems that it's intended to solve just a few months ago when I started using Remix and a remix if you haven't heard is Ryan Florence and Michael Jackson's business that they're working on this this paid software project. That's a framework for react and it is phenomenal. Seriously, it is so good. I'm really happy with it and it's currently like pre-beta like Alpha stage software so you know, I'm actually paying to as like a developer preview sort of thing to to use this and and learn about it, but anyway, yeah, it just solves all these these problems so if you haven't given a remix of solid look yet and then I would advise that you. Do you don't have to become a developer preview, you know paying subscriber anything. It is not software that you should ship to production and necessarily but it is going to really shake things up I think. So yeah give remix a look it solves many of the problems that react server components are going to solve and it does so in a way that I just think is remarkable really good stuff. And yeah, I feel like there's something else I was going to say about that, but that's that's it. That's my,Three minutes. Hope you're having an awesome day and we'll catch you later. Bye.
Hello friends it is January 9th, this is a Saturday and I guess I'm recording this on a Saturday, okay, so um, I wanted to talk about today type script and why I am starting to think that I'm gonna be doing my material and typescription stuff so first of all, I started using TypeScript right toward the end of my time at PayPal we had been using flow for a long time and and I liked it it was okay, but it was very clear that TypeScript was gonna be the winner of this game and so I decided let's switch over to type. Script so I made PayPal scripts completely. TypeScript supporting project and everything and and then the template I made default to type script and everything so like I was all in and I type script the PayPal or PP React. React component library that I was working on was completely in TypeScript and then I went full-time educator and I stopped using TypeScript and the reason that I have never used or I had never used TypeScript in my open source or in my instructional material is because I didn't wantIt to be a barrier for people So with open source I didn't want it to be the sort of thing that people couldn't contribute to open source because they didn't know TypeScript. And for my my educational content, I didn't want to make it so that people couldn't enjoy my educational content because they couldn't they didn't know type script. And so like it would just drastically limit the number of people who could benefit. So a few things have changed for one for the whole time with my open source stuff. I always use that as an excuse like no, I don't want to be a barrier for people butLike I knew that was bogus because anybody who's going to contribute to my project also needs to write some tests and that's basically what TypeScript is So they are going to need to learn how to write the tests and so yeah, it ends up being six is anyway, like if they don't know how to write test they're going to commit it and will help them write the test that'll be the same with text script. And for my educational content, I talked with Ryan Florence about this and he told me that a long time ago, they went full on TypeScript and a big reason was because a lot of them were like a lot of the people they were teaching were already using TypeScript and also it like you don't have. To go full on TypeScript on the educational material so like the people who don't know TypeScript they don't have to add types if you configure TypeScript correctly and then those of you or those people who are using TypeScript regularly and know it they'll get the editor hints and everything and and even if you're not using TypeScript yourself, if you're consuming an API that exposes types you get editor hints and everything's really nice. So it ends up being a better experience for everybody and so that's why I'm gonna be switching completely over to TypeScript and I'll probably have something there to help people who don't know TypeScript yet as well. So anyway, hope you have aSplendid day. Bye.
Ryan's background as a musician taught him many lessons that would eventually apply to his current career. As a musician, he learned about composition, sales, and even programming so he could build his band a website.Ryan also had an actual sales job where he learned that you can do something so well that you'll be unable to do it anymore. In sales that meant being good at generating leads which lead to a lot of clients which lead to ceasing to generate leads. But, that eventually lead to you have no clients because you let your stream of leads dry up.It's easy to become so narrowly focused on what's in front of you that you get blindsided by what's coming down the pipeline 6 months from now.React changed the front-end landscape. We went from having a mutation-based approach to a functional approach. But, React has made it so easy to write code that we are forgetting our fundamentals. React websites are becoming bloated.Remix's goal is to bring back the Web 1.0 ways of doing things that lead to lean, performant websites. It's Web 1.0 that is progressively enhanced with React and React Router.“The technology that sticks, and wins, is the technology that can sneak its way into your existing stack because no one wants to rewrite!” Remix is built on this philosophy, allowing you to incrementally incorporate Remix into your existing application.—-ResourcesMichael Jackson's YouTube video on component compositionRemixRyan FlorenceTwitterWebsiteJoel HooksTwitterWebsite
Hello Everyone! Today, I had the pleasure of interviewing Ryan Florence aka Flizzle fellow Christian, husband, father and founder/owner of EFiT! In this conversation we talk about the lessons he learned from forgiving his father and getting out of the victim mentality. This is a conversation that should not be missed! Ryan "Flizzle" Florence: Facebook: https://www.facebook.com/IAMRyanFlo Instagram: https://www.instagram.com/flizzle/ EFiT Instagram: https://www.instagram.com/efit.lifestyle/ Going With the Flos Instagram: https://www.instagram.com/going_withtheflos/ Show Notes: I mentioned the previous episode where the guest spoke about her father: "Forgiving Those Who Have Passed On with Katia Simpson" I mentioned 2 verses "And we know that all things work together for good to those who love God, to those who are the called according to His purpose." Romans 8:28 New King James Version (NKJV)& "For the Lord God is a sun and shield; The Lord will give grace and glory; No good thing will He withhold From those who walk uprightly." Psalm 84:11 NKJV I spoke about Jacob and his hip (Genesis 32:22-32) Ryan mentioned renewing your mind, this came from: "And do not be conformed to this world, but be transformed by the renewing of your mind, that you may prove what is that good and acceptable and perfect will of God." Romans 12:2 NKJV and "for all have sinned and fall short of the glory of God," Romans 3:23 NKJV Ryan also mentioned the peace that surpasses all understanding which comes from: "and the peace of God, which surpasses all understanding, will guard your hearts and minds through Christ Jesus." Philippians 4:7 NKJV I mentioned such a time as this, this came from: "For if you remain completely silent at this time, relief and deliverance will arise for the Jews from another place, but you and your father's house will perish. Yet who knows whether you have come to the kingdom for such a time as this?”" Esther 4:14 NKJV My Social Media: Instagram: https://www.instagram.com/dwaynestaten/ Leave me a Voice Message! https://anchor.fm/dwayne-staten5/message Music: Moody by Jay Someday https://soundcloud.com/jaysomeday Creative Commons — Attribution 3.0 Unported — CC BY 3.0 Free Download / Stream: https://bit.ly/_moody Music promoted by Audio Library https://youtu.be/WJHTZpx9d2o
Fredrik chats with Sara Vieira about The Opinionated Guide to React - the guide to making all the choices React doesn’t make for you (plus hooks). We talk about the magic train ride from Prague which led to the creation of the book, what the writing and publication process was like, and of course about the surprising and horrific code Sara uses to create the final book files. We also discuss MC:ing conferences, what happens when world events explode all over your writing, finding your voice, and making the most of your Grammarly plan. Thank you Cloudnet for sponsoring our VPS! Comments, questions or tips? We are @kodsnack, @tobiashieta, @oferlund and @bjoreman on Twitter, have a page on Facebook and can be emailed at info@kodsnack.se if you want to write longer. We read everything we receive. If you enjoy Kodsnack we would love a review in iTunes! You can also support the podcast by buying us a coffee (or two!) through Ko-fi. Links Sara Sara on Github Entertaining talk about making good buttons (and more) The Opinionated Guide to React - Sara’s book Codesandbox Codepen Glitch Hooks in React Class components React state management Overmind Christian Alfoni - creator of Overmind Vue Styled components Emotion Reach router React router Preact Ryan Florence Blender Photo of girl giving a police officer flowers and being arrested The Carnation Revolution - the end of the Portugese dictatorship This is fine - the meme and plushie Grammarly Full stack fest Markdown Gatsby Puppeteer - for scraping web pages, and more Pdflib Epub Calibre Mobi files Paddle Gatsby-starter-book Prism VS code theme to Prism theme converter VAT Stripe GDPR Cheerio Product hunt Cypress useMemo Sitges Rust React Amsterdam Titles It’s like sad Spanish I make buttons Goth Glitch I finished something The stress doesn’t end On a train from Prague Also kind of European Apparently I started this on Christmas It depends Why it depends I don’t think that’s an answer Thank you for not calling it “React Best Practises” March never ended I can only write like I speak I’m not school-smart yarn generate book A very dirty Javascript function A different type of terrifying All of a sudden, nothing’s scary anymore “I think this thing has a computer” It was the worst visa
FeaturingChris on Code — Twitter, Website, GitHubchantastic — Twitter, Website, GitHubLinksMakeReactApps.com — Build real-world React projectsWes BosReact HooksScreenFlowDreamweaverNicholas Cerminara, scotch.io co-founderJamstackjwt — JSON Web TokenBuySellAds100: The Business of Remix with Ryan Florence and Michael JacksonRedwoodjsAirtableNotionTypeScriptVisual Studio CodeSponsorsInfinite RedIn over your head with a React or React Native app? Infinite Red can help.They are React Native core contributors who've been designing, building and shipping apps for over 10 years. Head to reactpodcast.infinite.red to learn more.TestCafeA node.js tool to automate end-to-end web testing.Write tests in JS or TypeScript.TestCafe works with all popular OS & browsers and takes 1 minute to setup: no WebDriver or other tools required.It's free, open source, and will help you enjoy writing end-to-end tests.Visit testcafe.io to automate your code testing — free!Black Lives MatterPlease join us in donating to the Equal Justice Initiative
Remix — a killer React framework from the creators of React routerReact router — Declarative Routing for React85: Michael Jackson on React router v6 and Empathy in Open Source on React PodcastRuby on RailsDHH — David Heinemeier Hansson, inventor or RailsTurbolinksPJAXCodeIgniterEmber routing — inspiration for nested UIMarcy Sutton75: Sunil Pai on The Future of UI Frameworks on React PodcastReact Router useLocationPending in v6.0.0-alpha.4 releaseConcurrent Mode in ReactunpkgHTTP cachingYahuda Katz — creator of emberTom Dale — creator of emberSponsorInfinite ReadIn over your head with a React or React Native app? Infinite Red can help.They're React Native core contributors who've been designing, building and shipping apps for over 10 years. Head to reactpodcast.infinite.red to learn more.Black Lives MatterPlease join us a donating to the Equal Justice Initiative
It’s another potluck! In this episode, Scott and Wes answer your questions about kids learning to code, React sub-components, why it’s so hard to scale, new frameworks, data structures, and more! LogRocket - Sponsor LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at logrocket.com/syntax. Prismic - Sponsor Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at prismic.io/syntax. Show Notes 03:11 - Q: Do you think Selenium could get replaced by Cypress in the future? 16:16 - Q: When blogging about code, you need a good way to display snippets of code in your blog post. What are good ways to do that? Should you embed something like a GitHub Gist, or setup something specific for your blog? 11:13 - Q: Do my students NEED to understand recursion to be effective JS devs? 15:41 - Q: What do you think about developing using just an iPad + keyboard + external monitor? To try this, I just moved all my environment to a VM on the cloud and configured code-server (a VSCode accessed by the web https://github.com/cdr/code-server). Works pretty well! The only problem now is that the iPad has a bad resolution on the external monitor when I’m using the browser. 22:43 - Q: I often find myself refactoring sub-components out of a component once it gets too big. This however is very tedious, especially if the sub-component is tightly coupled with the component and thus needs to take a lot of props. Do you have any suggestions? Do you just let the component grow bigger in a case like that? 26:15 - Q: [Insert Hoser related greeting here], during quarantine I’ve tried to come up with an outline for creating a goofy Pokémon app with my boys (age 8 and 5). They’re obsessed with Pokémon right now and I figure this could be a fun little group activity. I see how much they struggle focusing on some of the online instruction they have through school, and they’re a bit fatigued with “learning” right now. We tried doing a bit of scratch/scratch jr. I figured a fun-themed project could help them stay engaged with learning, but I’m struggling with where to start. How would you go about creating a course/activities (like Wes’ Javascript 30 course) specifically designed for primary/elementary aged kids? 30:52 - Q: How much should someone who wants to work as a web developer (starting in a junior position) know about data structures and algorithms? Should I practice algorithms and do questions before applying for jobs? 33:53 - Q: I’m working with a friend to start up a website for our YouTube channel, and we’re getting into podcasts too (not tech-related so no competition, no worries). I’m thinking about trying to host my own RSS feed for podcasts to save some bucks. Am I crazy? 36:27 - Q: Do you guys name your colors in terms of the color or the use of the color. For example, say you styled all your links to be purple. Would you name that color “purple” or “link”? 41:00 - Q: I’ve been listening to you for about a month and really dig it. I’m working on an app that will require a couple of different databases. I’ll need a database for user information, and a larger database for application data. The app does some analytics stuff, so data is critical. I’m getting lost in the world of hosted database options (mLab, Digital Ocean, etc.) and big cloud providers (AWS, Google, etc.). Could you guys talk a little bit about how you choose database hosting? Bonus question - have you ever used Auth0 or Okta for user authentication? 45:09 - Q: I’m a bit confused about using GitHub. What happens to the files that are ignored, but required for development? What’s the best practice for backing up both? I have used .env files, but not too sure how it works if it’s in the gitignore and the site is deployed via GitHub (like with Netlify). Right now I have a backup folder on my hard drive and I back up both the dev and the live versions with a timestamp, whenever I do a new ‘release’. Also, you spoke about Jetpack, and I’d be curious what’s the best way to do this with a cronjob for example. 48:50 - Q: I was laid off in early April because of COVID-19. I’ve been trying to file unemployment since then. The state unemployment office said they were launching an updated website for filing claims on Friday, April 24th. At 9:00am that day, they ran a banner saying demand has been so high that it’s affecting the process ‘despite rigorous testing.’ Why is this so hard to scale? 55:57 - Q: What is your take on all of these rails-like server side rendered React and GraphQL frameworks? Here is another one built by Michael Jackson, Ryan Florence and some others: https://twitter.com/remix_run. This of course is in addition to Redwood and Blitz. Links Prism VS Code gatsby-remark-vscode CodeSandbox vscode-textmate System76 Linux Laptop JS Refactor ScratchJr Javascript30 GraphiQL Pokedex AWS Auth0 Okta mLab Jetpack Backup Remix Redis Redwood Blitz Next.js Encarta ××× SIIIIICK ××× PIIIICKS ××× Scott: EGO battery-powered lawn gear Wes: AmazonBasics Notebook Laptop Stand Arm Mount Tray Shameless Plugs Scott: Level Up Tutorials Pro - Sign up for the year and save 25%! Wes: All Courses - Use the coupon code ‘Syntax’ for $10 off! Tweet us your tasty treats! Scott’s Instagram LevelUpTutorials Instagram Wes’ Instagram Wes’ Twitter Wes’ Facebook Scott’s Twitter Make sure to include @SyntaxFM in your tweets
ReactJS began to standardize frontend web development around 2015. The core ideas around one-way data binding, JSX, and components caused many developers to embrace React with open arms. There has been a large number of educators that have emerged to help train developers wanting to learn React. A new developer learning React has numerous questions The post React Fundamentals with Ryan Florence appeared first on Software Engineering Daily.
ReactJS began to standardize frontend web development around 2015. The core ideas around one-way data binding, JSX, and components caused many developers to embrace React with open arms. There has been a large number of educators that have emerged to help train developers wanting to learn React. A new developer learning React has numerous questions The post React Fundamentals with Ryan Florence appeared first on Software Engineering Daily.
ReactJS began to standardize frontend web development around 2015. The core ideas around one-way data binding, JSX, and components caused many developers to embrace React with open arms. There has been a large number of educators that have emerged to help train developers wanting to learn React. A new developer learning React has numerous questions The post React Fundamentals with Ryan Florence appeared first on Software Engineering Daily.
Sponsors Netlify Sentry use the code “devchat” for 2 months free on Sentry’s small plan Triplebyte offers a $1000 signing bonus CacheFly Panel Lucas Reis David Ceddia Thomas Aylott Justin Bennett Summary The panel starts by discussing if useEffect is a good API or a bad API. The problems that useEffect solves are considered. The panel agrees it is a much better abstraction where subscriptions are concerned. Suspense and data fetching is discussed, the panel considers what the react team has in store concerning data fetching. The panel discusses what it was like to be a beginner to React and how using React is not an intuitive language. The panel shares some of their mistakes with useEffect, and try to consider useEffect from a beginners perspective. The panel gives advice for using hooks. Links https://twitter.com/ryanflorence/status/1125041041063665666 Picks Lucas Reis: https://github.com/kkuchta/css-only-chat David Ceddia: https://twitter.com/kentcdodds/status/1125876615177629696 https://twitter.com/ryanflorence/status/1125041041063665666 Fun with React Hooks - Michael Jackson and Ryan Florence Thomas Aylott: The Design of Everyday Things: Revised and Expanded Edition Justin Bennett: https://dusk.now.sh/ https://developers.facebook.com/videos/2019/building-the-new-facebookcom-with-react-graphql-and-relay/
Sponsors Netlify Sentry use the code “devchat” for 2 months free on Sentry’s small plan Triplebyte offers a $1000 signing bonus CacheFly Panel Lucas Reis David Ceddia Thomas Aylott Justin Bennett Summary The panel starts by discussing if useEffect is a good API or a bad API. The problems that useEffect solves are considered. The panel agrees it is a much better abstraction where subscriptions are concerned. Suspense and data fetching is discussed, the panel considers what the react team has in store concerning data fetching. The panel discusses what it was like to be a beginner to React and how using React is not an intuitive language. The panel shares some of their mistakes with useEffect, and try to consider useEffect from a beginners perspective. The panel gives advice for using hooks. Links https://twitter.com/ryanflorence/status/1125041041063665666 Picks Lucas Reis: https://github.com/kkuchta/css-only-chat David Ceddia: https://twitter.com/kentcdodds/status/1125876615177629696 https://twitter.com/ryanflorence/status/1125041041063665666 Fun with React Hooks - Michael Jackson and Ryan Florence Thomas Aylott: The Design of Everyday Things: Revised and Expanded Edition Justin Bennett: https://dusk.now.sh/ https://developers.facebook.com/videos/2019/building-the-new-facebookcom-with-react-graphql-and-relay/
Zach and Ade respond to a couple more listener letters. Keep sending them in, y'all! The topics discussed in this one include being pregnant at your job and finding yourself unable to verbally fit in with your coworkers.Connect with us on our website!https://linktr.ee/livingcorporateTRANSCRIPTZach: What's up, y'all? It's Zach.Ade: And it's Ade.Zach: You know what? Wait a minute. Why do we always do me first? What is that about? You never go, "Hey, y'all. It's Ade," and I go, "It's Zach." Like, we always--we always do it like that. What's up with that?Ade: I don't know if that's true. I feel like I have gone first. I don't know. 'Cause I do the countdown, so I expect that you do the--Zach: Well, there you go.Ade: Yeah, I just--Zach: I don't know. I just feel like--I feel like if we're gonna dismantle patriarchy, like, we need to dismantle it at every--you know what I'm saying, every corner.Ade: I feel like you're just using that as an excuse to not go first.Zach: [laughs] Maybe it's 'cause--so when I walk around with people, like my wife, with women at my job, I open the door, and then I push for--I encourage for them to go first, and I kind of feel like it just doesn't rub me right 'cause--it rubs me wrong rather, because it's like I feel like I'm walking through the door first. Anyway, it's okay. Listen, y'all. You're listening to [inaudible]--Ade: Does anybody ever hold the door for you, Zach?Zach: You know what? My coworkers on my current project. They are--they hold the door open, and it's kind of awkward, and they go, "Yeah, that's right, Zach. I'm opening the door for you," and we laugh, and then I walk in the room. Ade: Wonderful. I was about to say I'd open the door for you.Zach: I believe that. I believe you would. I believe you would.Ade: Totally.Zach: Well, look for those listening in, you are listening to Zach and Ade on Living Corporate, and today we have--da-da-da-daaa--more listener letters. What's up?Ade: Sure do.Zach: So it's interesting. It was like--I feel like we've been asking for listener letters, and now they're coming in. Really excited about that. Please continue to send 'em in. We're gonna try to do at least two per episode, like, episodes that we do this, so--and we're trying to, like, churn through them, right, so we can get back to them, so that way y'all know that we're actually responding to y'all's notes. 'Cause y'all do be sending 'em in, and I feel bad--like, some of these we've been sitting on too long, but--[laughs] so I feel bad, so we're gonna start actually being a little bit more--I don't want to use the word aggressive--intentional, right, in getting these back to y'all. All right, well, go ahead. This first one I'm looking at, Ade--I'ma let you go ahead and ride on this one, and I may provide color commentary, but I feel like this is definitely a space that you would probably be better to speak in.Ade: I actually disagree. I think this is one that we should tag team, primarily because I have--I've never been in this dilemma before at least, so I don't know that I have the full range of context and experience, but I think it would be good to share this. Anyway, the subject of today's listener letter--it's called "Bun in the Oven." All right, let's go. It goes, "Hi, Zach and Ade. Thanks so much for this platform. I am dealing with a situation at work and I'm not certain what to do. I work in a relatively conservative area, and I'm pretty far from home. I've been in my industry for three years and in my current position for one. I'm used to working 60-80 hour weeks--whoo--at work, and I'm not alone in this. Most of my team tends to work long hours, but the pay is great and it's really rewarding work. Here's my problem - I recently discovered that I'm pregnant. I do not have a long-term partner, and I'm concerned about my ability to keep up with the pace at work and how my coworkers might react. What should I do here? Any advice welcome. Thanks again. Leah."Zach: Hm.Ade: All right.Zach: So now why do--what commentary or insight do you think I could add in this? I'm curious. What do you--how do you think I could--I could [laughs] provide--what value could I add to this conversation as a man? Like, you help me understand.Ade: I just--I feel as though, as someone who is more senior in their career, you might have more strategic ways of approaching this conversation than I might. You want to take a stab at it?Zach: Oh, okay. Yeah. So, you know, it's interesting. Of course I've been in a variety of situations. I work with folks all the time who get pregnant. I think what I've seen--I'm just gonna talk about what I've observed that I've seen go well is people just being really open about kind of what's going on if they are pregnant, utilizing their resources. So they talk to their leads, they talk to HR, they understand and, like, really explore their benefits, and then they just start making plans and saying, "Okay, well, look. You know, I'm pregnant, and this is gonna be--" "And I'm looking at my benefits so that I can go on leave. This is my work plan up 'til then." Talking, and, like, you know, just kind of being transparent with your leadership about, like, "Hey, because I'm pregnant, my work schedule may need--I need to adjust my work schedule in this way or that way." You talked about the fact that you're used to working 60-80 hour weeks. Like, those things may need to shift or change if possible, but again, I think it's--what I've seen is people who are really just open about it, because the last thing of course you want is stress. So the more things you can do to kind of destress the situation the better, and that's what I've seen--that's what I've seen work.Ade: That sounded like a lot. I don't know why you discounted yourself from the conversation and sharing your knowledge to begin with. Yeah, I just had to fact-check you right quick. Anyway... all right, so, Leah, first of all, thank you for writing in, and congratulations on this new journey on which you're about to embark. I think I would say, first and foremost, that you wrote about a couple of different things here, one that you're in a conservative area, two that you're far from home, three that you're working really, really long hours, and four that you're kind of doing this alone, and I would say that all the more reason to find your allies and your sponsors and your mentors at work and disclosing to them, as you feel comfortable, the situation you're in. Two would be that you don't concern yourself with keeping up with the pace at work. 60-80 hour weeks are great when you are not growing a whole other human being inside your body, but those are the circumstances in which you find yourself. So I don't think that it's wise to put the expectation upon yourself that you'll be able to keep up with 60-80 hour weeks. That's not even something that people who aren't pregnant want to do at a sustained pace for a very long time, let alone someone who's literally sharing resources with another human being. So don't put that pressure on yourself. Don't put that expectation on yourself. Definitely be realistic with what you can and cannot handle, and like Zach was saying earlier, start figuring out what your work plans are, what your contingencies are, and have honest conversations with your leadership about what it's gonna take from now 'til, you know, Baby Drop Day for you to continue being fulfilled and content in your career and also preparing for, again, this new part of your life that you're going to have to deal with. So Leah, the one thing that did concern me about this letter was that you--you mentioned that you were concerned about how your coworkers might react. I feel as though that is not something that should even pop up on your radar. I hope that you feel supported at work, and if you do not I think that it is--this would be the chief time to get some time on your--on the calendar with your HR person or with your allies or with your mentors and get a sense of what it means to split your time or to start removing some things from your plate, and it's OK to do that. It's OK to say, "Hey, I do not currently have the capacity for this at this time, and it's only gonna get--my plate is only gonna get fuller from henceforth, so how do we manage this in such a way to ensure I'm still having a fulfilling career and, you know, not being worked to death?" Leah, take care of yourself. Zach, is there anything else you'd like to add?Zach: You know, I think--the other piece is that you said that you're--you know, you're by yourself. Like, you're far away from home. So, you know, maybe there's an opportunity--and, again, every job is different. I know something that I was told, especially coming into the consulting space--and I don't know if you're consulting or not, but coming into consulting--I think it applies to just jobs in general, but it's like, "Hey, look, you don't get what you don't ask for," and so I wonder if there's any opportunity for you to work remotely on things, like, just for your whole working situation to change. I don't know the context of the role that you have at your job or, you know, how much of that is dependent on you being in the office, but, like, even if, like, a couple months, even before you take, you know, official leave for your baby, you could--you know, maybe there's an opportunity for you to work from home. Like, you know, there's other things. So I guess kind of going back to what I said at the beginning, which is, like, just being really transparent with the people that you trust, with your leadership, so that you can have a plan. I think that's part of it, is, like, being, like--just ask, like, you know, "What options are there for me?" I would also network within your business, right? I'm certain that there's other women at your job--well, let me not say I'm certain. Perhaps there are other--Ade: I was about to be like, "How certain are we?"Zach: "Are you certain?" But there may be other people at your job who have been pregnant and had children and had to navigate, so it's worth, like, networking and asking around as well. So that would be what I'd add, but nah, I think what you said is super spot-on. I agree. Ade: And sort of to pick up on that as well, if there are any employee resource groups at your firm, at your company, for women, I would certainly look into that. I just realized I didn't even, like, finish my train of thought with the whole mentors and et cetera, but also look into what support looks like after you give birth as well.Zach: Oh, that's a good point.Ade: Because again, you're going at this alone, so that means that you're going to have to figure out what childcare looks like, you're going to have to figure out--see, I don't even have a child, so I don't know--Zach: All the things?Ade: All the things. But postpartum care... shoot, I am ill-equipped for this conversation. But, you know, finding out what it means to be both a career woman and mom, that's a whole conversation in and of itself, a whole exploration process, and the more resources, the more conversations, then the more people you have around you who are able to support you in that exploration process, who are able to point you at the resources that you need and who are able to say, "Look, I don't know, but I am going to find out for you." That's the environment that you need--that's the support that you need, and I hope that you're gonna get that, and if you do not, I am hoping that you're able to find a space in which you can be both. And the other thing that I wanted to bring up--I read this post on Fishbowl. This just occurred to me. I read this post on Fishbowl a couple of weeks ago about this senior consultant who had just given birth and her team was already emailing her work to do, and she still has six weeks of leave left.Zach: Mm-mm. [disapprovingly]Ade: Don't ever feel pressured to take time away from your baby for your job, because your job will still be there, and should they ever find reason to fire you--and honestly, if you live in a state that doesn't require reason, then you're SOL anyway--I strongly advocate that you--when you do take time off work, be present entirely and let them figure out, right? No offense, but ABC Corporation will be just fine without you, and you're not gonna get the hours and the days and the weeks after you first give birth back just to just feel like yourself again, to bond with this new human, to breathe. You're not gonna be able to sleep for a little while, per my sister. So just being able to enjoy, step into the fullness of that experience... do not worry about the 60-80 hour weeks that are waiting on you or whatever it is that you left behind in your absence, because everybody else is getting paid for that. Like, they're getting paid to ensure that there is no lapse in the work that goes on, so I wouldn't worry about that.Zach: Yeah, that's a good point. That's a good point for everybody. I think a lot of times we can think that, like, if WE don't do something the whole world is gonna stop. It's like--it's a big company. Like, even if it's not a big company, you're not the CEO. Like, there's other people around. They get paid to help and be thoughtful and strategic on how to solve a problem. Like, you know what I'm saying? It's gonna be okay. It's navigable. Ade: Listen, just take a break. It's okay to say, "You know what? I'm a human being, and I have a life outside of this, and I'm not particularly interested in splitting my attention or my time with something that's not this. Like, this is the most important thing to me right now. You can keep the job."Zach: Yeah, straight up.Ade: It's okay to say that.Zach: It is. Okay. Well, Leah, congratulations as well. I apologize. I did not say that in my little initial response, but congratulations from the Living Corporate fam. Yearp.Ade: We should have a Living Corporate onesie made.Zach: Listen. Actually, I think that's a really cute idea. I just question, like, if we're--if we're big enough. But I would like to make one. If we get big enough and we start making, like, baby merch, we have--we have arrived.Ade: Officially made it. Mama, we made it.Zach: We have made it. We making baby merch? Not even just regular people. Baby merch. What? Anyway, one can only dream. The next letter comes from--oh, here we go--Jamal. Oh! ...I'm not hating on you. I'm not hating on Jamal.Ade: Why did you do that? Nope, now we're gonna--now we're gonna have to have a conversation, Zach.Zach: [laughs] It's just like--no, it's just funny, man. It's tough. It's tough out here, like, just the way that, you know, internalized depression is set up. Like, you know, even I see certain names and I'm like, "Oh, okay."Ade: I can't. We're gonna have to unpack that.Zach: We do. We need to talk about it. We need to talk about it in an episode about respectability politics, right? No, I'm just laughing at the name--I'm laughing at the name Jamal because it's just--it's so stereotypically black, and I love--Ade: In the context of the conversation that he's trying to have?Zach: And in the context of the conversation that he's trying to have. It's just funny. It's just all funny to me. Anyway, so look. Jamal, I'm not hating on your name. My name is Zachary. My mom named me that very strategically. I show up very well on resumes.Ade: You should also say your middle name.Zach: Sinclair.Ade: [laughs] Zach: [laughs] So I'm on the opposite end of the spectrum.Ade: I just also want to say that that was the only, like, American name for, like, a very, very long time. Any time I ever thought about "If I ever have children, what would I name them?" That was the only, like--Zach: Zachary?!Ade: No, no, no. Sinclair. That was the only non-[Yoruba?] name that I ever thought of, and it was because of Upton Sinclair. Zach: Sinclair is a dope name though.Ade: It's a very beautiful name. And then somebody was like, "Okay, but then they'll nickname your child Sin, and--"Zach: That's true. Call him Sini.Ade: Even worse. Even worse.Zach: I know. It's just ridiculous.Ade: Thank you so much for ruining this name for me, Sinclair. All right, let's move forward.Zach: Nah, kids are so mean. Anyway, that's another subject for another time. So this letter is from Jamal, subject line: Finding the Right Words. Finding the Right Words. "LC fam, I'm a new hire, and my team is very casual. Like, they use slang and don't even talk--do not talk very proper at all. They use more slang than I do outside of work. Maybe I'm old-school, but I speak fairly properly at work, to the point where I'm noticing I'm alienating my team. They'll say things like, "Hey, loosen up," but I really don't know how--"Ade: [laughs]Zach: "But I don't really know how. I didn't even know it was a problem until I got here. What advice would you give me to help me adjust? Thanks. Jamal." Oh, Jamal.Ade: Jamal. Jamal.Zach: J!Ade: First of all, my apologies... I just jumped right into that. Zach, is it all right if I go first?Zach: Go ahead.Ade: I am so sorry. I am not laughing at you, Jamal. I am tickled by the situation that you find yourself in. My apologies. I do not mean to be dismissive in which you find yourself. I am not minimizing your feelings. I just--I simply do find it humorous. OK. So Jamal, I want to know precisely what is said, you know? I don't--I do think that--and we've said this before on this podcast that--and Jamal, I'm assuming you're black 'cause I've never met a white Jamal, but--Zach: If we meet a white Jamal, he's coming on the show. I don't care what he does.Ade: If we meet a white Jamal?Zach: If there is a white Jamal--hey, if you're listening to this and you are white and your name is Jamal, email us and you will be on the show. I have never met a white Jamal. I've met a white Jerome. I've met a white Terrell.Ade: I have actually met a white Jerome. I used to date a white Jerome. Zach: Wow.Ade: That may have been too much information for this podcast. Let's move forward. [laughs]Zach: No. Oh, no. JJ, do not cut that.Ade: JJ. JJ.Zach: Was he a Kappa?Ade: Do me--oh, my God. We can discuss this offline. All right.Zach: I feel like--I feel like a white Jerome has a code shimmy. Ade: Can we--can we go?Zach: Go ahead.Ade: All right. Anyway, Jamal, again, I am so sorry. We are acting like plumfuls right now. First and foremost, again, thank you for writing in. Secondly, I feel like I need a little bit more context. What did it--what is it that makes you feel like you're alienating your team? Like, it's one thing for your team--I just have so many questions. One, I feel like there's a context necessary, right? If you work in an ad agency, the culture--or in a startup--the culture is not going to be as formal as if you worked in a bank, and that is not to say that you need to change the essence of who you are to fit into the context of your team, but I do think that it makes you more noticeable when you don't fit into the context of your team. Now, that said, there are fully ways that you can be who you are at work, not change an iota of who you are at work--see, you got me using--anyway, not changing the context of who you are, but also making more of an effort to be more accessible to your--to your team members. We've had this conversation before on an old episode where we were saying that people don't trust who they don't know. If you are inaccessible to your team members, it's harder for them to trust you, feel like they know you, go to bat for you in the same way that they would for other members of their team, regardless of how amazing you are. Like, I don't think that that is necessarily fair, because if you are a perfect coworker you just don't pop up at Happy Hours with the other coworkers simply because you don't drink. There's no reason why that should have an effect on your career trajectory. I do also think that there are other ways in which you can make people more comfortable with you without necessarily feeling out of place or like you're faking it. I think that you can--if you are a coffee drinker, you could invite people out for coffee. So they'll walk out for an afternoon coffee with you or coffee, or bring pictures of your family to put up in your workspace, or taking an interest in your coworkers, asking them questions about themselves so that you can listen to them use their slang and having a full conversation with them, because if that is not who you are, I wouldn't fake it. And I don't think you should have to in order to make anybody else comfortable. I do think that there are ways and strategies that you could employ to simply get to know your coworkers so that it's simply a part of who you are, Jamal, that you say, "I would not like to go to breakfast with you," instead of "Nah, I'm straight." You see what I'm saying? Does that make sense, Zach?Zach: It does make sense, and I do--I do think more context is needed, and I recognize, you know, you're not trying to get into all the details or whatever, but some--it's a challenge, especially, like--and I can really relate to this letter. That's why I was also kind of laughing, just because recently I've been getting feedback that I'm too--you know, that basically--not even too formal, but it's just like, "Okay, I'm getting lost in what you're saying, right?" And so what I have to challenge and what I have to question is how much of this is really me needing to adjust how I speak, because I'm almost 30 years old, and up 'til this point in my life I've been told that I'm a good communicator. I think that's one of the--one of my strengths. So how much of this is things I need to change? How much of this is, like, just personal style? You know, like, maybe what you're not used to? And then how much of this is just, like, you just maybe not being comfortable--like, maybe something about me makes you uncomfortable and there's, like, some unconscious biases there, right? Like, those are all--those are all things that are real, and, you know, when I think about--when I think about being at work and someone telling you to loosen up, it's like, okay, well, if you're communicating and kind of getting the message across, or if, you know, you're just saying what it is and they're still not really hearing you, then talking to someone you trust, right, outside of that team and being like, "Hey, look. Here's the feedback I've gotten. This is what I've been trying to do." You know, "What do you think?" Right? Like, getting some outside feedback I think is gonna be really important, because what you don't want to do is feel like you're having to--I think, like, to Ade's point, like, change your entire self. Like, you're trying to, like, rebuild yourself. Like, you're enough. Like, I imagine that you know how to put words together, so it might just be about making, like, some small tweaks and adjustments, but at the same time I think kind of trusting your gut as well and knowing who you are and then just kind of leaning into that. I think--the other point Ade made which I really like is, like, getting to know people and just kind of, like, building those relationships and then letting them see you, as comfortable as you are let them see you, but yeah. Like, that's what I would do, and then that way when they talk to you and you say, "Yes, I'd rather not," they don't go, "Oh, here you go again." Or maybe they do, but they've seen you, and they've seen you be consistent, so they know you're not putting on some type of, you know, air. That's my take.Ade: Right, and I do think that it's important that you separate who you are at work from who you are in general, and it's okay to not--it's okay to not want there to be an overlap. That's not to say that you have to hide yourself or lie or be unfriendly, and again, that's part of where this context that we're asking for comes in, because it's difficult to tell from this--from this letter whether the issue is that the coworkers don't feel as though they know you and that it comes out in them saying that you need to loosen up or that you are too straight-laced or if the issue is that you're not a culture fit for whatever reason. And I hate that phrase, "culture fit," because it's been used so frequently to exclude people of color, but again, some context is needed here, Jamal. I hope this conversation that we had helped, and if it did not, if you'd like to write in to further explain what's going on, we would love to have you, would love to hear some more from you, and if not, we hope that you get more comfortable, whether it is at this job or a next one. It's okay to be like, "You know what? I'm gonna take me and my suit and tie onto somewhere where we're respected." I think I'm perpetuating that "Break up with him."Zach: You are, you are. Ade: 'Cause I think I've said that about every single letter so far.Zach: You have, and I'm like, "Okay, Ade." I mean, everybody's not gonna just pack up and leave their job. I mean, you know, people do though. People leave. People find new jobs. I don't think this is what he's talking--I don't feel like this is the answer on this one though.Ade: No, I don't--I don't think that it is either. I am saying that it's OK if you feel like you don't want to and you want to kind of just pick up your things and go. The reason I say that is largely because you're a new hire, so I feel as though if they're trying to make you comfortable, singling you out is not the way to do that. And that may not be what they're doing. I fully admit that this letter's a little light on the details, et cetera. I'm just trying to address the full breadth of the experience that Jamal might be having. Since you're a new hire, it might be that they're trying to explain to you what the culture is without necessarily being the most obvious about it, because I know for a fact that I've, like--I've walked into a job in a full suit and the director was wearing jeans.Zach: Yeah, that happened to me recently. Like, I came to work and I was wearing, like, slacks and a blazer, and he was like, "Don't wear those slacks again." Like, it was super casual, you know what I'm saying? It was funny. And I got mad love for him too. He's funny. He's a nice guy. It was just super funny. And I wore a blazer. He wasn't super happy about the blazer, but the blazer has grown on him. I think he was like, "You have to take the slacks off." He was like, "I'ma kind of give you a little bit of a time about the blazer for a couple weeks, and then I'ma let you, but you gotta wear jeans." And so I got some--you know, I got some designer jeans. Anyway. We're on a tangent now, but anyway, I feel you. I feel you.Ade: Yeah, so I'm really honestly just trying to address the entire range of experience that might be going on here. It's entirely possible that they're wilin' and they need to relax and let you be who you are. It's entirely possible that they are trying to say, "Hey, you know what, a three-piece suit is not necessarily the way to go here," and they might also be saying that you're not a culture fit for whatever other reason. Either way, I would like for Jamal to feel comfortable in owning his experiences and in saying that, "Hey, I'm cool with this," or "Hey, I'm not cool with this," and either way, your life is yours, your career is yours, and you are able to make whatever decision you feel is necessary for your own growth and comfort.Zach: That's real. That's real. I gotta snap on that.Ade: Thank you, friend.Zach: You're welcome. You know, something interesting... we're saying these people's real names, and I wonder... should we not? Ade: Hm. You know what?Zach: We might need to do this whole thing over. I don't know.Ade: I feel like if they had wanted us to, like, bleep their names out or give them different names they'd have said so, but if you do write in and you prefer--and there are a bunch of Jamals out in the universe, so I don't--I don't expect--Zach: There's a lot of Jamals.Ade: Right? So if you do write in and you'd prefer that we do not say your actual names or the names with which you sign these letters--because these are just the names that signed the letters, so they may have given us fake names in the first place. Plot twist.Zach: That's real.Ade: But if you do prefer that we don't say your names, please let us know that, and we will do our best to find a repository of fake names to substitute.Zach: There we go. I like that. I like that cleanup. Thank you, Ade. It'd be so funny. What if, like, someone gave a fake name, we go, "You know, we don't really--" You know, "We're not gonna say this name," and then we give a fake name and the fake name is their actual name. Whoa. Ade: The universe really just needed you to say this with your chest then, because the odds of that--Zach: That's tough. That's tough tough.Ade: If you write in here, please note that I'm giving all of you [Yoruba?] names.Zach: Straight up. Okay, so--all Yoruba names, really?Ade: All of them.Zach: I like that.Ade: I mean, I might throw in an [?] name in there or an [?] name, but [?].Zach: Like Oshioke. That'd be dope. Ade: What? Oh, we're gonna have to coach you too.Zach: [laughs] I actually know an Oshioke. That's why that's so funny to me. Goodness gracious.Ade: It was just the way that you pronounced it. Zach: I know. No, I gotta do better. I need to grow. There's some opportunities for growth there.Ade: There are way too many Africans in your life for this to still be--Zach: There are so many. There are so many Africans. Shout-out to all my real Africans out there, but yeah. Okay. Well, look here. It's been--we got about 30 minutes? Okay, not doing too bad. Look, that's two listener letters. I feel like let's go ahead, let's do a Favorite Thing, you know what I'm saying, and then let's get on up out of here. How does that sound?Ade: All right, that sounds good.Zach: All right. What's your Favorite Thing? 'Cause I do have one.Ade: Okay, then you go ahead.Zach: All right, cool. So my Favorite Thing is actually this video, this music video, by this artist named Russ.Ade: [sighs] All right, and we're done. Thank you for listening.Zach: Oh, no. You don't like the video?Ade: I'm just being a hater. Go ahead.Zach: Oh, okay. I was about to say, this video was fire. So I opened up the video, 'cause I love music. For those who don't know, like, my background, before I changed my major, was music, and so I love music. Like, I'm really passionate about it, right? And so I'll listen to--I'll listen to really any genre. So anyway, I'm on YouTube like billions of others on this planet, and I open up a video and there's, like, this beautiful, I mean beautiful black woman, like, very, very dark, very dark-skinned, and I was like, "Man, this is incredible." And, like, the lighting was great, 'cause I'm also--like, I'm also really into photography and videography, so I'm looking at the lighting, I'm looking at the way--I'm just looking at, like, everything. Like, the color pallette. I'm like, "Wow, these are the prettiest black people." Like, on a--for this to be just a regular music video. This isn't, like, Black Panther. This is, like, just a music video. I was like, "Wow, the color--the lighting on the skin is so nice." So anyway, then the music starts playing, and then it's like--you know, it's an African song. Like, it's kind of African style. You help me, Ade, but it's--Ade: I'm gonna let you flounder for a few seconds.Zach: No, it's fire though. So anyway, then this random dude--I guess his name is Russ, I don't really know, so young people, help me out--this random dude, like, petite white man with very long hair is in, like, this really--Ade: Did you just call this grown man petite?Zach: I mean, he's like--he's only, like, 5'1". It doesn't matter. He's like--and he looks very out of place. He's wearing, like, a jersey with, like, baggy jeans, and, like, everybody else around him is, like, Nigerian or Cameroonian or, like, they are clearly, like, African, right? And they're all dancing, and, like, they look great, and he looks, like, super bummy, and the juxtaposition was really interesting, but it was a beautiful song.Ade: You just called this man bummy. You called this man bummy on his own music video? You called him petite and bummy on--are you sure this is your Favorite Thing?Zach: Everybody looks super--everybody looks so regal, but I like the fact that basically--to me, what I got from that was he was being himself, right? Like, I'm being myself. I'm chillin'. He also had, like, some--he also had some Nigerian cuisine references in his song, talking about "mix the jollof with the suya." I said, "Whaaat?" It was crazy. And so I just really enjoyed the video. I really liked the fact that you have, like, this really--apparently after I did some research on the Wikipedias--fairly [?]--on the Wikipedias. He's very popular, and, like, he really, like, centered--he centered black identity and experience in the song. And then the guy who sang with him, Davido... Davido? How do you say his name, Ade? Ade: I'm not doing this with you.Zach: He is cold! He snapped on this song. I said, "Yo, this is a fire song!" And so I sent it to Ade. I was like, "Yo, this is my Favorite Thing." Like, "The next time we talk about Favorite Things, I'm bringing this up." Yo, I loved the video.Ade: Do you know I completely forgot about that? I had to go, but, like, I'm literally watching the video right now as you talk about it. I had to go back to the text to go see what this is. I still can't believe you called this grown man petite, but yeah, he does look a little bit... slight.Zach: Listen, man. If the extra small fits. Like, I'm not trying to be mean. There's nothing wrong with being petite. You can--you can [?]--Ade: You are 6'3". Everybody is smaller than you.Zach: I'm 6'2", first of all. But yeah, I think--I wish I was 6'3". Man, that'd be great. I'm, like, 6'1" 1/2, almost 6'2". If I was, like, 6'3", what? If I was 6'3" with a beard--that's gonna be my next Favorite Thing, beards.Ade: There, so now you're only, like, 9 inches taller than me instead of 12. Great.Zach: There you go. But no, so why are you--why are you hating on the video? Do you not like the video?Ade: I'm not hating on the video actually. I just hadn't seen it, but I had heard a bunch of people, like, talking about it and how amazing it was, but I haven't seen it yet, so I'm just kind of like, "Ugh, God, I don't have anything to add to this conversation." And then you started the conversation about this, calling the man petite, and I had to go look.Zach: It got your attention though, right? See? There you go. Ade: I cannot. Okay.Zach: But what do you think? So you're looking at it. Like, well, how do you--is it not dope or is it not dope? Ade: Well, I haven't actually heard the song accompanying it, but yeah, it looks like a ton of fun.Zach: And don't the people look beautiful?Ade: I mean, yeah, of course. Wait, I think I just saw, like, a gay man in this.Zach: I'm saying. See? No, they're doing it. No, it's dope. Ade: Okay. All right, anyway, let's focus. All right.Zach: So that's my Favorite Thing. So what's your Favorite Thing?Ade: My Favorite Thing? So my Favorite Thing this week is a website called egghead.io. I've been struggling with--actually, two Favorite Things, 'cause, you know, y'all know how I am. Egghead.io is a website that has a bunch of lessons and tutorials for people who are learning programming, and they are, like, super short videos, which is great, because if you have a shrot attention span like I do, there's nothing in the world worse than signing up for sitting down for a 2-hour-long tutorial. It is so painful. And the concepts are [?] and robust, and you often get to, like, code along, so it's fun, for me at least. And then the other thing, my other Favorite Thing, it's the React training course. So I didn't tweet very often about it, but I went to--early last week I got the opportunity to go to a React training. It was on hooks specifically, but they essentially took us through the basics of React all the way through this new concept called hooks which uses [?] context and [?] effect, et cetera, which probably makes no sense to you right now, but I only got to go because I emailed the team behind React training and I just asked them. I was like, "I don't have $1,000 to drop on training, but I'd really like to come," and they said, "Cool, come on." And it's one of the things that I love the most about tech and tech spaces. It's that if you are--if you ask, more often than not somebody will try to find a way to make sure that you can get it. At least the spaces and the people that I have met have been super generous and awesome with their time and are willing to help you learn and help you succeed, and so for people to just go out of their way to support you simply because you say, "Hey, I'm a learner, and I would like the opportunity to attend this training. What can you do for me?" And they go, "Okay. Girl, come on over." It felt really good, and the training was amazing, and I am now using it to build a couple of apps with my friends. So I am--yeah, I'm super thankful for the tech community and thankful in particular for Ryan Florence and Michael Jackson. His name was really Michael Jackson. And Danny [?] over at React training. Yeah, love those guys.Zach: You said--you said his name is Michael Jackson?Ade: It's really Michael Jackson.Zach: Does that not make you nervous? 'Cause he might be so... BAD at his job?Ade: All right. Well, guys. You just had--you just had to get one in. Okay. All right.Zach: [laughing]Ade: Y'all, it was so awesome. Thank you for listening.Zach: Oh, you're not even gonna do your second favorite thing? You're just gonna--Ade: That was my second Favorite Thing, and my first thing was egghead.io.Zach: Oh, right. You just weaved into the next one. I'm sorry. You're right. Go ahead.Ade: You were so focused on your dad puns that you weren't even paying attention to me.Zach: I was paying attention to you. Relax.Ade: You were not practicing your active listening skills, Zachary.Zach: Man. I had some other ones I was gonna say, but I was like, "Dang, nah." 'Cause I don't wanna--you know what I'm saying? I ain't trying to mess the bag up, the future bag, you know what I'm saying? So I was like, "Eh, let me go ahead and not have a problematic joke."Ade: Your dad joke was amazing actually. Thank you.Zach: No, I believe it. I believe it. Okay, okay, okay. I'm sorry. You were wrapping it up. Okay.Ade: Yeah, caught Michael Jackson while he was on tour for once. All right, no, that was even worse. That was even worse than anything you came up with. Okay. Anyway, that's it for us today, guys. Thank you for joining us. Actually, I'm gonna stop saying guys. It's not very inclusive.Zach: I be trying to say. I'm trying to tell you. We need to relax on all these, you know what I'm saying, gender-limiting terms.Ade: You're right. Thanks for joining us, y'all. Next time we will see you--when's the next time we're gonna drop an episode, Zach? Do you know?Zach: I mean, next Friday. Ade: Word.Zach: We drop an episode every week, so.Ade: I've been using a contextual--like, weekly contextual language in this episode, 'cause I said last week, and I didn't know if it was actually gonna be last week by the time they hear this. Anyway, y'all, we're Living Corporate everywhere. We are on your LinkedIn, on Twitter, on Instagram, on Facebook. Wherever you be at we be at, so come check us out. If you would like for us to read one of your letters, please send us an email at our gmail. It's livingcorporatepod--podcast? Oh, gosh.Zach: Yo. It is livingcorporatepodcast@gmail.com. You can also DM us on Twitter and Instagram. You don't know--we're, like, 71 episodes in--or 72, I don't know when this one's gonna drop--you're talking about... goodness gracious. Yes, it's livingcorporatepodcast@gmail.com.Ade: I had "livingcorporatepod" on--Zach: You probably--what you probably did, you was probably thinking about our Twitter, @LivingCorp_Pod.Ade: Yes, that's the one. Uh-huh. I just--I'm not a terrible person. I'm just tired today, y'all. All right. We are on the world wide web at www.living-corporate.com. I got that one right that time.Zach: You did. Good job.Ade: Pats on the back, pats on the back. [laughs] Until next time, it's been Ade.Zach: It's been Zach.Ade and Zach: Peace.
Topics include: 0:00: Making movies 05:08: Ryan Florence's tweet about Twitter App 18:08: Ember Data stores across browsers 32:58: Laravel's ascending option 35:51: YouTube transition to UI pattern 42:15: Ember's build environments Links: Sam's Star Wars movie Ryan Florence on Twitter's PWA
Une nouvelle saison qui débute avec plein de nouveautés React, une nouvelle version de now (Zeit) et Framer X. Avec Matthias (bloodyowl), Maxime (MoOx), Mathieu (Zoontek) et Georges (SkinnyFoetusBoy). Liens: - React Suspense https://github.com/facebook/react/issues/13206 - Concurrent React https://www.youtube.com/watch?v=ByBPyMBTzM0 - Hooks https://reactjs.org/docs/hooks-intro.html - Talk de Dan Abramov https://www.youtube.com/watch?v=dpw9EHDh2bM - Talk de Ryan Florence https://www.youtube.com/watch?v=wXLf18DsV-I - Now https://zeit.co/now - Framer X https://framer.com
Ryan Florence is the co-creator of React Router and creator of accessibility-first React libraries Reach Router and Reach UI. Chantastic sits with him to talk about Hooks on the night before they're announced. They talk about React's API growth, if Suspense has taken React to framework-land, what caches and resources mean for developers, and the rebirth of mixins as Hooks.
Chantastic talks with Ryan Florence about Reach UI and why accessibility is important for everyone. They discuss the balance of physical and mental activity, Ryan’s foray into programming and entrepreneurship, the inspiration behind his accessibility-first component library, and why none of us are really full-stack developers.
Jake and Michael return after a two month (!!) summer hiatus
In this episode Adam talks to Ryan Florence about the challenges of making custom UI components accessible, and how Ryan is trying to make that easier with Reach UI. Topics include: How modern JS frameworks have made the web less accessible How Reach UI is making it easier for people to build accessible components without sacrificing customizability The importance of using the correct markup How focus trapping works Adding keyboard navigation to components in a way that makes sense for screenreader users The challenges of building an accessibility-focused UI library Sponsors: Rollbar, sign up at https://rollbar.com/fullstackradio to try their Bootstrap Plan free for 90 days Cloudinary, sign up and get 300,000 images/videos, 10GB of storage and 20GB of monthly bandwidth for free Links: Reach UI React Native for Web WAI-ARIA Authoring Practices VoiceOver NVDA Hiding elements visually but not from screenreaders Ryan's Advanced React Workshop Tour Ryan's Online React Courses
Guests: Brandon Hays: @tehviking | Blog Chris Freeman: @15lettermax In this episode, former Fronsiders, Brandon Hays and Chris Freeman join Charles and Taras to talk about the difference between a framework and a library, whether or not React + Redux a framework in itself, red flags to signal that you're actually building a framework, attributes of a good framework, how can you tell if you created a bad framework, and how you can make a bad framework better. Resources: Test Sizes by Simon Stewart This show was produced by Mandy Moore, aka @therubyrep of DevReps, LLC. ** Transcript:** CHARLES: Hello everybody and welcome to The Frontside Podcast. My name is Charles. I'm a developer here at Frontside and today, we're going to be talking about the things that go into making a JavaScript framework. Because, hey, there's not enough of those in the world today, so we're going to talk about that and with me is Taras. TARAS: Hello, hello. CHARLES: And we've got two very special guests, who have a lot of experience with this topic. Mr Chris Freeman and Brandon Hays. Hey, guys. CHRIS: Hi, there. BRANDON: Hi, there. We're talking about the poofberry framework, right? CHARLES: What's a poofberry? BRANDON: There's a tweet that's going around right now that one of them says, "I don't know what I should be doing," and the next person says, "Oh, just use poofberry." What is that? It's like fluffnuts but the [inaudible]. Hey, dot, dot, dot. Then, it integrates with log bungler. CHARLES: There's a reason that I'm dying laughing. BRANDON: It's so true. CHARLES: It's so true, laugh, cry, laugh, cry. Let's start with kind of a very basic assessment here. Because there's a lot of different things that you can use to compose the applications that you build but for some reason, some of these things are grouped and considered as libraries and some of them are considered frameworks. I don't know that the boundary is very clear like I'll know it when I see it type thing. Maybe, we can start with what is the difference between a framework and a library? CHRIS: I have some thoughts of these. I feel like this is one of those questions that could easily just turn into an infinite bike-shed but I remember reading something a while ago that stuck with me for a long time. I'm pretty sure it's related to Java but that makes sense because if anyone is going to talking about frameworks, it's Java developers. But it was saying that the difference between a library and a framework is inversion of control and the idea is a thing that's a library is a thing where you are in control. You bring the library code into your code and it's up to you what you do with it. In a framework, the framework code calls you as I think what it said. It's like, you call the library code, the framework code calls you and -- CHARLES: In Soviet framework. CHRIS: Yeah, exactly. A framework says, "Here are a bunch of open spaces for you to put your code in and I will take care of the rest," versus a library is just like... I don't know, "Here's some things that you can use. It's up to you. What do you want to do with them?" CHARLES: Right, so in kind of like [inaudible], that would be basically, a framework would be the thing that's got the main method. I think the same thing in JavaScript and when you call it, does it actually implement the main method. In JavaScript, it'll probably like in node. Under that definition, it would be like, "Are you the main scripts when you invoke node? Do you control the main script?" If you were doing your own command line parsing, for example, you're looking at the process.rb and pulling off the command lines and doing all the things but even if you're using something like Yargs or option parser in Ruby, that's more of like a framework. I guess Yargs is a library because you're still implementing the script. You're instantiating the Yargs thing. TARAS: React calls render to figure out what to convert to DOM. Does that make React the framework? CHARLES: I think React as a library. That's a good question. What's the equivalent of the main method on the web? CHRIS: I think there's a very clear distinction, especially if you look at React versus something like Ember and I'm sure Angular does this as well. In React, by default, to build a React thing, you're going to pull in React, you may write some components, you may import them elsewhere but the main method is that you have an index.html with some div in it and you are the one that has to call ReactDOM.render and you pass it like document.query selector or whatever and then, your top level component and that can be as simple as complicated as you like or you can have a webpack plugin do it or whatever else. But the onus is on you to actually take that React app and get it starting up on the page versus Ember, it's like, "There's an index.html. It's fully wired up." There is one point where you sit down and say, "Start my program here," like Ember abstracted all that away. To me, that's the main method for a frontend application. CHARLES: Right and if you actually look at something that Ember generates, then look at index.html, they generate a script tag for you that instantiate your application and mounts it on an element. If you want to change that element, that's actually a configuration option that you can change but it still a configuration option that's consumed by the framework. In that sense, there is that inversion of control. I see what you mean like in React, you're the one who flicks off the first domino, like who's the prime mover. Is it you or is it the framework that knocks over the first domino? BRANDON: I like Chris's explanation and I think it's elegant to say because I was thinking in terms of structure. If it imposes a structure on you but really, the structure is there, it's like one of those Ikea shelf systems for you to put stuff into. If you're trying to solve a problem, here's a shelving system for you to put stuff into, whereas a library is just the tool that you might get out to put something together. Something that's multi-purpose but doesn't impose any structure on you or a ton of structure on you. My question is what's the usefulness of distinguishing between the two? TARAS: I think what's interesting and I had experienced this in a last couple of projects is that people, especially React when they kind of assume, because a lot of people entering to React not understanding the context within which React emerged and so, they're getting into React assuming that it has everything you need to build application that you need to build. A lot of them haven't necessarily built a single page application from scratch before and so, the jump into building something with React and then, it takes about a year for them to realize the full scope of all of the features that their application actually has and then, they kind of take a retroactive look and look like, "Okay, what do I have now?" and what emerges is that they've actually over the last year, they may be creating a framework without realizing that this is actually happening. CHARLES: They've imposed the structure of saying, "Here's the shelving system. Books about geography go here. Books on English literature go there and so on and so forth." BRANDON: But when you rolled your own framework, that's not how it goes. It's like, "You have to launch this balloon into the stratosphere to put a book on the shelf from geology." Taras, to your point, it sounds like the importance is setting expectations properly for people, so that they know what they're in for because kind of calling back to Ryan Florence's post a few years ago, you can't not have a framework. At some point, you will have a framework in order to ship something. I would actually take it one step further. My friend, Kyle talks about this that library is the smallest unit that you're working within a framework but that still doesn't take your code to production and put it in a debugable state. You need a platform. It's arguable, if you're handling deployment tasks and debugging tasks and operating software in production, you now have a platform and it's fair to say that Rails crossed that threshold at one point. It's fair to say that Ember has probably crossed that threshold, if you combine Ember with CLI deploy and the CLI tooling and all of that stuff. This almost like acts as a platform if you're owning and maintaining the software in production. CHARLES: Now, can I play devil's advocate here and say, the platform, is that necessarily predicated on a framework? Is there a pyramid where it goes library, framework, platform and one is built on top of the other? Why couldn't I have a library? Because what I'm hearing is the scope of concerns is just rendering HTML based on a state is a very small chunk. The actual scope of things that you need to do to get that code in production and have it be reliable and do all of the features that you want to do is just massive but why is that predicated on a framework? For example, one thing you have is a bunch of libraries out there, like routing for managing the title tag, managing all these things that you have to do for managing deployment, for building your application, for compressing it. There's all these different libraries out there. What if there was one massive library that just picked a bunch of other libraries but I was still in control? TARAS: I've actually seen this happen in the last of the projects. When people jump into building, they will eventually realize that they're building a platform but what happens before that is that they take user's requirements and they break those up by sections and then they assign them to a bunch of development teams who go and actually start to build. On one platform, they end up building five or six or 10 of siloed, packaged applications that have, in some cases, have their own dependencies, they have similar architecture, might not have similar architecture. Each team kind of implements thing differently and there's an expectation that once you package these things as npm and then you install them into one package, to one application when you run build, it's just going to work together. That's where I think, with the framework, it does create a foundation for these verticals to be implemented using kind of common foundation. This is what a lot of times that as if you don't realize that what you're trying to set out to build, the way that the projects get managed quite often, especially for big applications, for big platforms is that, it creates this period of about two years, where there's a lot of confusion and there's a lot of duplication and then, you end up seeing code that it's hard to put in production. CHARLES: Yeah, I agree. I'm curious then, because we'd started out talking about library and framework and talked about it takes two years to recognize that you're building a framework or you're building not a framework but a platform. Brandon, you said something very interesting. Rails for example, crossed the threshold of being more than a framework and actually, being a platform. What are the concerns of a platform that are beyond a framework? We talked about and using the kind of loose definition of a framework as being something where the framework create spaces for your code, to run your code so you can just take little dollops of code and they have one concern but the framework manages the coordination of the concerns but what's the next level? BRANDON: For the purposes of this conversation, I may have muddied the waters a little bit because I think it's more interesting to talk about the transition and the level of which you've crossed the threshold from being a library or using libraries or collecting libraries, into maintaining a framework because it's where you're going to experience more pain more than likely, than to me, the idea from works on my machine, to deployed and supported across a lot of users, it sounds like it's more interesting but it's not where we experience most of our pain actually. From my experience, maintaining frontend single page applications most of the pain is actually getting the damn thing to work on your machine and getting the libraries to collectively work together and then, getting that to production, it kind of enters back into an area of more known unknowns. I think that's a surprisingly a more mature ecosystem, still getting from this thing works on my machine to getting it out the door. That wasn't true when Rails was invented and so, Rails had to invent a lot of its own ecosystem around this stuff. Like I said, I don't want to muddy the waters too much. I think to me, the interesting question is how do you know you've crossed this threshold? What pain points are exposed when you start crossing that threshold or when you're pushing the boundaries of that threshold? Because you should not be using a framework if you're using React to do a select dropdown. I think of it as, if you're using it the way to replace something you might do with a jQuery plugin five or 10 years ago, you're using React like it's a library. One of the questions that you brought up was is the combination of React and Redux is a framework and I would argue that it is but I kind of want to throw that out -- CHRIS: Oh, interesting. CHARLES: I would say, it's two libraries stuck together to make a bigger library. It's like a monolithic library. BRANDON: But by the time you're actually using that to do anything, maybe the third thing in there is like transitioning states when you transition routes. At what point is that threshold crossed? I didn't build most of the software that led me to some of the opinions that I have about this. This was actually Chris Freeman's, though. I may defer to you on this. CHRIS: I think React + Redux constitutes if you look at what it does. You have like this view layer and this state layer. There's a set of opinions on there that is useful and there is the foundation for doing quite a bit but in my experience, you've already kind of alluded to this a little bit. I don't think it's a framework because as soon as you start using those two things, suddenly the next thing you hit is, "Wait. How do I handle asynchronous things?" There's a lot of different options for that. "Oh, now, I need to do routing. How do I incorporate routing into my React app but also in a way, that is amenable to state transitions in Redux but also, that is aware of the async stuff that I'm doing, that is going to possibly be triggered by my routes and by my Redux actions or by some other side of things?" Suddenly, you are very quickly pulling out a bunch of other libraries but also, probably starting to build abstractions on top of them because you're already finding a lot of common patterns that you're repeating over and over as you incorporate more and more pieces of the stack and then, you're writing a lot of glue code. I think that's the point where suddenly, you look back and behind you is the footsteps of this framework that's been walking alongside you the whole time. BRANDON: That is where I carried you, then dropped you, then sort of drowned you. CHRIS: Yeah. CHARLES: And then, kicked your core. TARAS: I'd like to suggest a way to think about this. As you guys are talking about, it kind of occurred to me is that it seems to me that libraries concentrate on how and frameworks focus on the 'what.' CHRIS: Oh, I love that. TARAS: Because if you think about for example, React is how geostack efficiently update DOM, then Redux is how do you wire together state across multiple components that might be in different parts of state tree and if you look at, for example, a React router or a kind of a routing component is how do you choose which components you want to render when you navigates specific URL. Because those things by themselves are not a complete solution but when you combine them together, what you get is you have a way of saying, "When I navigate to specific URL, I'm going to load specific data, provide that data to components and then, I would have a way to navigate through a different URL when you click on a link." From that, I think what happens when you get to the framework level is you actually have a kind of a bigger umbrella and under that umbrella, you have ways to address problems that you did not have previously. I think that's what framework does it is over time, it's a way of addressing concerns that cannot be addressed with a solution. They have to address with a collection of solutions and then, they provide a specific solution. I don't know if that's -- CHARLES: That actually sparked off a train of thought in my mind that perhaps what you really want to do is say, "I'm going to go a little bit like Lisp on you all," in the sense of every code at some point is data, that maybe every library, at some point is a framework. It's just that you can look and say, "What is the scope of the 'what' that I'm tackling." For some point, you can say like React is a framework. It creates this space where I can put my JSx, AKA the render function and I'm basically inverting control and so, what it is, it is a framework for efficiently rendering HTML or efficiently mapping an object to a fragment of DOM and then the DOM that gets generated from your render function, patching that into the HTML. You don't have to worry about that. There's that inversion of control. It creates that space but that's the only space that it creates. From that perspective, React is a framework for generating HTML but that's all it is but it is a library for constructing applications. Does that make any sense? I think as you layer on concerns, your framework create spaces for you. You use your library code to put stuff in and so, in the same way, I think one of the key realizations, I'm going to call up like BigTest and I'm not going to take credit for this, which is actually a blog post that I read at Google. I can't remember what it is but we'll link to it in the show notes where he said, "There are no such thing as unit tests. There are no such thing as acceptance tests. There are just tests of varying scope." They're all acceptance tests. To use that one thing, they're all experiments. It's just what is the scope of the test that you're trying to accomplish and his argument was we want to make that scope as big as possible by default and then, where appropriate, you narrow down. Maybe, the framework library distinction is a little bit constructed, kind of a construction of our own minds and what really is there, there's just frameworks of varying scope. BRANDON: Agreeing on a shared scope is actually probably the most important part of this conversation. We're referring to building end-to-end an application from data access to rendering to testing -- CHARLES: To deployment to routing. BRANDON: Yeah. CHARLES: To one day accessibility. BRANDON: Yeah. Adding that into the discussion is like a baseline of what constitutes an application. It's the percentage of people that are able to actually use it, the people that are locked out from using it by ability. That's a very useful frame for the discussion. Let's agree on the scope of what an application is and then, coming back to what Taras was saying is basically, when you're talking about the 'how,' that's a decision point. You hear a lot of people talk about decision fatigue in JavaScript and it's almost a played out trope at this point but it hasn't gone away as a problem, so what frameworks are doing is they're making a series of decisions for you that allow you to basically connect the pieces from end to end. Basically, somebody threw a rope bridge across the canyon and it doesn't have to be the best solution to get end to end but we have to solve the problem end to end. If we agree on the places end to end and the problem is when you're building your own series of libraries, you're like, "I'm going to choose best in class of A, best in class of B, best in class of C," and that sounds really good but if you're trying to build a bridge across a canyon and you're building in 10 best of class sections, for the type of connection we're trying to make here in the middle, we're going to use the best in class here. The weak point is in the connections, so you had better be the world's foremost engineer if you're going to be the person connecting all these disparate pieces that are each best in class, in order to bridge this canyon. That's the thing that's interesting to me and it's not even agreed in our industry that JavaScript-based web applications are a good thing or that the browser is web application runtime, those are things that are up for debate. But I think if we make that assumption, this is sort of the founding principle of where Ember came from and it executed to the best of its ability at the time and that philosophy is, I think you can prove it out in terms of results based on if you have two different applications, one of them is built by somebody trying to jam together best in class components and the other person is starting with an end to end solution with a community of people rallied around that solution. It's been interesting to watch those approaches play out over time. I know Chris has a very specific hands-on experience of having done both of these. I'm curious to get your hot take. CHRIS: There's actually a concept that I think about a lot in relation to this question. It's something that I actually heard come up again recently so the timing was great but it's called hypocognition. The idea is hypocognition is when you either just like can't see or can't understand some kind of cognitive representation of something because you don't have the words for it. An example is in Western cultures, especially like in English speaking cultures, there are not that many words for the color blue but in a lot of other cultures, they have many, many words for the color blue. After doing a big study they found that these English speakers actually have a harder time recognizing different shades of blue, like more of them just look the same versus other cultures where their brains are actually wired to see all this variety because they actually have the linguistic representations for these ideas already. When you were talking about maybe a library is a framework at some point, I think that's right on. I think one of the things that I think about a lot when talking about frameworks and seeing these debates happen on the internet about, "What is a framework?" but also like, "Do you even need a framework?" is obviously, there's a lot of people who absolutely... Like Ryan Florence. Ryan Florence clearly knows what a framework is. He knows what it takes to build a web application and he does not lack the words to define a framework versus a library. He's just made that choice and it's a very informed choice but I wonder if there's also a lot of people who are getting into web development for the first time and they look at something like a framework and it seems just absurd to anyone would want all of the things that like in Ember or in Angular is talking about, when they can make a basic UI with React and it's easy and fun and really cool. But then this two-year path happens and they look back and they've learned a whole bunch and now it's like, "Ooh, you couldn't even have explained this to me before," because all of the words would have fallen on deaf ears but now suddenly, it makes a staggering amount of sense. CHARLES: Right. I love that. BRANDON: You have to make a bad one. CHARLES: Just so that you can inherit the vocabulary to understand why you made a bad one. Now, you guys actually have some experience with this. Brandon, you gave a talk about it, which I think you should give more widely because it's fantastic but for those folks who may or may not be aware that they are walking this to your path, I want to talk first about what are the signs that you're walking along this path and then two, what are the consequences in terms of the cost you're paying for walking this path. Let's start with that first thing. What are the signs? How can you tell that I am building a framework? CHRIS: I think one of the telltale signs and one of the biggest red flags that caused me and Brandon to have a very serious heart to heart about our own personal framework was when we hit the point where you could look at a set of tickets for features and all you saw was 'framework features' that you needed to write before you could build the feature itself. You know like, "Oh, we have basic routing setting and we have it set up so that if you have a route transition and you would like a data request to happen when a certain route transition happens, that will happen," but then someone would like infinite scroll and we want to use a query param. When a query param changes, I want to update the query and fetch more records, except that the glue code that we wrote to tie our router to our redux async stuff is not aware of query params. It has no concept of what a query param is or what to do when it changes. Also, it has no concept of refetching the data without a full route transition, so what do we do, this person wants infinite scroll but I first have to implement several layers of framework code before I build the UI feature that you want? CHARLES: The basic heuristic there is ratio of direct feature code to code that supports the direct feature code and code that supports the code that supports direct feature code. It's anytime you're anywhere above that first layer on the stack. CHRIS: Yeah, I think Taras nailed it like what's the 'what' versus the 'how.' If you're asked a question that is concerned with the 'what' and you spend more time focused on the 'how,' then you might have a framework. BRANDON: I think people will think of building an application like a recipe. If you think of it in those terms, people think of frameworks as very restrictive but I'm a big fan of Blue Apron, a sponsor of this podcast. Thank you. They pre-select the ingredients and they give you the instructions and you know what to do, you still have to do the effort but you know if you connect these pieces together properly that you're going to wind up having a good experience and then, it gives you a lot of freedom to experiment and be creative beyond that, should you choose to. I think one of the signs that you've done a crummy job is that you're staring down, like Chris Freeman said, you actually starting to restrict your choices like, "I can't actually build you that feature because we don't have time to take on the amount of work necessary to build the support structure, to build you that feature," or if you find yourself writing a test framework. CHRIS: Oh, yeah we did that too. BRANDON: You know, we were real deep in this. There are developers that are like, "I really want to feel like I'm walking into a grocery store and selecting all the things necessary for my recipe," and so it really depends on what the problem actually is. If you're working at a giant megacorp and you have a two-year timeline to deliver something and their goals are not about delivering stuff on a tight turnaround, that's usually a recipe for a software failure anyway but let's say, that you're in the 5% of those types of projects that's going to succeed, that might be a good place where you can say, "What we're trying to do here is so custom and we have such a long lead time and a long leash and such a high level of internal expertise here that we should be shopping in the grocery store and we should be selecting all these things and we should be solving these problems." Basically, when is it time to use a framework? Well, when you don't have 10 times the time you think you do, when you don't have the ability to spend 80% to 90% of your time in the first three to four months of your project, maybe six months, debugging you're glue code in between the different libraries that you're gluing together and then coming back and realizing that you've painted yourself into a corner and you have to re-architect your whole framework, then you could be so proud of this baby, 18 months to two years from now, when you actually have delivered both a framework that took about 70% of your time and an application that took 25% or 30% of your time. CHARLES: Yeah. I think it's important to realize that people think we'll do it and we'll build it as we go but I want to call out right there, you will be spending 80% of your time and you have to be upfront about it. Of this two years, 18 months of it is going to be spent building this framework and six months of it is going to be spent actually writing the feature code and you have to be 75% of your tickets or your issues, whoever track the work, 75% of that has to be dedicated to the framework. BRANDON: If you're going to bake in that kind of overhead purely for the satisfaction of a single or one or two developers that like inventing things, that is literally the worst possible reason you could do that. That is almost like a guaranteed recipe for failure. It has to be for some other business reason like, "We want to be the company that owns this." There has to be business value attached in making that kind of investment. If you can't justify that at the outset, then you should probably just go ahead and lean on an existing framework and join a community of people. CHARLES: Yeah and I think one good litmus test for that is, "Is this a 'what' for which there is currently no 'how?' One of the reasons we're writing BigTest is because for the general JavaScript community, there are a number of acceptance test frameworks out there but the market is very, very limited. When we look to actually acceptance tests, our React application, this thing does not exist. Now, we had experience with something that was very like Ember specific and so, we kind of knew what the 'what' was, we experienced the 'what' but there was no 'how' for our current situation. That's like a place where you might be called upon where makes business sense to actually invest in a framework. I'll tell you another thing too is if you have made the decision to kind of follow the beaten path on the other areas, then when a framework is called for, you have the bandwidth. You've allowed for the buffer, for the margin, for you to write in with that framework, whereas if you're already just by default, maintaining all the glue code in every single thing, then if some unique 'what' comes along, for which there is no 'how,' you're not going to have a bandwidth to tackle it. BRANDON: Yeah. That's a real bad situation to be in. TARAS: There's something else that I find interesting is because there's a certain point, like this two-year mark where everyone's like, "We want to fix this now." I think what is interesting what comes next which is the three years of undoing all the stuff that you made because the biggest challenge, especially in really big projects. When your projects has to borderline into platforms and a platform threshold is when you have a multiple teams working separately to write separate modules that run, maybe in a separate Git repo and maybe, packaged in separate npm package and assembled together. Then what happens at that point, the question arises like how do you actually make this changes in this environment. Answering that question is actually really difficult. I think if you look at frameworks like Ember, Ember has made it their business to figure out exactly how to make this happen and I think they've done it really well but it's a really challenging endeavor, especially in incorporate environments where they don't have an update. You have like upgrades are like a curse. It's like a thing that you don't really want to ever do and because most quite often, they don't have the right testing habits in place to be able to support the change if necessary. I think what a lot of times happens is that the team that made the framework in the first place, they end up trying to maintain a fort but you won't have like 10 people and they only have machetes, you know? All you can do is run around and try to chop down little twigs but at the end of day, the trees is still going to keep growing. I think that's the really challenging part of being two years into a project, where you realize that you actually need something much more comprehensive than initially thought you needed. CHARLES: On that, assuming that you have decided that you are going to make a framework, it's a good business decision for you. Based on the criteria of this discussion, how can you assess whether it's good? Chris, you talked about needing to integrate query params with routing and asynchronous data loading and making sure all of that coordination happened and worked together easily. What's the difference between your framework just missing features kind of having holes in it that can be filled in, versus something that's not good and it's going to cost you lots of money down the road. CHRIS: Yeah. TARAS: One thing, if you look at what makes a good library of any kind, it tends to be like how effectively and how much words to take the address the use cases that you need. The problem is that to build a good framework, you need to understand the use cases. This is what usually happens over time. Two years in, you've actually understood the use cases and now, it's time to change and so, I think if you want to build a good framework, you actually need to understand those use cases quite early on or account for understanding use cases over time and that's a big question -- how do you figure out how to know what you don't know. CHRIS: Yeah, I think that's exactly right. I think about what you were just saying Charles and Taras like one of the things that I think has a big impact on and what this process looks like is the completeness of vision for what's your project actually is. If you have a very, very clear idea of what the entire product you're building is going to be or, at least what the key money-making feature is going to be and you can understand the ins and outs of that, then I think that's the point where you can look at what you have and say, "Have I created a good or bad framework? Does this framework have the ability to solve this one very important thing that I have to be able to do? If the framework doesn't do it, then I need to build my own but I now know what very important features I need to front load my framework with." I kind of think of it as imagine that you're like Jeremiah Johnson, the Reverend Jeremiah Johnson and you're going to go trekking through the woods for some unknown amount of time and you have no idea yet. You don't actually know where you're going. You don't know what you're going to see. You don't even know what's out there because you haven't done the research or whatever and you need to be prepared for anything, so you bring just a hodgepodge of stuff. If that's you at the beginning of your company or the beginning of your product and yours is kind of like... I don't know, we got to get product market fit and that means that we may have to kind of pivot once or twice or we need to be very flexible, then I would think long and hard before you commit to writing your own framework because you don't even know what framework to build and you might as well take a broad array of tools and use what you need. There will be times where that's frustrating and there won't be exactly the right tool for the job but 80% of the time, it's going to do just fine but if you know you have to do this one very special thing and you know that a framework is going to give you a lot of stuff that you won't need and it doesn't really excel at the one thing you do need, then don't force the framework. There may be time to build your own but just know that you need to go in with a very clear idea of what you're doing before you start building the abstractions that constitute a framework, rather than just like a constellation of libraries. CHARLES: I have a question on that then. Going back to one of the things we were talking about like React plus Redux. Your opinion, Chris that it is not a framework, so the question is does a framework actually exist for React? CHRIS: My guess is that many frameworks exist for React. CHARLES: Is there a public framework? TARAS: There is one called Fusion but it's [inaudible] what you would have imagine. It is essentially Redux and React together conventionalized. They addressed a bunch of concerns around service rendering and such but it does exist. CHRIS: How about Next? Next.js? TARAS: I'm not familiar with its features from a single page application perspective. CHARLES: I think it does have a router. It does bundle with Redux and this is one of the things that when you first started using Redux, it's like, "How do I even get my store to my components?" Yes, I can connect them but there's actually a lot of stuff that you have to do. First, you have to say, "I'm going to put my reducers here and then when I create my store, I'm going to fold all my reducers. If I've got a whole bunch of reducers in my application, I've got to fold them all together. I've got to pass them off to the store. When I create the store, I have to inject the middleware and then, everybody else just imports my store and then, I have to put in a provider and then, I can connect my components." That's actually a lot of stuff that you have to do and I think that, for example, Fusion just says, "Put your reducers here and we'll take care of all that process," and so it makes that decision for you, right? It says, "For state management, you're going to use Redux. For your reducers, they're going to go here. For your actions, they're going to go here." I don't know exactly how it's laid out but I remember reading the ReadMe, it was basically layering conventions over that. That's definitely going into framework territory but that's the only one that I know of, which is really, really odd. TARAS: There's something interesting that's happening also and this goes to what Brandon was saying earlier is that choosing the best in class, there's this 10 things but then, what if one of the best in class stops being the best in class. The fact that the creators of Redux was essentially saying that we needed to basically provide a way to do Flux that was better than 10 different options that were available, so here's Redux. We've created Redux but we don't really think it's ultimately the solution. We need to have something else in React that provides a foundation for us to be able to deliver a better state management than what Redux is, so what happens when one of the best in class is no longer the best in class? The bridge is already standing. There's people walking across the bridge already. How do you replace one of the chains in it? CHRIS: Over the course of six months while you figure out the differences in API between Flux and Redux and all the custom route transition data loading stuff you did with your Ajax library in your state management software that you put in a case statement inside there that you now have to change over. It's easy. It's no big deal. Don't worry about it. BRANDON: Just a simple matter of programming. TARAS: At least 25 years of collective frontend development experience is laughing like hyenas about the simplicity of building a -- BRANDON: Yeah, I'm actually looking at some of the old code that Chris wrote for trying to glue together, Redux Saga. I've been out of the game long enough to not know whether that's been superseded by some new or best in class piece of technology and even then, it was really challenging. This is true for frameworks too, is they don't really optimize for best in class. They optimize, hopefully for best fit for purpose but the world has moved on since Ember launched obviously. A lot of things have changed and it's, at least as difficult to try to keep that up to date with evolving trends and technologies and updates for a core team at a framework level as it is for you, as an engineer on the team. The difference is you get to outsource that work to a core team for a framework. Ember has not done a fantastic job in keeping up with. They've done a good job and they've tried their best but if there were more people working on it or if there was more effort applied to it or if it was a higher priority, you would see Ember being a more up-to-date framework using more modern tools. As a framework author, if you stay too close to the bleeding edge, all you're going to do is change out your build system. You're going to replace a Broccoli with webpack, with Rollup, whatever's after that. What's new in Packer? CHRIS: Parcel? CHARLES: Parcel. BRANDON: Parcel. You should immediately go build your framework with that and have fun. I am excited by the new and interesting stuff that's happening in these ecosystems and I think it's important not to get lulled into the siren song if your goal is to actually ship a piece of software on a timetable or a budget. TARAS: One thing, if it's a red flag, if you think this is easy, if you think your decisions can be made in this isolation without talking to somebody else and actually kind of flashing it out, then you're probably doing something wrong because a lot of these things are not trivial. There's a lot of thought, there's a lot of considerations used to go into decisions that you make, especially when you're creating something that is going to be used by more than a few people. I think that's really one of those things where it's hard to know what you don't know but if you think you know and you haven't done this before, you haven't done this a few times before, you're probably missing some pieces. BRANDON: Yeah, I agree with that. CHRIS: I think one of the things that's really enticing about React and Taras, you just hit on it but I've never felt as clever as when I was writing a React app. If I'm clever, I mean, clever in the same way that I felt really clever when I wrote some unbelievably convoluted Scala one-liner that six months later, neither me nor anyone else could decipher what it meant but at that time, I felt like a god of programming. That's how it felt like, "Well, a lot of the React stuff is addicting." It felt so much fun. It was so much fun until I really had to do something and it mattered for my job and there was a deadline and people were depending on me and I've realized that the clever thing I had done a month later was not the right clever thing but I can see how, if you're like what Taras was saying, where you are at the point where these decisions are easy. These decisions make sense. We're going to be fine and you haven't done it enough to kind of like know where all of the pitfalls are. That cleverness that you feel is fantastic and I can see why it takes two years before you look back and if the cleverness was finally worn off and then, you're just mortified at what you've done. CHARLES: Pride cometh before the fall. CHRIS: Yeah. BRANDON: It's like being a dungeon master in Dungeons and Dragons, where you're like, "Oh, look at this fiendish world." All right, cool. Now, you actually live there though. I have to move into an apartment on Mordor. TARAS: You know what's the funny flipside to that is that coming from Ember world where it's so normal to leverage the work of other clever people, like really smart people who've invested a lot of time to solve a particular problem, is that there's no stronger sense of being dumb than having to write it from scratch in React. That first feeling of like, "I've actually never had to implement this from scratch," and I feel like a bunch of applications before but because I've leaned on for accessibility, I've leaned on something that someone else has done and it worked really well for me and it was perfect. But now, I need to implement autocomplete from scratch in React and I have no support. I'm basically learning as I'm going on this and it's that sense of discomfort that you get from having to do it from scratch and then, comes the euphoria of having to figure it out. But if you figured it out, you figured it out in the last month. You've written it for the first time in the last month and you now understand what all the things that the Ember implementation does for you. It's an interesting psychology of doing this -- CHARLES: Yeah, it gives you a lot of perspective but you have to ask as a business owner, who may or may not be technical and this is the hardest thing for technical people who are business owners is to be able to not see things through a tactical lens. Is what you really want to pay for is to basically give your programmers this kind of a-ha moment of their own shortcomings because that what you want to be buying. BRANDON: Yeah, you want to maximize leverage. Your goal with technology is to maximize leverage. It's like being hired as a chef and you walk in and then you're like, "I'm a terrific chef. I worked in these fancy kitchens in New York and I'm known as a great chef," and they're like, "Okay, cool. Here's some flint and steel and a spear." CHARLES: Go hunt. BRANDON: You're like, "Wait, what?" Yeah, yeah, yeah. Show me what you can do. TARAS: We had a conversation in one of the previous podcast with Michael Jackson and we asked him, "What is the one thing you wish like React community would do more of?" and he's like, "I really wish React community have more conventions." All of this is to kind of say as like, there is a place for frameworks in React world. There's a very strong place for it. The question is how and what it said and how do you actually build it and when do you --? BRANDON: So we need a framework for making framework. TARAS: Getting really meta here. BRANDON: I totally agree with that and that's a great observation and that was actually the point of my talk as well, which is if I could convince people just to use Ember and improve Ember, that would be great because I think it's a really great starting point. But the React community is much larger because it had such a great adoption story. The adoption of Ember was very difficult and the adoption of React was very easy and it expanded to include the scope of full end to end applications in terms of what people thought the problem spaces they were thinking of with React. Ember was built to solve that but it was hard to get into. React was really easy to get into but it's actually hard to build applications with. I would love to see a dedicated subset of the React community, except the idea of shared solutions and the philosophies that made Ember into sort of a powerhouse of value delivery but built out of tools that satisfy the React community and a little more modular and a little more available for people to customize and built in that ecosystem. I'd really love to see that that included all of the main components of what we accept as, "This is an application framework. It handles testing. It handles accessibility. It handles data loading," and it doesn't have to be best in class in every scenario but it does have to be a reasonable bridge across that chasm and have a group of people look at this the same way. I would love to see a collective subset of the React community dedicate themselves to this idea. I don't know if that's too culturally opposed or even orthogonal to what the value system inside the React community. I haven't been able to fish that out but I would really love to see that emerge. this is something I would love to push for and I'd love to see other people jump in and push for as like, "What if 20 of us got together and decided we're all building our applications in similar ways, instead of one person saying, 'I'm going to use --'" Even create React app is kind of a Band-Aid on that, it isn't useful past a certain stage of life. I would love to see a group of people, though, get together that are sort of like-minded like that, the Michael Jacksons and maybe even Dan Abramov or a group of people that shared that set of values or came into React from the Ember community. That's actually one piece of advice I would give to people. You said, "How do you convince this engineer that they've built a bad framework?" Use a decent one. That's the biggest guide. Use a decent one. Build something in Ember and ship it to production and go, "Oh, I get it." If you've used a good framework, you can't go back to rolling a crappy one. Your standards have been ratcheted up. CHRIS: I wholeheartedly agree that you should try something else and Ember is a great option but I don't want to dismiss just like, "React is cool as hell," and there's a lot of stuff in React that's really, really awesome and things that I wish that will show up in Ember and they are starting to show up in Ember but they're taking a while and it'll be nice in there but who knows when that will be but I would encourage even more so is both sides, like Ember folks who are listening to this podcast, if you have never messed around with React because you feel some kind of tribal affiliation that you can't betray, please set that aside and go do something in React because you will learn a lot about why Ember does what it does and you will see a lot of really interesting things that will probably jostle some ideas loose in your brain. The same thing goes for React developers. You, 100% should spend a weekend building something in Ember and nothing about that means that you have to switch or it's going to change the path that you're going on at work but I guarantee you, you will go back to your React application with some new and fair useful perspective that you didn't have before and that's okay. That's great. There's no identity crisis that will come about as a result of that. CHARLES: That is a fantastic advice, Chris. It will only stretch you. CHRIS: Yeah. BRANDON: I think developers have been sold this idea of a competitive landscape by authors of these frameworks because it helps sell the framework. You can build and strengthen a community by leaning into the tribalism that can surround the usage of a tool. The older I've gotten as a person who was deeply tribalistic about Ruby on Rails when I got into it and Ember when I got into it, because I love tribes, I think tribes are awesome and it's a way to make friends but when you really lean into that, the costs are too high and experimenting with other technologies and noticing flaws in your own technology is not only not a betrayal, it's actually critical to your growth as a developer. The more people that do that, like Chris was saying, the better both of those ecosystems will get. CHARLES: Absolutely because having spent as much time in React as I have, I really appreciate the precious things about Ember. It will make you appreciate the things that you hold dear. It will make you appreciate the really, really, really special things about the tool that you're using and at the same time, it will highlight the weaknesses which you can immediately use to feedback and make your tool better. It really is a win-win situation. TARAS: I just want to do a little plug before we close up. I think the feels of working with Ember is actually gone into microstates and we're still getting our things together to make microstates look accessible and usable by everyone but that feeling of pleasure that you get from working with Ember and just things just being there for you, like we really want to reproduce that and make that available in React community and the stuff that we do in microstates is actually really designed for that. CHRIS: Yeah, I see that in BigTest too as well. That's definitely another place where it's like, "These people definitely used to spend time in Ember and they're now in React-land." It's cool to see that stuff getting ported over. CHARLES: Absolutely because it fundamentally changes your taste. Working with an application that doesn't have like a bolted on testing framework is like eating water soup. You just can't enjoy your life. It really is flavored everything that we do. On that note, we can go ahead and wrap up. There actually is some pretty exciting news. We're actually going to be launching a BigTest launcher. Up until this point, you kind of had to roll your own using BigTest for your assertions but using something like Karma to actually launch the browsers and we're actually launching our own launcher. I guess we've written our own launcher and we're going to be pushing it to NDM, not to overload the word launch. You can look for that in the next couple of weeks. There's going to be a CLI that ships with BigTest to help you do even more set up, to make it so that you can just drop BigTest right into your application, whether it's jQuery, React, Ember, you name it. That should be really, really fun. Be looking for that and with that, if anybody has any other remarks... BRANDON: If people are coming through RubyConf this year, I'll be there talking about management stuff. That's my only near-future conference stuff coming up. Hope to see some of the more Ruby-flavored folks out there. CHARLES: All right-y. Definitely, go to every single talk that Brandon ever gives. You won't regret it. I can base that on very dear personal experience. You won't be disappointed. You know, not to put the pressure on or anything like that but you could never put any more pressure on Brandon than he puts on himself. With that, we will say good bye. Bye Chris, bye Brandon. Thank you so much. This is a great conversation. It certainly clarified a lot in my mind -- TARAS: Yes, same here. CHARLES: -- About these problems. With that, we will say goodbye. Thank you for listening The Frontside Podcast. Please get in touch with us at @TheFrontside on Twitter or contact at Frontside.io on email. We do a range of custom services from full stack project development to JavaScript mentoring, to as you go JavaScript help desks kind of stuff. If you need to reach out to an expert, please get in touch. Our podcast as always is produced by the inimitable, Mandy Moore. Thank you very much and we'll see you all next time.
Panel: Charles Max Wood Nader Dabit Cory House Kent C Dodds Special Guests: David Atchley In this episode of React Round Up, the panel discuss breaking up with higher-order components with David Atchley. David has been doing software development for 24 years now and has worked mostly in web development. He has worked at many places from start-ups to large companies and does client work currently for Tandem.ly. They talk about what higher-order components and render props are and when you would want to use them to help you in your code. They also touch on overuse and misuse of applications and coding tools and the difference between using render props and HOCs. In particular, we dive pretty deep on: David intro What are higher-order components? What are render props? Higher-order components are patterned after higher-order functions Connect from React Redux React What are the use cases for higher-order components? Redux Would you suggest writing a render prop instead in certain situations? Deciding to use a HOC or a render prop depends on the situation Think critically about the applications you are using Kent’s Advanced React Component Patterns Egghead Course Difference between render props and HOCs Build an HOC out of a render prop if you want to share code Context API from React Concern with new Context API Problem with overuse How do you help people avoid overuse and misuse? Unstated library by James Kyle Start developing code at the local level React Native And much, much more! Links: Tandem.ly React Redux Kent’s Egghead Course Context API from React Unstated library by James Kyle React Native David’s GitHub @Tuxz0r Tandem.ly Medium Picks: Charles I’d Pay You $500,000 a Year, but You Can’t Do the Work by Shelly Palmer Liars by Glenn Beck Cory CodeSandbox Live Babel repl React Cheat Sheet Fluent Conf Nader Shoe Dog by Phil Knight Nader’s Blog Post Kent Answers to common questions about render props blog post React’s new Context API blog post React Composer Brandon Sanderson CodeSandbox Live David React, Inline Functions, and Performance by Ryan Florence Build Better Products by Laura Klein
Panel: Charles Max Wood Nader Dabit Cory House Kent C Dodds Special Guests: David Atchley In this episode of React Round Up, the panel discuss breaking up with higher-order components with David Atchley. David has been doing software development for 24 years now and has worked mostly in web development. He has worked at many places from start-ups to large companies and does client work currently for Tandem.ly. They talk about what higher-order components and render props are and when you would want to use them to help you in your code. They also touch on overuse and misuse of applications and coding tools and the difference between using render props and HOCs. In particular, we dive pretty deep on: David intro What are higher-order components? What are render props? Higher-order components are patterned after higher-order functions Connect from React Redux React What are the use cases for higher-order components? Redux Would you suggest writing a render prop instead in certain situations? Deciding to use a HOC or a render prop depends on the situation Think critically about the applications you are using Kent’s Advanced React Component Patterns Egghead Course Difference between render props and HOCs Build an HOC out of a render prop if you want to share code Context API from React Concern with new Context API Problem with overuse How do you help people avoid overuse and misuse? Unstated library by James Kyle Start developing code at the local level React Native And much, much more! Links: Tandem.ly React Redux Kent’s Egghead Course Context API from React Unstated library by James Kyle React Native David’s GitHub @Tuxz0r Tandem.ly Medium Picks: Charles I’d Pay You $500,000 a Year, but You Can’t Do the Work by Shelly Palmer Liars by Glenn Beck Cory CodeSandbox Live Babel repl React Cheat Sheet Fluent Conf Nader Shoe Dog by Phil Knight Nader’s Blog Post Kent Answers to common questions about render props blog post React’s new Context API blog post React Composer Brandon Sanderson CodeSandbox Live David React, Inline Functions, and Performance by Ryan Florence Build Better Products by Laura Klein
Toran Billups @toranb | GitHub | Blog Show Notes: 02:23 - Ember 2.0; Data Down, Actions Up 08:28 - redux and State 16:39 - Dispatching Actions/Patterns 24:00 - Components and Routing 31:00 - ember-redux and Cloning the react-redux API 35:22 - Hot Reloading 41:22 - Audience 47:02 - Motivation 50:25 - Building Component Trees Resources: Toran Billups: Test-Driven Development By Example @ EmberConf 2015 Dan Abramov: Live React: Hot Reloading with Time Travel @ react-europe 2015 react-redux Charles Lowell: Immutability is for UI, You and I @ EmberConf 2016 redux-thunk Ryan Toronto: Safety of the herd EmberMap: Component side effects Functional Programming Browserify More Toran Billups Talks Transcript: CHARLES: Hello everybody. Welcome to The Frontside Podcast. This is Episode 55. We're broadcasting and everybody's here in Austin, although we're still remote. I am here with a really special panel today. There's me, which makes it special by default. My name is Charles Lowell. I'm a developer here at The Frontside. I'm also here with Robert De Luca, who also develops JavaScript codes at The Frontside and we have today [drum roll sound] -- I'm really, really going to work that drumroll -- Toran Billups. What's up, man? TORAN: Hey, man. Thanks for having me. I'm really excited to be here. CHARLES: Toran is with us today and he's going to be talking about a lot of things. He's going to be talking about today mostly about Redux and his efforts to meld Redux and make it useful within the Ember community. But first, if you have not heard of Toran, I think the first time we'd interacted over email, Slack briefly but then when I really, really saw you for the first time was at EmberConf, I think in 2015 and he just gave the most amazing talk on Test Driven Development and really kind of the focus on you can set up your acceptance tests from the outside into really define that behavior and set out that firm shell and then actually build your application from the outside in. You've really kind of been talking about that message. We like to have people on here who all about walking the walk. That's certainly the first thing that I've noticed that you were doing in the community but then more recently, you've been playing with Redux. Not playing with Redux, actually making a concerted effort to bring this kind of pattern into Ember. I just wanted to start out, how did you jump onto that track? TORAN: Some months after EmberConf in 2015, as you mentioned that talk was not only, probably the most well-rehearsed talk I've ever given but definitely the most well-received. I got a lot of people excited and really gave me a lot of opportunities that weren't there before that was also believe in that keynote in 2015 as when Ember 2.0 was announced. The interesting part of Ember 2.0, of course was we were using it, and it was called Ember 1.13, which actually made it really great. At the time, I was very much excited about the stability that offered. Other folks were not as much as interested in that idea or those values, in the JavaScript community so it's really exciting. Yet at the same time, there was this new mantra that was being talked about more that I knew nothing about. It was this 'data down, actions up' idea. I still remember as much as the stability was awesome, I also started to doubt not Ember core in particular but the ideas that were being espoused by other folks around the Ember core team because I didn't really understand the value. For instance, if I had the tree of components back then in early Ember 1.13 or 2.0 days and I had an Ember model or some kind of Ember object at the bottom of this tree, why would I not just do Ember.set. I remember, actually you may recall conversations you had with people at EmberConf around that time but there was actually varying definitions of what 'data down, actions up' meant to different people and actually never met the same thing to anyone. It was funny enough. Because of that, it sort of drove this fear in me that I didn't know what I was talking about. I was consulting at the time so I wanted to sound like I knew what I was talking about as you probably should. You guys are in that business so you know what I mean. Because of that doubt, eventually I sort of become apathetic to really trying to understand better what 'data down, actions up' meant or how components should be constructed and really what the wider impacts of Ember 2.0 meant. Because of that, I just found myself, not really loving learning. I felt like everything else in learning was a hyped up thing that would never happen or a hyped up thing that I didn't really understand or didn't make sense in the context of Ember at that time so I just kind of floated by. Everybody has their ebb and flows in the journey of excitement or not. For me, this was just the down moment. One of the things, like an analogy to this is when you lose your hunger in real life, you'd be very much like losing your hunger for learning. There's this interesting hormone that your body produces when you're actually physically hungry that kind of gives you the physical symptoms like your stomach cramps that tells your brain probably should eat somewhere. When those things aren't happening or that hormones not being produced, it's often because you've quit eating yourself. If you've ever gone on a fast or something weird like that on day three, your body quits secreting this hormone so you just sort of or not hungry at all, which is kind of weird. The same sort of thing was happening to me. If you ask a doctor or a physician, "What's the first thing I should do? I'm not hungry anymore." They'll tell you, "You just start eating." But I'm not hungry now so the same thing applied in my life and I think the first step really is just eat anyway. In this case, it was just learn something anyway even if you're not in love with learning right now. Eventually, your body will start producing this hormone, in the hunger example and for me, I just sort of got back in the flow and what came from this was a routine, which is really the second part of how you get your hunger back, not just eating once a day. I was eating three meals a day or more, especially if you haven't been eating. For me, I just set aside an hour a day, in addition to consulting work and things that would get me interested in loving learning again. The third component to this was trying something different. At the time, of course I was just doing Ember, I pretty much had done Ember since 2012 like some of you guys and I feel like there wasn't a lot of new. There was patterns and ideas but there was anything really challenging me. That's when I sort of looked around at the React community and I had done some React in the early days when I was super hyped up but I still feel vaguely different. Not that it's jQuery or any way but I didn't feel like this fully encompass single page out framework. The reasons I got into Ember very early on were that I wanted to build rich single page apps. If you guys remember from the early React days, that also wasn't really the messaging with React and maybe today with View. In fact, that's kind of one of the benefits or they speak to in those communities about why you use React because you don't have to use it for your whole app. You could kind of piecemeal it in, which totally cool. You got to see it out with Ember too. But in my mind, I just wanted to build a rich JavaScript lines that could compete with the iPhone or the iPhone apps that were popular in that day. Through this process, I started looking at React and really just kind of get back into it again, get going again. I wasn't really in love with it but I needed to try something outside of the realm I was used to. As part of that, I noticed there was this talk by Dan Abramov, I think he works for Facebook now, big in the React community, of course and he gave this talk at a conference in Europe that introduced Redux. What's funny, if you find out or dive deeper into that story is he actually pitched the talk, not really having built any of this and just thought, "This sounds like a great idea," and then of course the talk was accepted. Like most, he delivered on that promise and made a great talk. There are definitely courage folks to check out and I should link it to you here. We can show noted that, I'm sure. That talk make me excited mostly because there was a lot of whiz-bang. If you guys remember any great talk you've ever seen, the talk even that I gave at EmberConf that you mentioned, Charles the thing that blew people away was this very end moment that, of course I had produced to be a great moment. In the same way, Dan during this talk introduced some new ideas or new to the JavaScript community. One of those was the tooling that can change when the state doesn't change in your application. That got me sort of piqued my interest, in part because I was actually big test driven guy and I thought, "I won't use any of this stuff. It just seems cool. It's a gimmick. Tester development is how you really build app." If anything I thought to disprove it by getting involved and learning a little bit more but what I instantly found was the simplicity of data changes rerender. That sounds very high level, of course but it was almost just that simple, instead of being like how does this change to an object in my array, bubble out through notifications on the Ember side and notify the Ember change detection to rerender. Well, I'm not entirely sure so when I was start debugging that, I noticed a lot of framework code between me and the rerender. It's that's how Ember is, right? When I boiled that down in jQuery with vanilla Redux, not even using React at all, I was like, "Wow, there's just a call back. I wonder why I haven't been doing this." CHARLES: As a single callback for a global state? TORAN: Correct. CHARLES: So there's no call back for every single path in your tree. You just used that one call back? TORAN: I'll fill in for Rob here. I know he's jumping at it. You should probably define a Redux is. He's really good at asking that question. Redux in this case, for me is just a global JavaScript object to use to hydrate your templates. They'll give you some big spiel about state container, if you go check out the website. But for me and in this context of being on an Ember-centric sort of podcast, we already use this idea in Ember today. If you're just feeding your templates from some high level service, it's a very similar idea in that Redux is just a single service. In the Ember case, especially you can talk about the add-on, I maintain later, but really it's just a service with a single object that will help you populate all of your components. ROBERT: Yeah, I love Redux. I actually sort of coming into the Redux world, probably to about six to eight months ago and it was around the same thing like exploring React stuff. I share similar opinions to you as nobody really can define 'data down, actions up'. I also think that 'data down, actions up' cannot just live in the component. In a lot of the Ember apps I worked on, there's times where I'll be looking up to get a new state and it comes in from the side and something's mutating, something that I have no idea why and where it was mutated and Redux does a really good job at helping you manage what changes and why it changed. CHARLES: I have a question too. When you're actually using Redux, you said you got a single tree that you used to hydrate your templates. In the context of Ember, where do you maintain that single object? I assume you have one store, one instance of your Redux state per application? TORAN: Correct. There's just a service like you imagine in the Ember data service and that holds on to really just an identity map or a single graph object that will let you pass or pull that in by injecting the service into your components if you want to do that or your route then just asking for that state. CHARLES: Because I think that for a lot of people in the Ember community certainly, when I was kind of grappling with these ideas, the idea of having a single global object as your state seems so counterintuitive, so going to go against everything that we learned, that you have to decompose a problem into its component parts. Obviously, Redux has an answer for that so how does that work? How do you decompose that state into saying, "I'm just interested in this kind of local state." How does local state work in Redux? TORAN: I should define local state is state specific to the component. It doesn't need to bleed up and has no value at the global level. CHARLES: Usually, I got two components. Let's say, I want to store both of their states in the Redux store. Obviously, component one is not interested in seeing any state that's not related to it so it's only interested in its own state and it's not interested in any of the surrounding context. How does that work? How do you connect a single component or connect a route to the store? TORAN: There's really just a simple method on Redux -- the Redux store itself, which it says, "Give me the state." What may not sound great at first is that it say, "I will give you all the state and that is your job to pull from that or map three attributes from that whole tree into my component." Then by side effect if you're using our add-on or if you don't React-Redux, you actually subscribe then to call backs on any of those changes so if something were to be bumped, then your component is given the opportunity to rerender during that call back. CHARLES: Now, in terms of Ember-Redux, that kind plumbing is hidden from you. You don't actually have to explicitly map that state. You can say, "I want to connect this component into the Redux store," and you're just off to the races. ROBERT: Is there a mapStateToProps or... I don't know what that would be called in Ember-land. TORAN: That brings about interesting point. I literally copied this API that you guys are probably looked at from the readme from this very popular project in React called React-Redux. The word that you're using, Charles is this word connect. Actually, I like that word because that's how I think about it. I want to connect the components to the single source of truth and then respond by rerendering when something changes. The API is actually very similar on what you said, Rob. In fact, the set of mapStateToProps is just map states to computed, which is very much the same idea so instead of really defining the component like you might normally, this is where it gets a little weird for your classic Ember developer, you actually just write two functions and really only one is require. The first one is what you're hinting at Charles, which is I want to pull from the state a set of properties and as you mentioned, the plumbing is sort of hidden, magically those are actually created as CPs or Computed Properties on your component so you can go to your HPS file, your handlebars template and say, "Oh, I took number from the global state and I'm just going to map it in this function and now I can go to my handlebars template and number," and there it is. Every time you bump number up or down, you'll get a rerun in your callback and the HPS will update. The other function, as sort of glossed over is really just for your closure actions. If you would like to ask the store to do something and saying, "I would actually like to increment the number," then you can fire an action and the second block just does also additional magic, which just maps a closure action by letting you get this dispatched keyword. Dispatch in a Redux context is just, "I'm going to send an action," and you can think of it almost in vanilla JavaScript terms as, "I have an event. Someone will handle this event and I'm just going to throw it up." ROBERT: It makes its way to reducer then from there, right? TORAN: Correct. We haven't talked too much about that process. The reducer really says, "I'm going to be given a state or the initial state, if you haven't done this yet," which would be maybe in the number scenario. I'm going to start with zero as a sensible default and then I'm going to have an action, whether that's add or subtract in this simple example and in add, I'm just going to take the state coming in, even if it starts out at zero and then do something, transform it to a new state. Actually the important word here is that -- I know you guys are big in the functional world, functional programming and that's the word actually got me interested and really excited about programming again as well, in the most perfect sense -- a pure function, which just means that there are no side effects. There's no mutation or changing of the state that comes in when you do it correctly. In this case, actually instead of mutating something I'm actually returning to number two or to number one and you're like, "Now, we have both zero and one in kind of a timeline." If you think about this almost as the realistic stories, we're just kind of kicking a pointer to a new block of state. Every single time you come to reducer, we still have the old state and we can still walk backwards, which is how the time travel debugging works as we just flip the pointer back in time. As you guys have talked about and I think, Charles you mentioned last year in EmberConf, the immutability story has of course a whole slew of great properties that come with it and those we haven't even obviously talked about. But hopefully I gave people a broad overview of what the reducer does. In its most simplest form, state comes and action returns a new state. ROBERT: Yeah, in Charles's talk and his research, I got to sit next to him and watched him do that actually kind of shaped a lot of my thinking and hunger, if we want to keep that going towards doing like something that's immutable and state management in Ember. I would like to thank you, Toran for building that add-on and spearheading Redux because Redux is pretty awesome for state management. CHARLES: By the way, you did in that call out the analogy for hunger. I really, really, really like that. It's an important tidbit not to miss is that when you are feeling those kind of doldrums of development. I know I was actually ironically feeling that about the same time in 2015, feeling of in a funk because I feel like there was a lot of stuff coming down the pipe like with 'data down, actions up' but no good examples of where we've actually seen this in practice. I think Redux is an actual implementation of 'data down, actions up' so I think it's fantastic that you were able to go and seek inspiration there like, "We've got this message of the way things that ought to be doing with the applications ought to be built." But we don't actually have any concrete examples that we can look to. I think the Redux actually is almost the most pure version of that 'data down, actions up'. I guess my next question is given that you've got this global store, you've got a way to connect components. I assume there are other ways to dispatch actions from within your Ember application like what are the patterns that you're seeing emerge around this? We've talked about how you would use them in components. Suppose my tree of components gets pretty complex, how do I manage that to kind of the passing of data down? Do parent components play any role in the data that their subcomponents see? Is each component connecting directly to the store? I'm just kind of curious where that balance lies and how things are kind of playing out? TORAN: There's really two points in your bigger question. One that I was going to try out of you but then you kept going. That was really around side effects. How do you actually dispatch or make changes, requests changes and see the flow and we could talk about that really starts out briefly with a Promise based approach. With Redux, most people don't know but it's basically like asynchronous flow. Dispatch would normally be like asynchronous action where you're sort of blocking and then doing, transform and getting it back. In the simplest ways, you see there is this tool or this add-on, Redux-thunk, which you can use Promises now and async will still work as if it were synchronous essentially by firing dispatch up and letting your reducer do the work. I think that is a great introductory because especially as Ember developers, we've got a lot of experience with Promises so this is just the same thing. In most of the demos I've done and if you check out the read me, there's like a full Yelp Clone example. It's using this approach because it's a little bit more familiar to most folks. CHARLES: Just to clarify what would happen there is you're essentially getting a new state transition when every Promise resolves or rejects. If it's rejects, that's a state transition. If it resolves, that's a state transition. The next Promise that resolves is another state transition. Is that fair to say? TORAN: Assuming you want to alter and use that top level state, of course you could reject or resolve and just not even bother with the top level store. We kind of skipped over some of the benefits and we could just roll back to that briefly. Why would you use top level stores at all? You mentioned earlier and it kind of seems counterintuitive. This is basic global variable. That's what we're talking about. In the Ember example, I think it's actually sort of not weird because if you guys, your Ember data in its earlier form or even today, it really very much is that. We have this one cache of objects related or otherwise and we pass those around. They are a global object or almost like a global variable. The downside of that in my experience has been that is truly mutable and actually everything is driven by mutating those and then having callbacks or denotify property change drive your template updates. That is not the process with Redux, of course. It feels more explicit, where I can actually go look up kind of a tree or look up table of actions and see exactly what's going to happen. Then also to your second half of the question, which is like how was the components wired up? How do they map? I actually uses an interesting pattern which isn't specific to Ember-Redux or Redux, which is to create a seam in my components now where I have truly HTML CSS components. Separating those from the components and know about the data and the closure action story. Forgetting Redux for a moment and all of this actually made my regular Ember much better because I started to produce this component that would connect to a Ember data store, provide closure actions to send up in the most pure 'data down, actions up' sense and then I would connect it using the yield block, which credits to you and other folks at EmberConf that you, Charles kind of talked me into this because I was a espousing this idea but I didn't really understand that I would actually nest within this parent, the HTML component that would just be handed the properties to render. When we do this, again it still is I think a better pattern even if you're not using Redux but when we did it and I when I started with Redux, the only thing that really gets me in hot water is when people see this and they're like, "Oh, so this is the first thing that comes down from the routed controllers template. Then there's always this brief moment of like, "I'm not sure what to say. I don't want to predict the future and I'm not trying to be Mr Routable Components here." But for me, most of my controller templates are just a landing page for the component tree to begin. Again, that's not me trying to hacking the route or anything to say, "I want to use this controller as a routed to component. I think eventually when that RFC lands, this will look different, anyway so I'm not trying to have people do things really outside of the Ember ecosystem or outside of the norm." But from there, I feel like still just landing into a component, allows you this composition which is supposed is the real value of the components structure. They are too primitive to build pages and then eventually full apps. ROBERT: So if we want to drop parallel, it's container versus presentation components, right? TORAN: Yes and that of course, again stolen from, not me probably stolen from someone else in the 70s. But you know, Dan Abramov is accredited to bringing that idea about in React. Actually I like the idea because let's pretend I had done this pattern in 2013. Now, it's using Ember data or simple store or Erik Bryn's Ember model, something like that. Then eventually, the community start shifting to something else. It could be MobX, it could be Redux and whatever the case, I could just very easily swap out those connected components that have no HTML CSS. The data source changes and all the presentation components do not know. They do not change. There is actually an iterable story to refactor through, an update like that normally is kind of a [inaudible]. If you have ever done PHP in the early days or at least my PHP experience in 1999 -- no offense to PHP today -- was that everything was so stuck together or so couple that I could never refactor anything out of it. Of course, you probably do this in a consulting space as I have, where he first thing on a messy project is actually making those scenes in the application anyway to allow you to upgrade incrementally. This process is just more of an upfront thought and I don't think it's really taken hold than it needs to in the Ember community. It's just something I was experimenting with and I'm finding a lot of value because I think the connection of the data source is a different activity than HTML. ROBERT: I think it also holds a lot of value. CHARLES: I think it holds a lot of value. I think there's a dawning awareness of this. In your comment, I actually thought of two blog posts for EmberMap, which I was just reading this morning. One was talking about kind of the safety of the herd and don't worry so much about controllers versus radical components like use your controllers, use your components. Don't worry about it too much. It'll get sorted out. I definitely agree with that. Although, you definitely want to experiment when you're experiencing particular pain around something. But then, the next thing which I think came out yesterday was talking about basically components for managing side effects, which I think is an unfortunate name because I think side effects is a tainted word. But basically, the idea is having presentation components and container components and the container components are responsible for managing the state. I think that idea is valuable in of itself and I hope that it takes root. I think that's something that you're doing, something that we're doing and as people kind of realize it, it does take root, just kind of by virtue of its own value. Let me summarize if I understand it correctly. As part of these job, you've got these container components and their job is, I like the term that you used, creating a seam. Their job in the Redux world is to take a slice of that global state. You have these components whose responsibility is taking a slice of that global state and presenting that global state to HTML CSS aka presentation components that lie underneath them. Is that a fair assessment? Then if that's so, I've got a second part to that. I just want to make sure I'm understanding it correctly. For components that are further downstream on that tree, do you ever switch back to data containers like you switch between data components and presentation components and then back to data components and then to presentation components and kind of back and forth and back and forth on down the tree? Or do you mostly see it as one-kind of container component on top and then presentation components all the way down? TORAN: It's a great question. I think that still needs a fair bit of experience in the Ember community because the patterns I pulled from the source code I read a lot is mostly from the React ecosystem. Because of that, there's a very split view or a different view in that community on routing. We may share some of those views in Ember but I think for the most part, we assume routing actually and that's one of the tricky part to answer your question. This is a broad statement so I'm likely wrong in every context but I don't love to be creating these data components that don't get routed to if I can help it. I'm sure there are situations that have been really complex, places where you just have to make, no route here because I don't want change the URL for instance and I'm just going to make this thing like a routed to component with no URL to get me here. But for the most part, I treat the entry point to this route and when I land on this route at this time, it's appropriate to ask for the data likely coming from the model hook in the route. In fact, all that's still the same. That's also where it's a little weird. If you've ever seen a full component tree in a React app, they may not have a router at all. In that situation I think, Redux was in particular even better because you don't have to pass from the top app component, the same props or the same data all the way down that tree. In fact, if you read documentation about why Redux in the React ecosystem they'll say, "It gives you this place where we can create a little shim and then ask for the data down here in the [inaudible] mode. You don't have to pass it from the app to that, to that." I see those benefits but in Ember we don't really get as much from that. In fact, they still tell people who challenged the global state idea that not everything maybe should be a global state but you give up some things by doing that. The first one I would say, which I think is the most valuable for anyone doing vanilla Ember with Ember data or someone experimenting with React or Redux. Or the case I'm most interested in, the audience I'm after which is Redux in Ember, which is do you actually need to have that state in one place. The prime example of this that is the greatest use case is master detail. What I mean by that is you have a list of things and when someone drills into one of those, you can also see that at the same time. There's really two choices you can make here. One is I'm going to have two separate data sources to feed two separate components so the list will go get its data and then the detail won't even use that data at all. Just go get its own data. In that case, you may up against a problem where you need to synchronize at some point and here's the tradeoff. Either synchronize the two separate states or you have a single source of truth. That's a real benefit I think of Redux for the most part. It's like the broad, "Do I want deterministic rendering?" We've all heard the joke about the Facebook nav bar that's like, "You have one message," and you're like, "No, I just answered it down here." Well, that's a different component so the joke is like, "Oh, Redux must be working. We have one up here but I've already read the message." You know? Someone obviously is in charge of synchronizing in those sort of examples. Maybe not just doing it well or they run up against an issue synchronizing that. My experience doing back end development, colors this for me. What I rather have three databases and they kind of synchronize the state across them or I rather have the one postgres or SQL server database that is the source of truth so that when I render something to a customer, I can guarantee that it's not in a transition to be synchronized. It is the source of truth. CHARLES: Right, I really like that and I think the point that I take from that is that, and again this speaks to people who might be internally reacting to this idea of a global state is that you actually do have a global state always in your UI, whether you acknowledge it or not. It's composed of all the other distributed states that are sprinkled around your application so if you take an approach like Redux, you're kind of acknowledging that upfront that at any given time, I do in fact have a global state. I might as well deal with that explicitly. That's kind of a key innovation. I also like what you said too about kind of treating the router in Ember really leaning on the router as a good way to partition your data or drill down into a sub-piece of that global state. Inside Ember-Redux, are there explicit hooks for dealing with the Redux store inside your routes? TORAN: Yeah, that's that one that gets me the most trouble. When I see a blog post and memes that are all about the herd lately, can't help but feel like they're pointed directly at me because of some of these new ideas. CHARLES: Toran, I'm just telling you. This is a safe space. We believe in innovation here. You're okay. TORAN: Yeah. CHARLES: Let me add-on that. I didn't mean that as a knock to you. I do think they call this out of the end of the blog post. I think acting in concert with the community for the most part, actually fosters innovations and an innovative journeys like the one on which you're currently embarked because you don't have to worry about CLI tools and you don't have to worry about this. You can focus on the problem of like how does an Ember application work with a global atom as its state. TORAN: That is the idea. I mean the route is interesting. I have a little helper to your point, Charles if you've seen some of the docs or any of the examples. There is a little helper for routes and all it really does is provide dispatch as an argument. For instance, a lot of times I just want a model to be a regular function and dispatch to be an argument so I can return a Promise or do some Generator stuff as a side effect. In that way, I sort of create a shorthand which is just really simple. It allows me to say [inaudible] model and then have dispatch as an argument and run my code then just providing that to this special little helper. It's a functional type helper called route and what it does behind the scenes is it injects the Redux service for me, which is again something you can do by hand. If you really just don't like that or you want to be more in the herd, you can just have a regular route, inject the service and then get dispatched from that service and use it. ROBERT: It looks like you just dropped the version 2.0, like three hours ago. I would like to ask, we heard about your journey like you were feeling like you weren't hungry for learning. I want to know more about where you actually sat down and wanted to write this add-on on and why you chose to clone the React-Redux API and what took you on that path? TORAN: Yeah, that's a good question. Back to benefits or the reasons I got excited about, of course I mentioned during the talk that Dan Abramov did. There was some interesting dev tools. First of which was this thing Time Travel Debugging which it allows you to sort of move backwards in time and pretend as if actions and mutations or what looked like mutations that never occurred. That was very interesting. I wasn't really sure of the value, especially at the time. I told you guys around 2015, I was consulting which lucky me, I was doing Greenfield. Thankfully, I was working with a really great team and some great people, built an amazing product. I don't really understand the pain of this. For the most part Ember-set was doing its job and I didn't really have a lot of interest in learning this. But as I got more into it, also started a full time job last year, I pretty much just fix bugs for a year. Anyone who's been on one side of the fence or the other knows that the bug fixing side will sort of expose, maybe the weaknesses of the application or patterns or choices made. For me, that was really mutation or shared mutable stake aka the root of all evil. If you've ever looked at your Elm ClojureScript, Elm next is the same vein where immutability is very much there. Charles, of course gave his talk on immutability and trying to get people interested in that or more interested in the Ember community. That was really all I wanted to do to your point, Rob was provide really an outlet for people to use this and I wanted to keep the messaging away from the things I didn't like, which I think was actually something I screwed up to be fair early on. I think I was very vocal in the microcosm that I would talk to people about like, "These are the things I don't like about Ember," or I would use the word 'Ember the good parts' plus 'Ember the bad parts' and I was told not to say that anymore on the Slack channel. Once I started getting too much needed feedback -- I don't want to be negative about it -- I changed my messaging and as part of that, you mentioned Rob I basically cargo-culted or copied this API from React-Redux called connect and excluding the brief route helper that I mentioned, Charles a minute ago, the real idea here is you just call disconnect function with two other functions: mapping state and closure actions. Everything else becomes then vanilla JavaScript in this reducer function we talked about briefly where I have state coming in and I need to transform it into a new state. One interesting benefit of that -- I wasn't overly critical about until I really saw the difference is that -- I'm no longer using the Ember object. I'm not doing Ember.get and set, which immediately start to open the door some time last year for TypeScripts interest. I'm actually not a super type friendly person. I sort of left Objective C and C# and Java in my background and have like this Vietnam experience when people ask me about types. But I do understand one very critical fact that I can't dispute about types is that there are more information for the next programmer than you have without them. Again, my experience this last 12 months has been, as a maintenance programmer, I need more information. Tests are great when they're there but they also don't provide the interface or all the information about those and certainly the compiler may help as well. I don't know yet. I'm not doing any TypeScript. What I started notice is also more functional programming and maybe just not in our core yet but also things I wanted to steal from other ecosystems because I also found is very interesting. I started to study functional programming. I know like nothing about it, of course. I don't think anyone does because I can't describe a monad without getting in trouble or being wrong. For me, the real value is the separation of the data structure and the function. I'm preaching to the choir here but that was so much like an interesting idea to me and actually spurred on some of the further patterns or adoption of those in my work in Ember-Redux because this presentation and container component idea was really that I was separating the data structure from the function of the view. I think you mentioned this in your talk at EmberConf where the actual HTMLbars template is really just a function that has data in, HTML out. I started to internalize that and think about that and what were the properties I got from that, as well as I enjoyed functional programming. Some other great benefits that we've already touched on briefly are just how much more of this I felt explicit, not that Ember-set is inherently implicit but when you do a Ember-set for mutation to chase down every single place in a complex system to determine why they something render this way? It does feel a little more implicit than something like React-Redux with this connect function where I was like, "Wow," when I was doing React. Especially, I was like, "I bet I could just put a breakpoint at every connection so when that callback happens, I can know exactly what action spurred on this new callback to rerender," and that was something that was very new and interesting. Then of course, falling out of all this was another hyped tooling thing that I thought was really cool, not explicit to Redux, again but it got me interested because that's hot reloading. All hot reloading of CSS and Ember CLI, which I've never done design work which I'm not good at. But I do write some CSS or hack-on it when friends show me what to write. Then writing HTML was a separate experience. Once you wrote the CSS, you would hot reload in that course, what do you do every time you change CSS, you also change HTML, which would incur a full-page reload with a live reload tool, if you're familiar with that in Ember CLI. This tooling allowed the Redux store itself because it's stored the state, allow me to really throw the component away in the page without refreshing it and then providing a new one and just go rerender because the state was instantly mapped in and then rerendered. I actually did a demo sometime last year and like, "I'm going to build a star rating component and here it is with live reload. Here it is with hot reload. I'm not going to make a decision about which one is better. You decide," and overwhelmingly people were like, "This is a much nicer feedback loop to make HTML and CSS changes in real time." ROBERT: Agreed. Let's pedal back the hot module reloading because that is pure awesomeness. But that has a little bit of setup they have to do and changing your application. I remember we were talking about this. When you did that demo, I remember this. But there's a little bit they have to do to make your components stateless. They have to come down from the Redux store. TORAN: Correct and this actually still applies if you are, I think using Ember data as well, as you just can't pull the state to reload it anything local, which may go against what you're trying to do with your component. ROBERT: Right. That's cool but I do want to highlight a little bit something that was cool about the Redux dev tools as with all the state that you have since it's in a centrally managed place, you can take your state and then play it back over the top of something like if it did live reload and it'll just pop you right back down to where you were when you were debugging. When that page refresh happens, if you're not doing hot module reloading, you still won't lose all your state which is really cool. You just play it right back down on top and you're exactly where you were before. It's almost like you would throw a specific test that puts you into that state that you're trying to debug. TORAN: Yes, it's like git rebase. It lets me pull off my state, replay the new component function and then drop my changes on top of it and see it all viewed together. ROBERT: Yeah, I think that's massively powerful. CHARLES: Yeah, it is fantastic and that's where you get into that power. I can get on my immutability soapbox. But it turns out that as programmers, we deal in information and not throwing information away, not just flushing it down the toilet is hugely powerful. I think the thing that's so fantastic is that Redux takes this concept and then all of the tools to leverage it are there for you. I think that it is something that is missing from the Ember development story and people don't realize that it's missing, that we have all these wonderful tools, we have this conventional way of building our applications, of deploying our applications, of rendering our applications, of marshalling the data in our applications in the form of routes. But what we're lacking is this unified atomically based state management solution. I think that, Toran it's been fantastic that you have pioneered this and trying to bring what I see as a glaring gap in the developer experience to the community. I'm curious then to ask you what do you see as the future. You know, 2.0 just dropped and there's this need. I feel very strongly that Ember 3.0, 4.0 or Ember 'dot future' at some point should have a unified state management solution. How do you see the road that you're on intersecting with that future if it does in fact exist? ROBERT: Also how can I help or how can we help? TORAN: Just real brief before I dive into some of those questions. I just want to mention that 2.0, as awesome as that sounds, of course I dropped that this morning just so we could say that on podcast, really. We've had a beta in the works for Ember. The only change really, if you're like, "I just got into an Ember-Redux last week. Is it all garbage?" No, this isn't Ryan Florence 2.0 -- it was a joke for any [inaudible] router folks in here. Actually, just us removing Browserify because if you are familiar with Browserify in the Ember ecosystem, talk to Robert Jackson or Stef Penner, folks familiar with that in Broccoli, they'll tell you that one of the harder things to optimize and although, it created a great entry point to how do I use Redux? Boom! Ember Browserify, install Redux, I'm done. If you've ever seen an [inaudible] in Ember that has 'npm:', you're using Ember Browserify to pull in, either a common JS module or some kind of node module and use that in the Ember ecosystem without an additional shim. Now, what we found or learned was that bigger teams that are using this, paid a little bit of a cost and not just cold rebuilds. I'm talking hot rebuilds because Browserify just isn't friendly to get those to be optimized, I guess is the word, so we removed it completely or just use some smaller simpler shims. You actually get the performance improvements hopefully -- ROBERT: That is awesome. TORAN: -- Which is big win. Back to your question, Charles. The audience that's intended, of course is a little different than most people like me to talk about. In fact, the API itself, I think was a bit rejected. You're sort of asking like, "What does this mean in the future?" I don't really feel that the traditional Ember audience has picked up around with it because of something that's missing. You said the 'C word' earlier so convention is certainly still missing from this and even in the React ecosystem, they're just barely thinking about, "Look at all this great stuff we can do with one-way data flow and immutability and functional programming," but guess what we're giving up. No one's really come around with this perfect pattern and conventionalized it as Ember did in its early days so there's a lot of churn, I wouldn't say overly so much that you're not going to getting work done but more than the average Ember developer is aware of. My audience is actually not the average Ember developer, which may be bad for what you're asking about, Charles. Instead, it's actually the person who maybe has done React and maybe Redux or Backbone in the last two years. They love some of those patterns. They're not in love with the Ember-object because of getting set. Maybe they love TypeScript and they say, "I want to use this in Ember." They joined a new company that's a little larger than the startup they'd been on the last two years and they are using Ember. They love a lot of Ember but they would also like to use some of the predictable state patterns that you get with Redux. As well as maybe the dev tooling, things like that so they have adopted this. I feel like that really is the new audience that I aim to please or I'm falling in line with, which is a little bit outside. I feel like there's room for some fragmentation and a good beat up on me for that because when the realities of this herd conversation that we're kind of talking around a little bit is that the herd is great until something innovative needs to happen. Innovation, obviously takes some risk and I feel like that's sort of what I did last year and said, "Here's some interesting ideas. I have not shipped Facebook with it yet so let's just check this out." Of course, Ember add-ons are a great way to enable someone to try a new idea. But I think most people got into it, saw this funky connect thing and they're like, "What the heck is this?" It's a function and returns a component. All right, that's not doing that so most people bailed out. But I do hope people still and I know great folks at LinkedIn, Chris [inaudible], of course. We chat occasionally. Mostly he just tells me what I'm doing wrong. Shout out for Chris. But he knows a lot more about some of the stuff than I do and I think he is fully aware of the values that are in Redux that are great and then working hard, of course during his full time gig to apply these to Ember data and hopefully these do make their way in naturally. I just wanted to be a bit more radical. I don't want to wait around and I wasn't really involved in the Ember data project. My own fault there but I think if nothing else, the ideas will come out of it because the developers want this. Whether you're the audience I'm talking about, which is a React developer from two years ago, you're in Ember, you're eventually going to really understand and want this and then those 'data down, action up' ideas that were pretty unclear to me in 2015, will be very clear. In fact, if anyone seen or heard of this Project MobX, which is like an alternative in a way, popularity-wise to React ecosystem. It kind of looks like Ember in a way where you get sort of some more magic and what I found quickly in playing around MobX is that you can very much fall into the shared mutable state problems. The interesting part about MobX is you can opt into a strict 'data down, actions up' approach. But if you don't have the Ember battle scars like we do, you're just going to come in and say, "What's less work?" Just like in Ember when I can do a set in the [inaudible] node, why would I do 'data down, actions up' and that's the transition I want to see folks make. Hopefully they learn something from that. CHARLES: Right, I agree with you. Although, I think the time has definitely come, I think the term 'herd-mentality' is an unfortunate one. I prefer to think of it as like a pack. If you travel as a pack, you can bring down moose that are bigger than you are individually. But every once in a while, like a gigantic moose with laser horns shows up and then what are you going to do? If you're hunting as a pack, you have to introduce new things because I like that analogy a little bit better than a herd because the job of the herd is just to not get eaten, where is the pack has this idea of these entities that have to stick together. They're hunting and they're tackling different problems as they come but sharing in the benefits. But I think that there has to be room for innovation inside that herd/pack-mentality, whatever you choose. I do think this idea needs to be introduced so what I would say is that if you're listening to this podcast, you should actually go and you should try and use Toran's add-on and you should try and build something with it so that if you have opinions about how it should fit into Ember, then we can hear them. It sounds like you're taking a minimalist approach, you're emulating patterns that are proven to work in the React community so kind of enabling that seed cross-pollination right there. I would say go build something with it, experience what it's like to have your state as a single atom, experience what it's like to have incredible development tools that come along with that. I think that if you're in the Ember community today, you need to go build something with React, you need to go build something with Redux and you actually have made it one step easier to do. You don't even have to leave Ember to do that. You can build something of node with production quality code using Redux and you can experience what it's like. That's my challenge, I think to the Ember community. Go try it, go experience it because you'll come back, I think like I did. You'll come back with superpowers just from having tried that. ROBERT: Managing state becomes so easy. TORAN: Yes. I want to jump in briefly and just cover one point that we haven't talked about that's very controversial so why not drop it at the end here. I think, Rob you might have asked about it earlier and I just didn't feel brave enough to talk about it at that time. But you guys keep going back to this idea and I have to talk about a little bit too. One of the motivations is I live in Iowa. I work in Texas. Thankfully, this great company, Q2 employs me and I don't know why I'm being paid. I'm lucky to be writing JavaScript for money, probably we all are. But in the Ember local community that I'm in, a very little folks writing Ember and that was even years ago. I was like the only voice in the middle of the Midwest screaming and then folks in Minnesota would tell me that wasn't true so I went up there and did a conference as well. But for the most part, I looked around the job market too and thought, "It be really great if I understand some of the more JavaScript-centric parts of building web apps today," and when I looked at Redux functional programming, the way the reducer worked and structured, the way to React-Redux project was structured and thought, "I bet I could emulate that an Ember," such that I could actually and I believe this is to be true, that if you were in a React-Redux project or even an Angular like ‘ngRedux', which is a very similar connect binding, you could copy a whole directory of your reducer code, which is all vanilla JavaScript. If you're doing generators, which we didn't talk about but if you're doing you know any additional side effects, you copy all that vanilla JavaScript, drop it into your Ember app and it all works because it doesn't matter if it's in React or Ember or even Angular, even View if View has some connect API like this. We all share this common API that is just give me the functions that enumerate over the data and return new states of the data and call back to rerender. There's something really powerful about that but the tradeoff being there are not a lot of strong conventions, Charles that I have adopted. That's kind of what I'm cautioning here a little bit is that I'm still also just watching the other communities to see what eventually turns out not. This is going to be am Ember add-on and I don't care what everyone else is doing. This is my vision because really my vision was to make a drop in for anyone already doing Redux on any platform. CHARLES: You know, to the point, there's a pack that extends beyond the Ember community and it sounds like you're also leveraging and being a part of that. TORAN: There's an interesting idea about the hunger thing, which just tied us in and there's where the fourth thing that a doctor will tell you to get your hunger back is go experience eating with other people. There's actually a statistic that when you sit down to eat with someone else or many people, you're likely going to eat 44% more food than you did on your own. That's just, I guess a statistic that's true. I just made it up for this podcast. No, I think it's true. If that is the case, then I think that very much translates to programming as well where when I'm developing code with other folks and I'm on like the React channel and we're just talking about vanilla JavaScript, it doesn't have to be me being an Ember developer anymore, which has been a large part of what's blocked me from being, I think an asset in my local community in the broader JavaScript community. At large is every time I get a conversation it's like, "I have to do it the Ember way," and that's changing actually. The Ember has credit a lot of deprecation if you guys have seen or follow the RCs and other just Ember upgrade deprecation. We're kind of getting away from being Ember and writing just more JavaScript and even maybe sometime this year beginning ES6 classes, instead of Ember object extend. I think Ember is heading in that direction. I just went there, rather rapidly because I also was again experiencing vanilla JavaScript with other communities, View and React. ROBERT: I think we're walking on this very similar path. I'm following your footsteps right now, it sounds like. TORAN: My last point which was that third bullet about building component trees, it didn't sound like either of you guys really contest that and I'm friends with, obviously Chris Freeman, formerly The Frontside and Chris tells me, "You're trying to build full component trees once you're injected at the route level and you're not doing like a ton of HTML in your controller HPS files." Is that true? CHARLES: We treat our controller basically as a component. Sometimes, we'll be like, "This is the controller and if we ever use it in more than one place, we'll take out its component." We're not super dogmatic but we definitely see the clear separation of the route is for maintaining the data and everything else is just one tree of components just below that. ROBERT: The more I think about it though, I'm so conflicted because I really like routes in Ember and they do a lot for you. I like having the data be maintained in one spot but I don't know a single store with Redux maintaining that and using like Redux-thunk or Redux-saga. I got some exploring to do. CHARLES: I don't think those are mutually exclusive propositions. That's what you were saying at the beginning, right Toran? You still do all of your data munching in the route. There's two kind of subjects that I wanted to broach briefly, although I don't think brief is possible with them is actions, like how we talked about data down, we talked about where you draw the seams in your application, where you're loading your data, where you're mapping it to your components and having that separation into your presentation components. We didn't get to talk about reducers so much and how you map. You touched on it like the mechanics but suppose I have a to-do list and I want to delete an item and I've got some button to delete an item, that's down my component tree. How do I map that action back up to the store? I don't know if we actually have time to cover that because it is meaty-meaty subject. ROBERT: Redux part two? TORAN: Yeah, we have to follow up because really that is a little bit more of an advanced segment not that folks shouldn't hear about it. But one thing that's a radical shift, Charles that we would have to go into and talk about, which is controversial as well as most folks want to operate in one structure, one dictionary not in the array. Then immediately, everything flips to being a Lodash operation. I didn't really use Lodash at all until I got into this. You guys probably actually are smart folks to do. But for me, this store is not in array now. When I'm doing array operations like remove or filter, I'm actually operating with Lodash on an object to produce those new states and most of it is just learning the Lodash operators because I didn't actually know them so the Yelp Clone that I have out there is a very simplistic look at using Lodash with Ember. But it accomplishes some of that. Then also, the secondary piece that would also consume a ton of time that we should go into but maybe not today is switching from Thunk to Generators with Saga and then maybe even observables with RxJS, which seems like possibly the future. Those all sounds cool but I think they're going to blow the heck out of scope on this thing. CHARLES: All right. Well, thank you so much for coming by Toran. As always, our conversations are too big to fit into a single podcast. I really want to have you on again. There are so many things that we haven't even touched on. We haven't touched on the subtleties of how action dispatching works. We haven't touched on using Ember-data -- I'm just [inaudible] out there and say it. With Redux, we haven't open that can of worms and who doesn't want to just sift through a can of worms on a podcast? We are going to have you on again. I am positive of that. ROBERT: We're going to paint that bike shed. CHARLES: Yeah, we're going to paint that bike shed. It's a bike shed that needs to be painted. It's something that the community, I think needs to face head on. Thank you so much for coming by and talking with us about Ember-Redux. Everybody, go and check it out. Toran, you've got some talks coming up, if you want to mention those real quick. TORAN: Yeah, I just wanted to plug. There's possibly going to be a talk, we're still lining up the official date with the Washington DC Ember Meetup sometime in April. I planning out to fly out there actually and give this talk on Ember-Redux. I want to thank just publicly the RSA team for kind of helping sponsor me to fly out and check it out. As well as give a more in-depth talk on Ember-Redux in the Meetup setting. CHARLES: Fantastic. If you're in the area, be sure to go check that out. If not, watch it on video and then unrelated Ember-Redux, if you haven't watched Toran's EmberConf talk on Outside-In development. TORAN: That's out actually global Ember Meetup, I think. CHARLES: Okay, that one. Actually, just go watch all Toran's talks. The thing that I didn't mention at the beginning of the podcast is that you do a lot of live coding, which is just makes my bowels freeze when I think about doing it. You just pull it off so effortlessly so it's definitely, definitely worth a watch. With that we, will take it out. We'll see you guys later. That's it from The Frontside. Remember to get in touch with us at Frontside.io. If you're interested in UI, that's engineered to make UX dreams come true.
Co-author React Router, Co-owner ReactJS Training. JavaScript thought-haver. Junior Developer for Life.
JS Remote Conf starts tomorrow! Get your ticket TODAY! 03:59 - JavaScript Tools Fatigue Catalyst: Eric Clemmons: Javascript Fatigue Some Twitter Opinions and Perspectives: Ryan Florence Michael Jackson Jamison Vjeux Sebastian McKenzie 09:25 - Are popular technologies ahead of public consumability? Ryan Florence Tweet 12:53 - Adopting New Things / Churn Burnout 18:02 - Non-JavaScript Developers and Team Adoption 30:49 - Is this the result of a crowdsourced design effort? 35:44 - Human Interactions 45:00 - Tools 47:03 - How many/which of these tools do I need to learn? Picks Julie Evans: How to Get Better at Debugging (Jamison) Totally Tooling Tips: Debugging Promises with DevTools (Jamison) Making a Murderer (Jamison) Scott Alexander: I Can Tolerate Anything Except the Outgroup (Jamison) @SciencePorn (Dave) postcss (Aimee) Cory House: The Illogical Allure of Extremes (Aimee) Kerrygold Natural Irish Butter (Aimee) Star Wars (Joe) @iammerrick (Joe) Greg Wilson: What We Actually Know About Software Development, and Why We Believe It's True (Joe) The U.S. Military (Joe) Operation Code (Aimee) Ruby Rogues Episode #184: What We Actually Know About Software Development and Why We Believe It's True with Greg Wilson and Andreas Stefik (Chuck) Serial Podcast (Chuck)
JS Remote Conf starts tomorrow! Get your ticket TODAY! 03:59 - JavaScript Tools Fatigue Catalyst: Eric Clemmons: Javascript Fatigue Some Twitter Opinions and Perspectives: Ryan Florence Michael Jackson Jamison Vjeux Sebastian McKenzie 09:25 - Are popular technologies ahead of public consumability? Ryan Florence Tweet 12:53 - Adopting New Things / Churn Burnout 18:02 - Non-JavaScript Developers and Team Adoption 30:49 - Is this the result of a crowdsourced design effort? 35:44 - Human Interactions 45:00 - Tools 47:03 - How many/which of these tools do I need to learn? Picks Julie Evans: How to Get Better at Debugging (Jamison) Totally Tooling Tips: Debugging Promises with DevTools (Jamison) Making a Murderer (Jamison) Scott Alexander: I Can Tolerate Anything Except the Outgroup (Jamison) @SciencePorn (Dave) postcss (Aimee) Cory House: The Illogical Allure of Extremes (Aimee) Kerrygold Natural Irish Butter (Aimee) Star Wars (Joe) @iammerrick (Joe) Greg Wilson: What We Actually Know About Software Development, and Why We Believe It's True (Joe) The U.S. Military (Joe) Operation Code (Aimee) Ruby Rogues Episode #184: What We Actually Know About Software Development and Why We Believe It's True with Greg Wilson and Andreas Stefik (Chuck) Serial Podcast (Chuck)
JS Remote Conf starts tomorrow! Get your ticket TODAY! 03:59 - JavaScript Tools Fatigue Catalyst: Eric Clemmons: Javascript Fatigue Some Twitter Opinions and Perspectives: Ryan Florence Michael Jackson Jamison Vjeux Sebastian McKenzie 09:25 - Are popular technologies ahead of public consumability? Ryan Florence Tweet 12:53 - Adopting New Things / Churn Burnout 18:02 - Non-JavaScript Developers and Team Adoption 30:49 - Is this the result of a crowdsourced design effort? 35:44 - Human Interactions 45:00 - Tools 47:03 - How many/which of these tools do I need to learn? Picks Julie Evans: How to Get Better at Debugging (Jamison) Totally Tooling Tips: Debugging Promises with DevTools (Jamison) Making a Murderer (Jamison) Scott Alexander: I Can Tolerate Anything Except the Outgroup (Jamison) @SciencePorn (Dave) postcss (Aimee) Cory House: The Illogical Allure of Extremes (Aimee) Kerrygold Natural Irish Butter (Aimee) Star Wars (Joe) @iammerrick (Joe) Greg Wilson: What We Actually Know About Software Development, and Why We Believe It's True (Joe) The U.S. Military (Joe) Operation Code (Aimee) Ruby Rogues Episode #184: What We Actually Know About Software Development and Why We Believe It's True with Greg Wilson and Andreas Stefik (Chuck) Serial Podcast (Chuck)
02:43 - Oren Rubin Introduction Twitter GitHub LinkedIn TESTIM.IO 05:43 - Testing Unit Testing End-to-end Testing Acceptance Testing Functional Testing Performance Testing 18:18 - Page Object(s) Locators 27:10 - Protractor & Selenium Zombie 32:06 - Checking UI (Screenshots) 37:04 - End-to-end > Full Coverage? 40:03 - When should you start testing? 42:21 - Cucumber 45:39 - Debugging Picks Paul Ford: 10 Timeframes (Jamison) Kishi Bashi - “In Fantasia” (Jamison) Matt Zabriskie (Jamison) http-backend-proxy (Aimee) repl.it (Aimee) React.js Training with Michael Jackson and Ryan Florence (Joe) React Rally (Joe) AngularConnect (Joe) ng-conf (Joe) Ruby Remote Conf Videos (Chuck) Angular Remote Conf (Chuck) 15 Minute Podcast Listener chat with Charles Wood (Chuck) Dave Haeffner: Elemental Selenium (Oren) CSS Secrets by Lea Verou (Oren) Cloudinary (Oren)
02:43 - Oren Rubin Introduction Twitter GitHub LinkedIn TESTIM.IO 05:43 - Testing Unit Testing End-to-end Testing Acceptance Testing Functional Testing Performance Testing 18:18 - Page Object(s) Locators 27:10 - Protractor & Selenium Zombie 32:06 - Checking UI (Screenshots) 37:04 - End-to-end > Full Coverage? 40:03 - When should you start testing? 42:21 - Cucumber 45:39 - Debugging Picks Paul Ford: 10 Timeframes (Jamison) Kishi Bashi - “In Fantasia” (Jamison) Matt Zabriskie (Jamison) http-backend-proxy (Aimee) repl.it (Aimee) React.js Training with Michael Jackson and Ryan Florence (Joe) React Rally (Joe) AngularConnect (Joe) ng-conf (Joe) Ruby Remote Conf Videos (Chuck) Angular Remote Conf (Chuck) 15 Minute Podcast Listener chat with Charles Wood (Chuck) Dave Haeffner: Elemental Selenium (Oren) CSS Secrets by Lea Verou (Oren) Cloudinary (Oren)
02:43 - Oren Rubin Introduction Twitter GitHub LinkedIn TESTIM.IO 05:43 - Testing Unit Testing End-to-end Testing Acceptance Testing Functional Testing Performance Testing 18:18 - Page Object(s) Locators 27:10 - Protractor & Selenium Zombie 32:06 - Checking UI (Screenshots) 37:04 - End-to-end > Full Coverage? 40:03 - When should you start testing? 42:21 - Cucumber 45:39 - Debugging Picks Paul Ford: 10 Timeframes (Jamison) Kishi Bashi - “In Fantasia” (Jamison) Matt Zabriskie (Jamison) http-backend-proxy (Aimee) repl.it (Aimee) React.js Training with Michael Jackson and Ryan Florence (Joe) React Rally (Joe) AngularConnect (Joe) ng-conf (Joe) Ruby Remote Conf Videos (Chuck) Angular Remote Conf (Chuck) 15 Minute Podcast Listener chat with Charles Wood (Chuck) Dave Haeffner: Elemental Selenium (Oren) CSS Secrets by Lea Verou (Oren) Cloudinary (Oren)
Jeff is joined by Michael Jackson and Ryan Florence to discuss what makes the technology and innovations coming from the React.js community really special.
02:21 - Tyler McGinnis Introduction Twitter GitHub Blog DevMountain Programming Bootcamp @DevMtn Firebase Experts Program 03:23 - Getting Started at DevMountain Hack Reactor Needle 04:38 - DevMountain Conception Cahlan Sharp 05:37 - How Do I Learn How to Code? Struggle. Fail. Tears. [Confreaks] Tyler McGinnis: What I’ve Learned about Learning from Teaching People to Code 08:03 - Resources => Consume ALL THE Information Katya Eames [YouTube] Katya Eames: How to Teach Angular to your Kids A Smarter Way to Learn JavaScript: The new approach that uses technology to cut your effort in half by Mark Myers 11:16 - Two Camps: Art (Creators) and Technicians
02:21 - Tyler McGinnis Introduction Twitter GitHub Blog DevMountain Programming Bootcamp @DevMtn Firebase Experts Program 03:23 - Getting Started at DevMountain Hack Reactor Needle 04:38 - DevMountain Conception Cahlan Sharp 05:37 - How Do I Learn How to Code? Struggle. Fail. Tears. [Confreaks] Tyler McGinnis: What I’ve Learned about Learning from Teaching People to Code 08:03 - Resources => Consume ALL THE Information Katya Eames [YouTube] Katya Eames: How to Teach Angular to your Kids A Smarter Way to Learn JavaScript: The new approach that uses technology to cut your effort in half by Mark Myers 11:16 - Two Camps: Art (Creators) and Technicians
02:21 - Tyler McGinnis Introduction Twitter GitHub Blog DevMountain Programming Bootcamp @DevMtn Firebase Experts Program 03:23 - Getting Started at DevMountain Hack Reactor Needle 04:38 - DevMountain Conception Cahlan Sharp 05:37 - How Do I Learn How to Code? Struggle. Fail. Tears. [Confreaks] Tyler McGinnis: What I’ve Learned about Learning from Teaching People to Code 08:03 - Resources => Consume ALL THE Information Katya Eames [YouTube] Katya Eames: How to Teach Angular to your Kids A Smarter Way to Learn JavaScript: The new approach that uses technology to cut your effort in half by Mark Myers 11:16 - Two Camps: Art (Creators) and Technicians
React Week (reactweek.com) is the premiere week long workshop focused solely on learning how to build applications in React.js taught by Ryan Florence. React is just the "V in MVC" so attendees will learn all about how to build full applications around React with the Flux architecture, React Router, Webpack, and Firebase. Ryan isn't the only top developer teaching at React Week. Lead Instructor, Tyler McGinnis (@tylermcginnis33) , chats with us about the React Week event, Firebase, Webpack, React and more. Tyler is no slouch when it comes to thought leadership. Not only is he joining our podcast for this episode but he is doing an episode of the JavaScript Jabber podcast and speaking at both Mountain West JavaScript, and ng-conf conferences….all in the next two weeks. Resources React Week - http://reactweek.com React Week on Twitter - https://twitter.com/reactweek Tyler's personal site - http://tylermcginnis.com/ Mountain West JS - http://mtnwestjs.org/ ng-conf - http://www.ng-conf.org/ Javascript Jabber - http://devchat.tv/js-jabber/ Dev Mountain - https://devmounta.in/ Firebase Experts Program - https://www.firebase.com/experts.html JavaScript is Sexy - http://javascriptissexy.com/ egghead.io - https://egghead.io/ Panelists Erik Isaksen - UX Engineer at3Pillar Global Nick Niemeir - JavaScript Agent Engineer at New Relic Christian Smith - Open Source Developer & Startup Enthusiast Rob Simpson - Senior Front End Developer & host of The Watercooler Web Dev Show Rachel Nabors - Web Animation Developer Advocate & Founder of TinMagpie
Senior Salute Radio brings timely information to leading edge Boomers and Seniors about issues involving care-giving and aging. Learn from both professionals and regular people going through the process with their families. Each week we will also Salute an incredible Senior. Senior Salute Radio is presented by The Elder & Disability Law Firm of Victoria L. Collier. […] The post Paying for Long Term Care appeared first on Business RadioX ®.
We're back! After a brief, unexplainable disappearance, Brandon and Charles have retuned to discuss their talks at RailsConf 2014, designing models, why writing a framework sucks, the library-author bias, and more. RailsConf 2014 Videos are up! The Power of M (Charles at RailsConf) Bring Fun Back to JS (Brandon at RailsConf) Router JS Programming in the Wild West You can't not have a framework by Ryan Florence
Panel Ben Alman (twitter github blog) AJ O’Neal (twitter github blog) Jamison Dance (twitter github blog) Ryan Florence (twitter github blog) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) Discussion 01:34 - Ben Alman Introduction Bocoup 02:54 - “Cowboy” Cowboy Coder 06:53 - The Birth of Grunt Ender make rake jake 14:34 - Installing Globally & Plugins JSHint grunt-cli lodash async 20:43 - Managing the project and releasing new versions 22:32 - What is Grunt? What does it do? jQuery libsass SASS stylus 26:39 - Processes & Building Features node-task guard grunt-contrib-watch node-prolog 35:29 - The Node Community and reluctance towards Grunt 41:35 - Why the separation of task loading and configuration? 46:18 - Contributions and Contributing to Grunt 55:18 - What Ben would have done differently building Grunt Ease of Upgrade Picks Web Components (Ryan) Eliminate Sarcasm (Ryan) Bee and PuppyCat (Jamison) MONOPRICE (AJ) AJ O'Neal: Moving to GruntJS (AJ) The Best Map Ever Made of America’s Racial Segregation (Chuck) Clean Off Your Desk (Chuck) Polygon (Ben) My Brother, My Brother and Me (Ben) Echofon (Ben) Bocoup (Ben) Next Week Maintainable JavaScript with Nicholas Zakas Transcript RYAN: We’re potty training my son right now. So, I was up like eight times cleaning poo off of everything. [Hosting and bandwidth provided by the Blue Box Group. Check them out at BlueBox.net.] [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.] [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the frontend of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google Closure Compiler. Check it out at JetBrains.com/WebStorm.] CHUCK: Hey everybody and welcome to episode 74 of the JavaScript Jabber Show. This week on our panel, we have AJ O’Neal. AJ: I’m eating beef jerky. CHUCK: Jamison Dance. JAMISON: Hello. CHUCK: We have a special guest. I guess you’re a guest in filling in for Merrick and Joe and that’s Ryan Florence. RYAN: Hey, how’s it going? I don’t know if I can fill two shoes, but I will try. CHUCK: Well, you have two feet, right? RYAN: Okay. Well, that’s four shoes. CHUCK: [Chuckles] I’m Charles Max Wood from DevChat.TV. We also have another special guest and that is Ben Alman. BEN: Yo! What’s up, everyone? CHUCK: So, do you want to introduce your self, Ben, since you haven’t been on the show before? BEN: I’m Ben Alman. Oh, okay. [Laughter] AJ: That’s not conceited. RYAN: That’s really all he needs. BEN: That’s it. The show’s over, roll credits. So yeah, I’m Ben. You can find me online as @cowboy on Twitter or GitHub and I’m at BenAlman.com. And if you Google me, I have finally got enough SEO juice to beat the other Ben Alman who’s the Orthopedic Surgeon for sick children in Canada. So screw you, guy who helps sick kids. [Laughter] BEN: No, it’s cool. It’s cool, right? But for a while, I was like, “Damn this guy.” But I can’t do anything because he helps sick children. So there’s another Benjamin Alman out there doing things for society and me, I just code. So, I work at Bocoup. We’re at Bocoup.com. Our logo is a rooster, Bob the Rooster, and we make a lot of cool web and open web and open source stuff. And so, I do training there. I teach people JavaScript and jQuery. But I also work on open source tools. I spend a lot of my time, actually, behind the scenes in Node writing JavaScript, experimenting, R&D, writing tools, et cetera. CHUCK: Awesome. So,
Panel Ben Alman (twitter github blog) AJ O’Neal (twitter github blog) Jamison Dance (twitter github blog) Ryan Florence (twitter github blog) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) Discussion 01:34 - Ben Alman Introduction Bocoup 02:54 - “Cowboy” Cowboy Coder 06:53 - The Birth of Grunt Ender make rake jake 14:34 - Installing Globally & Plugins JSHint grunt-cli lodash async 20:43 - Managing the project and releasing new versions 22:32 - What is Grunt? What does it do? jQuery libsass SASS stylus 26:39 - Processes & Building Features node-task guard grunt-contrib-watch node-prolog 35:29 - The Node Community and reluctance towards Grunt 41:35 - Why the separation of task loading and configuration? 46:18 - Contributions and Contributing to Grunt 55:18 - What Ben would have done differently building Grunt Ease of Upgrade Picks Web Components (Ryan) Eliminate Sarcasm (Ryan) Bee and PuppyCat (Jamison) MONOPRICE (AJ) AJ O'Neal: Moving to GruntJS (AJ) The Best Map Ever Made of America’s Racial Segregation (Chuck) Clean Off Your Desk (Chuck) Polygon (Ben) My Brother, My Brother and Me (Ben) Echofon (Ben) Bocoup (Ben) Next Week Maintainable JavaScript with Nicholas Zakas Transcript RYAN: We’re potty training my son right now. So, I was up like eight times cleaning poo off of everything. [Hosting and bandwidth provided by the Blue Box Group. Check them out at BlueBox.net.] [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.] [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the frontend of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google Closure Compiler. Check it out at JetBrains.com/WebStorm.] CHUCK: Hey everybody and welcome to episode 74 of the JavaScript Jabber Show. This week on our panel, we have AJ O’Neal. AJ: I’m eating beef jerky. CHUCK: Jamison Dance. JAMISON: Hello. CHUCK: We have a special guest. I guess you’re a guest in filling in for Merrick and Joe and that’s Ryan Florence. RYAN: Hey, how’s it going? I don’t know if I can fill two shoes, but I will try. CHUCK: Well, you have two feet, right? RYAN: Okay. Well, that’s four shoes. CHUCK: [Chuckles] I’m Charles Max Wood from DevChat.TV. We also have another special guest and that is Ben Alman. BEN: Yo! What’s up, everyone? CHUCK: So, do you want to introduce your self, Ben, since you haven’t been on the show before? BEN: I’m Ben Alman. Oh, okay. [Laughter] AJ: That’s not conceited. RYAN: That’s really all he needs. BEN: That’s it. The show’s over, roll credits. So yeah, I’m Ben. You can find me online as @cowboy on Twitter or GitHub and I’m at BenAlman.com. And if you Google me, I have finally got enough SEO juice to beat the other Ben Alman who’s the Orthopedic Surgeon for sick children in Canada. So screw you, guy who helps sick kids. [Laughter] BEN: No, it’s cool. It’s cool, right? But for a while, I was like, “Damn this guy.” But I can’t do anything because he helps sick children. So there’s another Benjamin Alman out there doing things for society and me, I just code. So, I work at Bocoup. We’re at Bocoup.com. Our logo is a rooster, Bob the Rooster, and we make a lot of cool web and open web and open source stuff. And so, I do training there. I teach people JavaScript and jQuery. But I also work on open source tools. I spend a lot of my time, actually, behind the scenes in Node writing JavaScript, experimenting, R&D, writing tools, et cetera. CHUCK: Awesome. So,
Panel Ben Alman (twitter github blog) AJ O’Neal (twitter github blog) Jamison Dance (twitter github blog) Ryan Florence (twitter github blog) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) Discussion 01:34 - Ben Alman Introduction Bocoup 02:54 - “Cowboy” Cowboy Coder 06:53 - The Birth of Grunt Ender make rake jake 14:34 - Installing Globally & Plugins JSHint grunt-cli lodash async 20:43 - Managing the project and releasing new versions 22:32 - What is Grunt? What does it do? jQuery libsass SASS stylus 26:39 - Processes & Building Features node-task guard grunt-contrib-watch node-prolog 35:29 - The Node Community and reluctance towards Grunt 41:35 - Why the separation of task loading and configuration? 46:18 - Contributions and Contributing to Grunt 55:18 - What Ben would have done differently building Grunt Ease of Upgrade Picks Web Components (Ryan) Eliminate Sarcasm (Ryan) Bee and PuppyCat (Jamison) MONOPRICE (AJ) AJ O'Neal: Moving to GruntJS (AJ) The Best Map Ever Made of America’s Racial Segregation (Chuck) Clean Off Your Desk (Chuck) Polygon (Ben) My Brother, My Brother and Me (Ben) Echofon (Ben) Bocoup (Ben) Next Week Maintainable JavaScript with Nicholas Zakas Transcript RYAN: We’re potty training my son right now. So, I was up like eight times cleaning poo off of everything. [Hosting and bandwidth provided by the Blue Box Group. Check them out at BlueBox.net.] [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.] [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the frontend of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google Closure Compiler. Check it out at JetBrains.com/WebStorm.] CHUCK: Hey everybody and welcome to episode 74 of the JavaScript Jabber Show. This week on our panel, we have AJ O’Neal. AJ: I’m eating beef jerky. CHUCK: Jamison Dance. JAMISON: Hello. CHUCK: We have a special guest. I guess you’re a guest in filling in for Merrick and Joe and that’s Ryan Florence. RYAN: Hey, how’s it going? I don’t know if I can fill two shoes, but I will try. CHUCK: Well, you have two feet, right? RYAN: Okay. Well, that’s four shoes. CHUCK: [Chuckles] I’m Charles Max Wood from DevChat.TV. We also have another special guest and that is Ben Alman. BEN: Yo! What’s up, everyone? CHUCK: So, do you want to introduce your self, Ben, since you haven’t been on the show before? BEN: I’m Ben Alman. Oh, okay. [Laughter] AJ: That’s not conceited. RYAN: That’s really all he needs. BEN: That’s it. The show’s over, roll credits. So yeah, I’m Ben. You can find me online as @cowboy on Twitter or GitHub and I’m at BenAlman.com. And if you Google me, I have finally got enough SEO juice to beat the other Ben Alman who’s the Orthopedic Surgeon for sick children in Canada. So screw you, guy who helps sick kids. [Laughter] BEN: No, it’s cool. It’s cool, right? But for a while, I was like, “Damn this guy.” But I can’t do anything because he helps sick children. So there’s another Benjamin Alman out there doing things for society and me, I just code. So, I work at Bocoup. We’re at Bocoup.com. Our logo is a rooster, Bob the Rooster, and we make a lot of cool web and open web and open source stuff. And so, I do training there. I teach people JavaScript and jQuery. But I also work on open source tools. I spend a lot of my time, actually, behind the scenes in Node writing JavaScript, experimenting, R&D, writing tools, et cetera. CHUCK: Awesome. So,
Panel Ryan Florence (twitter github blog) Jamison Dance (twitter github blog) Joe Eames (twitter github blog) Merrick Christensen (twitter github) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) Discussion 01:28 - Ryan Florence Introduction Instructure Canvas Network 03:04 - Ember 101 05:03 - Ember.js Workflow 047 JSJ Specialized vs Monolithic with James Halliday and Tom Dale ember-tools 07:14 - CommonJS vs RequireJS r.js browser-build 09:58 - prego 11:39 - Generators 14:45 - Testing 16:15 - Yeoman Yeoman generators 20:49 - Scaffolding Handlebars.js 21:33 - Ember blessing ember-tools Ember.js - Making Ember.js Easier 24:19 - Using ember-tools in Rails Creating Browser Apps as Part of Express of Rails (etc.) 25:27 - Scaffolding (cont’d) 26:53 - Adapting an existing project to ember-tools 29:59 - Dbmon 30:59 - Canvas Edu Apps (learning apps built on LTI™) 32:44 - node.js 34:24 - Modules 38:59 - Contributing to ember-tools 41:46 - State Picks vim-clutch (Merrick) Star Wars: Heir to the Empire by Timothy Zahn (Joe) America’s Got Talent (Joe) Man of Steel (Joe) The Internship (Joe) Help Save Podcasting! | Electronic Frontier Foundation (Chuck) Stuff You Should Know (Chuck) Fringe (Chuck) Capgras Syndrome: You Are Not Who You Think You Are (The Stuff You Should Know Podcast) (Ryan) MIDI.js (Ryan) JS Bin (Ryan) Lifetime Products Swing Sets (Ryan) Uncooked Flour Tortillas (Ryan) Next Week JavaScript Jabber: Javascript Application Build Tools with Adam Hawkins Transcript MERRICK: What’s up gentlemen? JOE: Like I said, just making toot lips. JAMISON: Isn’t toot lip like a flower of some kind? The JavaScript flower? JOE: Doesn’t smell like a flower. CHUCK: [Laughter] [Hosting and bandwidth provided by the Blue Box Group. Check them out at Bluebox.net.] [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.] [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the front end of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google closure compiler. Check it out at JetBrains.com/WebStorm.] CHUCK: Hey everybody, and welcome to Episode 64 of the JavaScript Jabber Show. This week on our panel, we have Jamison Dance. JAMISON: Hello friends. CHUCK: Joe Eames. JOE: Hey there. CHUCK: Merrick Christensen. MERRICK: What’s up? CHUCK: I’m Charles Max Wood from DevChat.TV. And this week, we have a special guest, Ryan Florence. RYAN: Hey, how’s it going? CHUCK: So, you haven’t been on the show before. Do you want to introduce yourself? RYAN: Sure. Ryan Florence. I’m from Utah like a lot of you guys. I’ve been writing JavaScript for five years now or something like that. I just picked it up. I was sick of the engineers at my company telling me that things were impossible. So, I started to show them that it was possible and then ended up getting paid more money. CHUCK: Is that at Instructure or is that somewhere else? RYAN: No, that was at a company actually in Idaho. CHUCK: Ah, I see. RYAN: So now, I work at Instructure. We build a learning management system for schools and universities. We also have Canvas.net, which is open courses for anyone to take. There are some pretty interesting ones on there like gender and comic books, things like that. It’s a fun place to work, fun product to work on. CHUCK: Yeah, you inherited a lot of my old coworkers. I used to work for Mozy. RYAN: Yeah, half our engineering team used to be Mozy. But I think we have offset them at this point.
Panel Ryan Florence (twitter github blog) Jamison Dance (twitter github blog) Joe Eames (twitter github blog) Merrick Christensen (twitter github) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) Discussion 01:28 - Ryan Florence Introduction Instructure Canvas Network 03:04 - Ember 101 05:03 - Ember.js Workflow 047 JSJ Specialized vs Monolithic with James Halliday and Tom Dale ember-tools 07:14 - CommonJS vs RequireJS r.js browser-build 09:58 - prego 11:39 - Generators 14:45 - Testing 16:15 - Yeoman Yeoman generators 20:49 - Scaffolding Handlebars.js 21:33 - Ember blessing ember-tools Ember.js - Making Ember.js Easier 24:19 - Using ember-tools in Rails Creating Browser Apps as Part of Express of Rails (etc.) 25:27 - Scaffolding (cont’d) 26:53 - Adapting an existing project to ember-tools 29:59 - Dbmon 30:59 - Canvas Edu Apps (learning apps built on LTI™) 32:44 - node.js 34:24 - Modules 38:59 - Contributing to ember-tools 41:46 - State Picks vim-clutch (Merrick) Star Wars: Heir to the Empire by Timothy Zahn (Joe) America’s Got Talent (Joe) Man of Steel (Joe) The Internship (Joe) Help Save Podcasting! | Electronic Frontier Foundation (Chuck) Stuff You Should Know (Chuck) Fringe (Chuck) Capgras Syndrome: You Are Not Who You Think You Are (The Stuff You Should Know Podcast) (Ryan) MIDI.js (Ryan) JS Bin (Ryan) Lifetime Products Swing Sets (Ryan) Uncooked Flour Tortillas (Ryan) Next Week JavaScript Jabber: Javascript Application Build Tools with Adam Hawkins Transcript MERRICK: What’s up gentlemen? JOE: Like I said, just making toot lips. JAMISON: Isn’t toot lip like a flower of some kind? The JavaScript flower? JOE: Doesn’t smell like a flower. CHUCK: [Laughter] [Hosting and bandwidth provided by the Blue Box Group. Check them out at Bluebox.net.] [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.] [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the front end of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google closure compiler. Check it out at JetBrains.com/WebStorm.] CHUCK: Hey everybody, and welcome to Episode 64 of the JavaScript Jabber Show. This week on our panel, we have Jamison Dance. JAMISON: Hello friends. CHUCK: Joe Eames. JOE: Hey there. CHUCK: Merrick Christensen. MERRICK: What’s up? CHUCK: I’m Charles Max Wood from DevChat.TV. And this week, we have a special guest, Ryan Florence. RYAN: Hey, how’s it going? CHUCK: So, you haven’t been on the show before. Do you want to introduce yourself? RYAN: Sure. Ryan Florence. I’m from Utah like a lot of you guys. I’ve been writing JavaScript for five years now or something like that. I just picked it up. I was sick of the engineers at my company telling me that things were impossible. So, I started to show them that it was possible and then ended up getting paid more money. CHUCK: Is that at Instructure or is that somewhere else? RYAN: No, that was at a company actually in Idaho. CHUCK: Ah, I see. RYAN: So now, I work at Instructure. We build a learning management system for schools and universities. We also have Canvas.net, which is open courses for anyone to take. There are some pretty interesting ones on there like gender and comic books, things like that. It’s a fun place to work, fun product to work on. CHUCK: Yeah, you inherited a lot of my old coworkers. I used to work for Mozy. RYAN: Yeah, half our engineering team used to be Mozy. But I think we have offset them at this point.
Panel Ryan Florence (twitter github blog) Jamison Dance (twitter github blog) Joe Eames (twitter github blog) Merrick Christensen (twitter github) Charles Max Wood (twitter github Teach Me To Code Rails Ramp Up) Discussion 01:28 - Ryan Florence Introduction Instructure Canvas Network 03:04 - Ember 101 05:03 - Ember.js Workflow 047 JSJ Specialized vs Monolithic with James Halliday and Tom Dale ember-tools 07:14 - CommonJS vs RequireJS r.js browser-build 09:58 - prego 11:39 - Generators 14:45 - Testing 16:15 - Yeoman Yeoman generators 20:49 - Scaffolding Handlebars.js 21:33 - Ember blessing ember-tools Ember.js - Making Ember.js Easier 24:19 - Using ember-tools in Rails Creating Browser Apps as Part of Express of Rails (etc.) 25:27 - Scaffolding (cont’d) 26:53 - Adapting an existing project to ember-tools 29:59 - Dbmon 30:59 - Canvas Edu Apps (learning apps built on LTI™) 32:44 - node.js 34:24 - Modules 38:59 - Contributing to ember-tools 41:46 - State Picks vim-clutch (Merrick) Star Wars: Heir to the Empire by Timothy Zahn (Joe) America’s Got Talent (Joe) Man of Steel (Joe) The Internship (Joe) Help Save Podcasting! | Electronic Frontier Foundation (Chuck) Stuff You Should Know (Chuck) Fringe (Chuck) Capgras Syndrome: You Are Not Who You Think You Are (The Stuff You Should Know Podcast) (Ryan) MIDI.js (Ryan) JS Bin (Ryan) Lifetime Products Swing Sets (Ryan) Uncooked Flour Tortillas (Ryan) Next Week JavaScript Jabber: Javascript Application Build Tools with Adam Hawkins Transcript MERRICK: What’s up gentlemen? JOE: Like I said, just making toot lips. JAMISON: Isn’t toot lip like a flower of some kind? The JavaScript flower? JOE: Doesn’t smell like a flower. CHUCK: [Laughter] [Hosting and bandwidth provided by the Blue Box Group. Check them out at Bluebox.net.] [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.] [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the front end of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google closure compiler. Check it out at JetBrains.com/WebStorm.] CHUCK: Hey everybody, and welcome to Episode 64 of the JavaScript Jabber Show. This week on our panel, we have Jamison Dance. JAMISON: Hello friends. CHUCK: Joe Eames. JOE: Hey there. CHUCK: Merrick Christensen. MERRICK: What’s up? CHUCK: I’m Charles Max Wood from DevChat.TV. And this week, we have a special guest, Ryan Florence. RYAN: Hey, how’s it going? CHUCK: So, you haven’t been on the show before. Do you want to introduce yourself? RYAN: Sure. Ryan Florence. I’m from Utah like a lot of you guys. I’ve been writing JavaScript for five years now or something like that. I just picked it up. I was sick of the engineers at my company telling me that things were impossible. So, I started to show them that it was possible and then ended up getting paid more money. CHUCK: Is that at Instructure or is that somewhere else? RYAN: No, that was at a company actually in Idaho. CHUCK: Ah, I see. RYAN: So now, I work at Instructure. We build a learning management system for schools and universities. We also have Canvas.net, which is open courses for anyone to take. There are some pretty interesting ones on there like gender and comic books, things like that. It’s a fun place to work, fun product to work on. CHUCK: Yeah, you inherited a lot of my old coworkers. I used to work for Mozy. RYAN: Yeah, half our engineering team used to be Mozy. But I think we have offset them at this point.