React Round Up13 Nov 2018

RRU 037: Make Backend Devs Jealous of Your Test Suite with Carly Litchfield

Panel:

Nader Dabit
Lucas Reis
Justin Bennett

Special Guests: Carly Litchfield In this episode, the panelists talk with Carly Litchfield who is a Full-stack engineer of React and React Native. The panel and Carly talk about frontend and backend developing and the issues that teams could face day-in and day-out. Listen to today’s episode to hear about that and much more! Show Topics: 0:00 – Kendo UI 0:30 – Nader: Welcome! Our panel is Justin, Lucas, myself, and our guest is Carly. Welcome to the show! Thanks for joining us. Introduce yourself please. 0:56 – Carly: I am a fullstack engineer at a company called Zocdoc. I have been there for 4 years, and we use C# framework. 1:17 – Nader: C# interesting! 1:26 – Nader: You can do game development and other stuff. 1:33- Carly: I haven’t gotten into game development at all, just using C# for web development. 1:50 – Nader. 1:55 – Carly. 2:08 – Nader: The topic for today is: being a frontend developer and a team that is mostly focused on backend. Also, other topics with testing if we have time. How did you get into web development? 2:32 – Carly goes into detail about how she got into web development. 5:02 – Carly: I have worked with React Native, too. 5:22 – Nader: That is my favorite thing to work with (React Native). 5:27 – Panel: Everyone was learning about this new domain and this frontend domain. How was the knowledge spread? How was it spread throughout the company? 5:50 – Carly: One of the people someone that was on this 3 – person team (Thomas) and he went around to anyone who knew React. He made a lot of tooling. He made a lot of configuration libraries. You’d have your NPM integration like everyone else. It was cool to hook it into our servers. It was crucial to help with adoption. Those libraries aren’t being well maintained and it’s causing some pain. 7:32 – Panel: I remember this one case when I was working with an engineer and he was working on backend stuff. He was like I don’t understand here is JSS and JavaScript. Did you have those cultural differences? 8:27 – Carly: Yeah, definitely. You will see a thousand two-thousand lines that are written by us and it’s impossible to know how it hooks-up, etc. It’s painful to work with and some of the internal tooling nobody is updating. That served a forcing mechanism b/c we built tons of the frontend that it’s so complicated and we are paralyzed. That served us b/c frontend is hard and we just can’t go plopping around wherever we want. That’s how they tried to use Backbone. We never hired a specific frontend engineer. We just kept hiring backend to learn frontend. It’s harder to hire someone to avoid those mistakes. They will have to learn the hard way, where a Senior Developer can help. Even our Backbone apps were heavy and hard to work with. At that time we thought we were going to go to React. We thought we could hire someone with true frontend experience. We started an interview process and hard to get off the ground. We have gotten a lot better b/c we have Senior and Principle engineers to help. 12:12 – Panel: This isn’t easy and this is hard. Building UIs are extremely difficult. 13:06 – Carly: I have an old manager that posted a quote...that just shows how much things are changing. These are advanced strategies. On the backend you have all of these services and go to AWS. However, on the frontend the problems aren’t solved, yet. WE don’t have a perfect answer. A lot of the dynamics are interesting and the right answers are yet to be found. 14:32 – Panel: I think that in some ways, an application we are finding better ways with static websites and blogs through the WordPress model. We are finding practices to enable people to build intricate things. 15:07 – Panel: I used C++ in the beginning of my career. I use a framework called QT. QT is good to building native UIs, but it’s extremely complicated and difficult. And thinking about that from the idea of building not only a UI, but also...we are essentially using tools that aren’t supposed to be used in the way they were designed. 16:46 – Carly: I agree. When I was using style components at the beginning – after you do it for a while it’s not weird anymore. It’s great not to have to reuse things. I hear a lot of people concerned with these separations, but maybe they were 3 separate concerns. Maybe one component is one concern, if you will. 17:59 – Panel: I agree. If you look at the page model vs. the web model...you want a button to look like THAT button. You want them to look the same, it’s a component or an app. Maybe if you have a Wikipedia page where you have headers and sections, the CSS model makes sense on that particular domain, but with application it’s so complicated. I am a fan of cell components, and... Things are getting better. Another topic – we are in this frontend world and one big problem with the old days was reliability. You talked a lot about testing in the frontend. Let’s talk about testing in your professional life. 19:48 – Carly: I moved slowly into backend, and it’s comfortable that you knew you weren’t going to break anything. This testing stuff is great and I actually love it. We need to figure it out on the frontend, too. I built a bunch of tools that doctors use. We started thinking about what can we do to make the frontend more testable. 21:40 – Panel: I call that: Layer Oriented Design. 21:51 – Carly: When we were on Backbone we used this screen-shot testing framework. We obviously should be focusing on how we made this app rather than how do we test frontend code. But we did it. You could have a Backbone view... 22:43 – Advertisement – FRESH BOOKS! 23:47 – Nader: How would you change the pictures – were you running it through what? 24:02 – Carly: An array of pixel colors. 24:10 – Carly: It was cool! We called it Lena. We used it for a year or so and it caught some bugs and it did other things. We built Percy and Storybook. We are ahead of the game with that. In general that is what we have moved to instead. 25:30 – Panel: What is Percy? 25:37 – Carly: It will render your components, then it will grab...and every time you push code it will compare the old/new screenshot. You can do mobile stuff, too, which is awesome. 26:25 – Panel: When I saw the Percy tests – I thought: this makes a difference! 26:48 – Carly: How do you know if this random stuff matters? 27:15 – Panel: It makes a huge impact. Percy can give it to you and easier to review code that has visual changes. If you added a border and you can see all the red sea of change, so let’s use a border box, etc. It’s really mind-blowing! They have a GitHub hook. If there are changes people have to improve. 28:22 – Panel: You mentioned it supporting a bunch of different browsers? What sort of context does Percy run in? Does it have a specific execution...? 28:44 – Carly: Options in Firefox and Chrome so far. People at Percy talk about cross-browsers and it will have a pipeline. It’s really hard to do. Who knows if it will come but we will see. 29:13 – Panel: How do we ensure that things are continuing to work across the browsers? Did we render anything that is completely broke? How do you do testing across browsers? 29:44 – Carly: Yeah, we use Browser Stack. We run Selenium IO. 31:12 – Nader: It sounds like you have great tools on the frontend. Nader asks a question. 31:28 – Carly: We have a fairly broken-up frontend. If someone changes something... Running all of those tests can get crazy. 32:11 – Panel: Cypress... Why did you decide on Cypress – what has been your experience with that? 32:35 – Carly: I have not yet figured out a good debugging experience, and I don’t know how you guys are doing it? It’s impossible to debug and it’s not a pleasant experience. I saw Cypress’ advertisement and you can see the difference. They highlight the target, etc. I had to try it! In just a little app that I have – I tested it there. I thought it was awesome b/c it will show you where it failed, etc. I had to get everyone on board and tried to persuade my team to use it. I used these slides and presented it, and it worked fine. It didn’t flake at all. People had to work with the tests and work with Cypress to get the feel for it. Everyone decided to use it, too. 35:16 – Panel: The spread of knowledge and it goes back to the beginning. What is this secret group: Frontend Guild? 35:33 – Carly answers the question. 37:04 – Panel: How does knowledge spread happen in other companies? Such different companies and different scales – how does that happen? 37:23 – Panel: As your company grows, communication is definitely a hard thing to accomplish. At ARTSY we try to do different things. One of our principles is...we try to document everything that goes on. Document from a process-level, and other levels, too. We have working practice groups

