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)

Finding Hidden Gems in Your React Upgrades - RRU 205

The React Round Up panel joins the show as Jack takes the lead to talk about the various improvements made in the React Ecosystem. Additionally, they offer their thoughts and insights on these updates and share their potential value to the developers. They also talk about whether these features have an impact when used in apps.About this EpisodeDifferent React upgradesAdvantages and disadvantages of these new tools in your appsBenefits when using these featuresSponsorsChuck's Resume TemplateDeveloper Book Club starting with Clean Architecture by Robert C. MartinBecome a Top 1% Dev with a Top End Devs MembershipPicksJack - The Immortal Life of Henrietta Lacks Paige - Watch For All Mankind | Apple TV+TJ - The Magic Puzzle CompanyTJ - People I (Mostly) Admire Archives - FreakonomicsAdvertising 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.

7 Dec 202251min

How To Recession Proof Your Job - BONUS

Get the Black Friday/Cyber Monday "Focus Blocks Bundle" Deal Coupon Code: "THRIVE" for a GIANT discount Are you looking at all the layoffs and uncertainty going on and wondering if your company is the next to cut back? Or, maybe you're a freelancer or entrepreneur who is trying to figure out how to deliver more value to gain or retain customers? Mani Vaya joins Charles Max Wood to discuss the one thing that both of them use to more than double their productivity on a daily basis. Mani has read 1,000's of productivity books over the last several years and has formulated a methodology for getting more done, but found that he lacked the discipline to follow through on his plans. The he found the one thing that kept him on track and made him so productive that he is now getting all of his work done and was able to live the life he wants. Chuck also weighs in on how Mani's technique has worked for him and allows him to spend more time with his wife and kids, run a podcast network, and a nearly full time contract. Join the episode to learn how Chuck and Mani get into a regular flow state with their work and consistently deliver at work. 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.

24 Nov 20221h 12min

All Things Voice Recognition and JavaScript with Ian Lavery - RRU 204

Returning guest, Ian Lavery from Picovice.ai, joins the hosts to talk all things voice recognition. He dives into new languages the company has tackled over the last year (and what languages it plans to tackle next year), how they train their models, and how Picovoice is actually running speech recognition in the browser instead of in the cloud, making things like captioning live streams and real-time chats possible with some of its newer tech Cheetah and Leopard. He also shares how he wrote a simple podcast transcription app using Picovoice and Express.js, in addition to Picovoice boasting specific SDKs for React, Angular and Vue. Listen to Ian's first appearance on RRU here where he and the panel went deep into the specifics of voice recognition like security and privacy, understanding it in general, and using it sans big cloud providers. Sponsors"Waldo, who helps with Android testing" Chuck's Resume TemplateDeveloper Book Club starting with Clean Architecture by Robert C. MartinBecome a Top 1% Dev with a Top End Devs MembershipLinksLinkedIn: Ian LaveryIan Lavery - MediumTwitter: @AiPicovoicePicksIan - Mixpanel: Product Analytics for Mobile, Web, & MorePaige - Star Trek: Lower Decks - WikipediaTJ - The Great British Bakeoff seriesAdvertising 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 Nov 202249min

Migrating From A Monolithic Ruby App To React With Nirmalya Ghosh - RRU 203

Nirmalya Ghosh joins the React Round Up panelists in this episode to talk about how he migrated a monolithic Ruby on Rails application to React. What was estimated to take 3 -6 months ended up taking about 2 years, and Nirmalya shares all the hard-won lessons he learned along the way for any listeners who might be preparing to make a similar upgrade. Additionally, he talks about the company he currently works for and how they're trying to become the one-stop shop for anyone looking for a good API online. Lots of interesting tidbits are packed into this episode! Sponsors"Waldo, who helps with iOS testing"Chuck's Resume TemplateDeveloper Book Club starting with Clean Architecture by Robert C. MartinBecome a Top 1% Dev with a Top End Devs MembershipLinksour VS Code Extension for building and testing APIsGitHub: ghoshnirmalyaTwitter: @NirmalyaGhosh_PicksNirmalya - Next.js 13Paige - Star Trek: Strange New Worlds - WikipediaTJ - Welcome to hell, ElonAdvertising 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 Nov 202251min

Migrating to React Query from Redux with Pierre Hedkvist - 202

Software engineer Pierre Hedkvist joins the React Round Up panelists to share some spicy (controversial) coding decisions he's made and then written about. The first hot topic is using React state to store filter setting in query parameters with the help of a custom Hook, and the second is migrating an app to rely more heavily on React Query instead of Redux. If you've been considering doing something similar, give this episode a listen to hear Pierre's strategies and advice for anyone looking to get started. SponsorsChuck's Resume TemplateDeveloper Book Club starting with Clean Architecture by Robert C. MartinBecome a Top 1% Dev with a Top End Devs MembershipLinksStoring State in the URL with ReactMigrating from Redux to React QueryPierre HedkvistTwitter: @PierreHedkvistPicksPaige - ChrisFix | Youtube ChannelPierre - YJSPierre - LiveBlocksTJ - Magic PuzzlesAdvertising 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.

2 Nov 202241min

Supabase and Supabase Studio with Vijit Ail - RRU 201

Return guest Vijit Ail joins the cast of React Round Up to talk all things Supabase. If you've ever used Firebase and wished it was open source, this is the episode for you. Vijit espouses all the cool things Supabase offers like schema definitions, edge functions, data streaming, and more. There's so much good info chocked into this episode, listen to learn how to get started with Supabase today. SponsorsTop End DevsCoaching | Top End DevsLinksVijit AilGitHub: vijitailTwitter: @AilVijitPicksJack- rfcs/0000-first-class-support-for-promises.md at first-class-promises · acdlite/rfcsPaige- StackBlitz Codeflow - StackBlitzVijit- House of the Dragon | Official Website for the HBO Series | HBO.comAdvertising 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.

26 Okt 202232min

Our 200th Episode Look Back - RRU 200

In our 200th episode of React Round Up, the panelists take a look back at how their first appearances on RRU and how they came to be on the show. In addition to advice on how they got to where they are now, they also highlight some of their favorite guests who've graced RRU with all sorts of great React knowledge over the years and offer advice on how you can get started on your own tech podcast or (hopefully) be invited to join an existing one.Here's to 200 more episodes! SponsorsTop End DevsCoaching | Top End DevsOwnID, who provides passwordless authenticationPicksJonathan- Ferrari Daytona SP3 42143 | Technic - LegoPaige- TS3 Plus | Thunderbolt 3 Dock - CalDigitTJ- Dithering on Apple PodcastsAdvertising 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.

19 Okt 202250min

Cypress.io: One Testing Framework to Rule Them All with Gleb Bahmutov - RRU 199

Gleb Bahmutov, who worked with the Cypress.io team for 4 years, joins the panelists to talk all things testing. You may be familiar with Cypress as a popular JavaScript end-to-end testing framework, but did you know it recently began offering component testing as well? This may be just the incentive you need to ditch Jest and Testing Library for unit/integration tests and go all in on Cypress for all your testing needs. Listen up and let us know if you're convinced. SponsorsTop End DevsCoaching | Top End DevsLinksCypress v10 Tips and TricksCypress Tricks & TipsDr. Gleb Bahmutov, PhDTwitter: @bahmutovPicksGleb- Cypress.io Tips CoursesGleb- Cross Browser Testing, Selenium Testing, Mobile TestingGleb- 350 - Building a global climate movement.Paige- Kitchen tongs set of 3TJ- Fresh Food & Meal Kit Delivery Service | HelloFreshAdvertising 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.

28 Sep 202248min

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