Become a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

Upptäck Premium

Prova 14 dagar kostnadsfritt

Skaffa Premium

Avsnitt(310)

The Missing Parts with Steven Wittens - RRU 182

Today we talk with Steven Wittens with his personal site acko.net, and get a glimpse inside his creative efforts of taking parts of React to a new level to support his vision for graphics developments. We also talk about Live, his own React runtime, and his upcoming use.gpu. Sponsors Top End DevsRaygun | Click here to get started on your free 14-day trialCoaching | Top End Devs Picks React - The Missing Parts Acko.net Steven Wittens / use.gpu · GitLabunconed - OverviewTwitter: Steven Wittens ( @unconed )Steven Wittens - YouTube Picks Paige - Inventing AnnaSteven - The Talos PrincipleTJ - Moon KnightSpecial Guest: Steven Wittens.Sponsored By:Coaching | Top End Devs: Do you want to level up your career? or go freelance? or start a podcast or youtube channel? Let Charles Max Wood Help You Achieve Your DreamsRaygun : Raygun now offers Real User Monitoring of Core Web Vitals. Start your 14-day free trial now.Top End Devs: Learn to Become a Top 5% Developer. Join our community of ambitious and engaged programmers to learn how.Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

18 Maj 202242min

React Design Patterns with Samaila Bala - RRU 181

In this episode we have special guest front-end engineer and technical writer Samaila Bala from Nigeria. We discuss several use cases of the React design patterns he has written about, such as the Compound Components Pattern and Provider Pattern. He also discusses his Send Cash app, and how it allows people to transfer money internationally with more ease. Sponsors Top End DevsCoaching | Top End Devs Links 3 React Component Design Patterns You Should Know About (openreplay.com)Samaila Bala Picks Jack - Nintendo Switch SportsPaige - Netlify Samaila - RemixTJ - PlatformIOSpecial Guest: Samaila Bala.Sponsored By:Coaching | Top End Devs: Do you want to level up your career? or go freelance? or start a podcast or youtube channel? Let Charles Max Wood Help You Achieve Your DreamsTop End Devs: Learn to Become a Top 5% Developer. Join our community of ambitious and engaged programmers to learn how.Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

11 Maj 202248min

How to Stand Out! - RRU 180

In this special all-panelist episode, we discuss all things on how to stand out! We’ll discuss everything from standing out in a crowd, standing out as a software developer, and how to get your name out there. We also talk about why this is an important topic to delve into. We’ll give you tips on finding success by choosing what you find interesting and fun, as well as tips to help you grow and get noticed. Sponsors Top End DevsRaygun | Click here to get started on your free 14-day trialCoaching | Top End Devs Links Hashnode - Blogging community for developers, and people in techGitHub: Where the world builds softwareLinkedIn: Log In or Sign Up Picks Jack - WarpPaige - HoneyTJ - Sonic the Hedgehog 2Sponsored By:Coaching | Top End Devs: Do you want to level up your career? or go freelance? or start a podcast or youtube channel? Let Charles Max Wood Help You Achieve Your DreamsRaygun : Raygun now offers Real User Monitoring of Core Web Vitals. Start your 14-day free trial now.Top End Devs: Learn to Become a Top 5% Developer. Join our community of ambitious and engaged programmers to learn how.Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

4 Maj 202251min

Red Flags! - RRU 179

Ever wish you had some great advice before you needed it? In this panelists episode we talk all about red flags when interviewing with a new company, and things to look for and be aware of during the process. We look at some red flags in coding, and include some tips on finding good code. We look at red flags while working with teams, managers and difficult people, and the the red flags to look for on special projects. There are even a few red flags thrown in for life in general. Sponsors Top End DevsCoaching | Top End Devs Links MPM Trends Picks Paige - React Table Jack - RedwoodJS TJ - Mario Cart Booster Course Pass Sponsored By:Top End Devs: Learn to Become a Top 5% Developer. Join our community of ambitious and engaged programmers to learn how.Coaching | Top End Devs: Do you want to level up your career? or go freelance? or start a podcast or youtube channel? Let Charles Max Wood Help You Achieve Your DreamsAdvertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

27 Apr 202252min

Advice for Junior Developers - RRU 178

Jack, Paige, and TJ give advice for Junior Developers. They pull from their own experience to break down the areas that Junior Developers may struggle with or not know that they need to focus on. Sponsors Top End DevsRaygun | Click here to get started on your free 14-day trialCoaching | Top End Devs Picks Jack- Hotwire: HTML Over The WirePaige- Watch Bridgerton | Netflix Official SiteTJ- Museums | Ann Arbor, MISponsored By:Coaching | Top End Devs: Do you want to level up your career? or go freelance? or start a podcast or youtube channel? Let Charles Max Wood Help You Achieve Your DreamsRaygun : Raygun now offers Real User Monitoring of Core Web Vitals. Start your 14-day free trial now.Top End Devs: Learn to Become a Top 5% Developer. Join our community of ambitious and engaged programmers to learn how.Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

20 Apr 202257min

Wrangle Your CSS in JS for Peanuts using Goober ft. Cristian Bote - RRU 177

If you're looking for a way to manage your CSS in JS in a super lightweight framework, check out Goober. The package is exceptionally small and keeps your bundle lean and mean. Cristian Bote joins the round up to wrangle this discussion on how to put CSS into your React application in a novel way. Sponsors Top End DevsCoaching | Top End Devs Links GitHub - cristianbote/goobergooberPreactPhobia Picks Cristian- World's Strictest Parents - YouTubeJack- James Hoffmann - YouTubePaige- Twilio - Official Site - Endless API PossibilitiesTJ- BigWrite - Apps on Google PlaySpecial Guest: Cristian Bote.Sponsored By:Coaching | Top End Devs: Do you want to level up your career? or go freelance? or start a podcast or youtube channel? Let Charles Max Wood Help You Achieve Your DreamsTop End Devs: Learn to Become a Top 5% Developer. Join our community of ambitious and engaged programmers to learn how.Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

13 Apr 202250min

Open Source React with Tanner Joseph Linsley - RRU 176

There’s a wild west of open source React out there, so let’s help you prepare. In this episode, the squad talks with Tanner Joseph Linsley, an open source React developer who’s got some wisdom to drop on how to do it right and build your community. “Honestly, a lot of the time, it’s about taking existing tools and shaping them into what I need them to be.” _- Tanner Joseph Linsley _ In This Episode 1) The BIGGEST tools in React that you oughta know in 2022 2) How to use feedback effectively and fix mistakes quickly 3) The TRUTH around open-source in the dev community (and how to get started) Sponsors Top End DevsRaygun | Click here to get started on your free 14-day trialCoaching | Top End Devs Picks Carl- Christmas DIY at the Chateau - How to renovate a Chateau (Without killing your parter)Paige- Star Trek: Discovery (TV Series 2017– ) - IMDbTanner- Anycubic Mega X 3D PrinterTanner- Locke & Key (TV Series 2020– ) - IMDbTanner- Oculus Quest VRTJ- SteamYardSpecial Guest: Tanner Linsley.Sponsored By:Coaching | Top End Devs: Do you want to level up your career? or go freelance? or start a podcast or youtube channel? Let Charles Max Wood Help You Achieve Your DreamsRaygun : Raygun now offers Real User Monitoring of Core Web Vitals. Start your 14-day free trial now.Top End Devs: Learn to Become a Top 5% Developer. Join our community of ambitious and engaged programmers to learn how.Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

16 Mars 20221h 3min

UseEffect and Writing Well with Chimezie Innocent - RRU 175

Sometimes, the answer isn’t to code more. In this episode, the crew sits down with Chimezie Innocent, a developer who will show you how to clean up your act with UseEffect, as well as why this ONE thing dramatically improved his coding. “If you want to understand something better, the best advice I would give is ‘Just write about it!’” - Chimezie Innocent In This Episode 1) Why UseEffect is CRUCIAL for avoiding a world of hurt in your cleanup 2) How to reveal how little you ACTUALLY understand a concept (and how to become a better developer fast!) 3) Some GO-TO tips for improving your writing, helping others, and getting paid to do something other than coding Sponsors Top End DevsCoaching | Top End Devs Links Understanding React’s useEffect cleanup function - LogRocket Blog Picks Chimezie- Elementary movie about public schoolsJack- SAD LampJack- Mountain DuckPaige- Grippy SocksTJ- Stylus for cold weather phone usageSpecial Guest: Chimezie Innocent.Sponsored By:Coaching | Top End Devs: Do you want to level up your career? or go freelance? or start a podcast or youtube channel? Let Charles Max Wood Help You Achieve Your DreamsTop End Devs: Learn to Become a Top 5% Developer. Join our community of ambitious and engaged programmers to learn how.Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

9 Mars 202237min

Allt en och samma app

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

Noga utvalt innehåll

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

Fortsätt när du vill

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

Premium

99 kr/mån

Tillgång till alla Premium-poddar
Lyssna utan reklam
Avsluta när du vill

Prova 14 dagar gratis

Premium

129 kr/mån

Tillgång till alla Premium-poddar
Lyssna utan reklam
Avsluta när du vill
Ett extra konto

Prova 14 dagar gratis

Populärt inom Business & ekonomi

rikatillsammans-om-privatekonomi-rikedom-i-livet

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

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

Upptäck Premium