React Round Up

Panel: Charles Max Wood Nader Dabit Special Guests: Josh Saint Jacque  In this episode, the panel talks with Josh St. Jacque who is married with two kids and with one on the way. He is a professional product manager and software engineer. Ruby on Rails got him started on his career path and journey. Check-out today’s episode where the panel discusses functional and class components, among many other things! Show Topics: 2:12 – Let’s have a conversation about functional components. 3:20 – Chuck to Nader: “What is your preference between class and functional components?” 4:18 – Nader to Josh: “What is your take on pure components” 5:20 – Who makes these architectural decisions at T-Mobile? 5:46 – Josh: It really depends on the team and the project depending on how they want to proceed. Josh mentions Angular among other things. 7:38 – Chuck to Josh: It seems that through your post you are trying to make code easier? 8:01 – Josh’s background is Ruby, and basic principles. 9:12 – Question directed to Josh about components. 11:05 – Functional components. 11:35 – Some say that functional components are faster/slower than others. 12:50 – When do you know you need/do not need a functional component? 13:15 Josh uses functional component as his default but, of course, there are different factors for him to consider. The presentational stuff is separated. Sometimes he does convert it over. 14:21 – Let’s talk through the log post. 18:15 – Digital Ocean’s mid-roll advertisement! 20:58 – The panel talks about pros and cons of the different components.  21:33 – Ruby on Rails 22:06 – “Why aren’t you using...?” I understand what the tradeoffs are and will change when that time comes. 23:03 – Is there a certain thing that you would tell them about React applications? Is it more just best practice and it doesn’t really change their learning of the framework? 23:28 – Whenever you get comfortable then start exploring another pattern. When you get really comfortable, then you might never see the tradeoffs by using other options. It’s good for a developer to always be open-minded. Keep yourself uncomfortable, and don’t have just one tool in your belt. Try functional components just to keep it fresh. 25:00 – Josh answers a question from Chuck. 27:00 – Josh talks about things to avoid, etc. 27:42 – Nader: “Have you seen the new features and possibly the new features that will be added on later?” 28:01 – Josh has started using new features and he talks about the pros and cons of these.  29:55 – Chuck to Josh: “Are there any features to the components that you wish they would add?” 30:08 – Josh: I never really have run into anything, yet, that is too frustrating. I really like that it is a little limited, and no real big complaints. I would imagine that there are good components around function. 31:42 – Nader to Josh: “Any other topics?” 31:54 – One thing Josh would like to say is that you and your team are on the same page. You don’t want to get into fights on what style you are using. You don’t want to constantly be changing the code. Use one thing at a time or it will get real messy too quick. One example of this is from Ruby: hash rockets. 33:35 – How to find Josh online...look at links below! Links: Kendo UI Ruby on Rails Josh St. Jacque’s LinkedIn Josh St. Jacque’s Medium Josh St. Jacque’s GitHub Josh St. Jacque’s Article on Medium T-Mobile Angular Get A Coder Job Sponsors: Kendo UI Sentry Digital Ocean Get A Coder Job Picks: *Charles Conference in October (UT) Frameworks Summit Podcast Movement CES Home Depot Tool Rental *Nader “A Tale of Four Components” by Pearl Latteier Nader’s Blog *Josh Video Game Soundtracks – Spotify VS Code Extension Weight Loss – Ice Cream – Enlightened

Panel: Charles Max Wood Nader Dabit Lucas Reis Special Guests: Luis Vieira In this episode, the React Round Up panelists talk to Luis Vieira about his “Building large scale react applications in a monorepo”. Luis works in Portugal at a company called FarFetch as a front-end architect where he works mostly on JavaScript and infrastructure. They talk about the rationale behind his article, shared components, and what Lerna is and what is does. They also touch on Semantic Versioning, the difference between monolithic application and a monorepo, and more! In particular, we dive pretty deep on: Luis intro Front-end architect at FarFetch Works with JavaScript Rationale behind his article Dividing a project in multiple packages Sharing components between multiple applications Editing shared components Working in a monorepo Simplifies managing between different projects Requires more tooling What is Lerna? If you put multiple packages in one repo, how do you deal with things like the Git history getting mixed up? Versioning How does Semantic Versioning interplay with monorepos? What if you’re not using Semantic Versioning? Using the conventional commit How is the state of CI tooling regarded? He is currently more focused on React What he is experimenting with currently Building monolithic apps Monolithic aps VS monorepo Bazel Nrwl Nx And much, much more! Links: “Building large scale react applications in a monorepo” FarFetch JavaScript Lerna Semantic Versioning React Bazel Nrwl Nx Luis’s Medium @luisvieira_gmr Luis’s Newsletter Sponsors Kendo UI Digital Ocean Get a Coder Job Picks: Charles Take some time off Take a step back to reevaluate Nader Free workshop with Tyler McGinnis to come soon. Keep an eye out at Nader’s Twitter or Tyler’s Newsletter React Native EU Lucas Sketch.systems Luis Vue CLI

Panel: Nader Dabit Sia Karamalegos Lucas Reis Special Guests: Orta Therox In this episode, the React Round Up panelists talk to Orta Therox about his 2 years of experience with React Native at Artsy. Orta has about 15 years of native Mac and iOS development experience and about 2 ½ years ago, his team decided to start writing their iOS app in React Native. They talk about the different popular blog posts about React Native, why his team decided to switch over to React Native, and the effects of team size on the success of the fit of React Native in each company’s app. They also touch on professional growth, how they have trained their employees, and more! In particular, we dive pretty deep on: Orta intro React Native and JavaScript React Native at Artsy blog post React Native at Airbnb blog post Suspense Web engineering Taking different approaches Being a better way to build an iOS app Adoption coming from a native perspective Does the size of the team matter? Product verticals How do you balance the need for professional development VS what’s needed at the moment? Vertically oriented teams Professional growth after the change GraphQL API Training everyone over multiple years React Allowing anyone to contribute anywhere within their domain How they describe their native engineers More excited about React Native now than when it was released Artsy React Native Conference And much, much more! Links: Artsy React Native JavaScript React Native at Artsy React Native at Airbnb GraphQL React @orta orta.io Orta’s GitHub Artsy Engineering Sponsors Kendo UI Digital Ocean FreshBooks Picks: Nader AWS Amplify Artsy Engineering blog Nader’s GitHub Sia Styled components Web Summer Camp Lucas MDN web docs Orta vscode-inline-types Coalition for Queens (C4Q)

Panel: Sia Karamalegos Lucas Reis Special Guests: Jordan Eldredge In this episode, the React Round Up panelists talk to Jordan Eldredge about his project Webamp. Jordan’s first introduction to programming had to do with music which led him to work both as a singer to now being an engineer. They talk about how common it is for programmers to have diverse backgrounds, especially in front-end developers, what Webamp and Winamp are, and what he originally wrote Webamp in. they also touch on his inspiration for creating this project, his journey in creating Webamp, and more! In particular, we dive pretty deep on: Jordan intro Studied music (opera) in college Forced himself to learn PHP and MySQL Common in front-end developing to have people with diverse backgrounds Why do you think it’s so common to have diverse backgrounds? Front-end web development is very young Self-taught developers What is Webamp? Reimplementation of Winamp in JavaScript What is Winamp? What did you originally write Webamp in? What was the inspiration for creating Webamp? CSS Sprites Wanting to recreate Winamp skins jQuery originally Rewrote in “vanilla” JavaScript The process of learning real JavaScript Managing transitions VS managing state React with Redux Do you believe your struggle with “vanilla” JS made you more aware of what React really brings? You Might Not Need Redux by Dan Abramov How did you deal with the audio API? The thing he loves about side-projects Not having a deadline Using a Redux middleware And much, much more! Links: Webamp MySQL Winamp JavaScript jQuery React Redux You Might Not Need Redux by Dan Abramov Jordaneldredge.com @captbaritone Jordan’s GitHub Sponsors Kendo UI Digital Ocean FreshBooks Picks: Sia Google Docs Lucas Timing App Jordan @winampskins Inspiring Online WACUP

Panel: Nader Dabit Sia Karamalegos Special Guests: Tanmai Gopal In this episode, the React Round Up panelists talk to Tanmai Gopal. Tanmai is the founder at Hasura, where they have been building a GraphQL tooling that helps accelerate being able to use GraphQL for app developers. They talk about what Hasura is and what inspired him to build it, what Haskell does to Postgres, and query variables in GraphQL. They also touch on the importance of being aware of the database, how authorization works, and more! In particular, we dive pretty deep on: Tanmai intro Founder of Hasura Has been building applications for about a decade Focus on functional programming How did you get into React? Using Redux and GaphQL How long has Hasura been around? What inspired you to build Hasura? Eliminating the middle layer The elevator pitch of Hasura Do you offer a database as a service? Slightly different than writing your own resolvers What Haskell does to Postgres Query variables in GraphQL Prepared statements in Postgres Making queries from aps GraphQL ORM for apps Being aware of the database How does authorization work? PostGraphile, Prisma, and Hasura How do PostGraphile and Prisma compare to Hasura? And much, much more! Links: Hasura React Redux GaphQL Haskell Postgres PostGraphile Prisma @tanmaigo Tanmai’s Blog Tanmai’s GitHub @HasuraHQ Sponsors Kendo UI Digital Ocean FreshBooks Picks: Nader React Native EU talk Sia Gatsby.js Tanmai Building a new tool

Panel: Nader Dabit Sia Karamalegos Special Guests: Tracy Lee, Jay Phelps, and Ben Lesh In this episode, the React Round Up panelists talk to Tracy Lee, Jay Phelps, and Ben Lesh about RxJS and redux-observable. Tracy, Jay, and Ben are the RxJS ThisDot Media group and where they do support contracts for RxJS, staff augmentation, developer relations, and put on events. They talk about what observables are and what they are trying to solve, the most common use cases for getting started with observables, and what Promises and Async/Await are. They also touch on what they like most about RxJS, how versatile it is, and more! In particular, we dive pretty deep on: Tracy, Jay, and Ben intro ThisDot RxJS What is an observable? What problems are observables trying to solve? JavaScript Learn observables Making everything functional in the library Means of encapsulating values you want pushed at you later on Downside to observables Little bit of a learning curve Most common uses for getting started with observables Can Promises and Async/Await be mixed with observables? What do Promises and Async/Await allow you to do? Defer function Await values coming in from observables What do you like about RxJS? Allows you to work with all different languages RxJS is very versatile ngrx “Rx all the things” What inspired you to write Redux observable? Redux-observable RxJS docs Epics And much, much more! Links: ThisDot JavaScript RxJS ngrx Redux Redux-observable RxJS docs @ladyleet Tracy’s GitHub @BenLesh Ben’s Medium Ben’s GitHub @_jayphelps Jay’s GitHub RxJS GitHub @ThisDotLabs Sponsors Kendo UI Digital Ocean FreshBooks Picks: Nader JSCamp Sia Sprint by Jake Knapp Tracy Fashionnova.com Francesca’s Jay deno applitools Ben react-streams StackBlitz

Panel: Charles Max Wood Special Guests: Vesa Juvonen In this episode, the React Round Up panel talks to Vesa Juvonen about building SharePoint extensions with JavaScript. Vesa is on the SharePoint development team and is responsible for the SharePoint Framework, which is the modern way of implementing SharePoint customizations with JavaScript. They talk about what SharePoint is, why they chose to use JavaScript with it, and how he maintains isolation. They also touch on the best way to get started with SharePoint, give some great resources to help you use it, and more! In particular, we dive pretty deep on: Vesa intro What is SharePoint? Has existed since 2009 People either know about it and use it or don’t know what it is Baggage from a customization perspective Why JavaScript developers? Modernizing development SharePoint Framework Microsoft Ignite Conference Is there a market for it? System integrators Angular Element and React React for SharePoint Framework back-end Supports Vue React Round Up Podcast How do you maintain isolation? What’s the best way to get started with SharePoint extensions? Office 365 Developer Program SharePoint documentation SharePoint YouTube What kinds of extensions are you seeing people build? And much, much more! Links: SharePoint JavaScript SharePoint Framework Microsoft Ignite Conference Angular Element React Vue React Round Up Podcast Office 365 Developer Program SharePoint documentation SharePoint YouTube @OfficeDev @vesajuvonen Vesa’s blog Vesa’s GitHub Sponsors Angular Boot Camp Digital Ocean FreshBooks Picks: Charles Zig Ziglar Conversations with My Dog by Zig Ziglar Pimsleur Lessons on Audible Vesa Armada by Ernest Cline

Panel: Charles Max Wood Lucas Reis Sia Karamalegos In this episode, the React Round Up panelists talk about finding a job as a developer. Charles is getting ready to release a course on finding a job and he finds that he is always getting asked about how new developers can find a job. They talk about how they all found their first coder job, picking your target company, and understanding what you want in a job. They also touch on Charles’ upcoming course, the importance of showing initiative, and more! In particular, we dive pretty deep on: Sign up to chat with Charles at DevChat.tv/15Minutes Why they want to touch on this topic Get used to failure CodeSchool Hack Night meetup Going to meetups to slowly start networking Making friends with developers in your community Networking before you need a job Learning and helping mindset Don’t be afraid to ask if people are hiring How did you figure out what your target company was? Checking out the culture of a company Understanding the travel involved Figure out what you like in a job as you go Always be looking at your portfolio and resume Gain as much experience as you can everywhere you go Stick to learning one language/system Really master the languages/systems of the company you want to uses Show initiative Finding a champion at your target company And much, much more! Links: DevChat.tv/15Minutes CodeSchool Hack Night meetup Charles’ Course How to interview your interviewers blog post Ruby Rogues Episode 184 Sponsors Kendo UI Digital Ocean FreshBooks Picks: Charles Orphan Black His Course Lucas The Best Software Engineering Paper You Haven’t Read Sia Family

Panel: Charles Max Wood Alyssa Nicholl Ward Bell Special Guests: David Cramer In this episode, the React Round Up panelists talk to David Cramer about error tracking and troubleshooting workflows. David is the founder and CEO of Sentry, and is a software engineer by trade. He started this project about a decade ago and it was created because he had customers telling him that things were broken and it was hard to help them fix it. They talk about what Sentry is, errors, workflow management, and more! In particular, we dive pretty deep on: David intro Founder and CEO of Sentry What is Sentry? Working with PHP De-bugger for production Focus on workflow Goal of Sentry Triaging the problem Workflow management Sentry started off as an open-source side project Instrumentation for JavaScript Ember, Angular, and npm Got their start in Python Logs Totally open-source Most compatible with run-time Can work with any language Deep contexts Determining the root cause And much, much more! Links: Sentry JavaScript Ember Angular npm Python Sentry’s GitHub @getsentry David’s GitHub David’s Website @zeeg Sponsors Kendo UI Loot Crate FreshBooks Picks: Charles Socks as Swag David VS Code Kubernetes

Panel: Charles Max Wood Lucas Reis Nader Dabit Special Guests: Alex Moldovan In this episode of React Round Up, the panel discusses the article Evolving Patterns in React with its author, Alex Moldovan. Alex is from Romania and works at Fortech as an engineering manager where he works mostly with the front-end development. He also is one of the co-founders of JSHeroes, which is the biggest JavaScript conference in Romania that also has a growing international community behind it. They answer some of Charles questions about React, talk about his article, their thoughts on the new changes, and more! In particular, we dive pretty deep on: Lucas was on React Round Up Episode 11 Lucas intro – works for Zocdoc as a senior front-end developer Alex intro At Fortech as an engineering manager Co-founder of JSHeroes His article Evolving Patterns in React React.createClass rather than ES6 class Started working with React in 2015 React and Redux Nobody knew how to actually build an application in React in the beginning Mixins What has replaced the idea of mixins? Higher Order Components Render Props article by Michael Jackson Implicit with mixins to explicit with render props What about Context? Do you think these new changes are addressing how we build React apps? Thoughts on the new APIs and changes from 16 to 17 Error boundaries Suspense Server-side rendering Using the Constructor Evolving patterns And much, much more! Links: React Round Up Episode 11 Zocdoc Fortech JSHeroes JavaScript Evolving Patterns in React React Redux Render Props article by Michael Jackson React Context React Constructor Alex’s Medium Alex’s GitHub @alexnmoldovan Sponsors Kendo UI Loot Crate FreshBooks Picks: Charles Star Realms Hogwarts Battles Lucas SpeedCurve Nader AWS AppSync GitHub Repo Building AI Enabled GraphQL Applications by Nader appsync-lambda-ai Alex Graphcool Prisma TensorFlow.js

Panel: Charles Max Wood Special Guests: Ori Zohar and Gopinath Chigakkagari In this episode, the React Round UP panelists discuss Cloud-Hosted DevOps with Ori Zohar and Gopinath Chigakkagari at Microsoft Build. Ori is on the product team at VSTS focusing on DevOps specifically on Azure. Gopinath is the group program manager in VSTS primarily working on continuous integration, continuous delivery, DevOps, Azure deployment, etc. They talk about the first steps people should take when getting into DevOps, define DevOps the way Microsoft views it, the advantages to automation, and more! In particular, we dive pretty deep on: Ori and Gopi intro VSTS – Visual Studio Team Services VSTS gives developers the ability to be productive Developer productivity What’s the first big step people should be taking if they’re getting into DevOps? The definition of DevOps The people and the processes as the most important piece DevOps as the best practices Automating processes What people do when things go wrong is what really counts Letting the system take care of the problems Have the developers work on what they are actually getting paid for Trend of embracing DevOps Shifting the production responsibility more onto the developer’s Incentivizing developers People don’t account for integration Continuous integration Trends on what customers are asking for Safety Docker containers And much, much more! Links: Azure Microsoft Build VSTS @orizhr Ori’s GitHub Gopi’s GitHub @gopinach   Sponsors Kendo UI Linode FreshBooks Picks: Charles .NET Rocks! Shure SM58 Microphone Zoom H6 Ori Fitbit Pacific Northwest Hiking Gopinath Seattle, WA

Panel: Charles Max Wood Sia Karamalegos Nader Dabit Special Guests: Jared Palmer In this episode of React Round Up, the panel discusses the article React, Redux, and JavaScript Architecture with the author James Sinclair. James is a web developer in Australia and he works at Squiz were he focuses on building a digital web place. They talk about his article and why he chose to write it, where he falls on the whole Redux debate, how to convince people to come to Redux, and much more! In particular, we dive pretty deep on: James intro React, Redux, and JavaScript Architecture Why were the people you are working with wary of leaving JavaScript? jQuery Great article on explaining why we use React Why React can be fast Is your team now moving to React or have they already moved over? Where do you fall on the Redux debate? Redux’s “disadvantages” are actually advantages What is your current stack of choice? Downshift Conditioner.js Most React tutorials assume you’re working on a single-page web app Sprinkles of jQuery Learning Redux helps to learn in a more functional way Functional programming as an influence to learn Redux Managing state How do you convince someone to learn Redux? Thoughts on GraphQL Apollo Server and Prisma Stimulus Apollo Link State And much, much more! Links: React, Redux, and JavaScript Architecture Squiz JavaScript jQuery React Redux Downshift Conditioner.js GraphQL Apollo Server Prisma Stimulus Apollo Link State jrsinclair.com @jrsinclair James’ LinkedIn James’ GitHub Sponsors Kendo UI Loot Crate FreshBooks Picks: Charles Being around family and friends Spend your life doing the things that really matter Sia Artificial Intelligence Machine Learning Nader React Native Training YouTube Channel Nader’s YouTube James Highland.js Functional Programming

Panel: Charles Max Wood Special Guests: Rachel MacFarlane and Matt Bierner In this episode, the React Round Up panelists discuss Visual Studio Code with Rachel MacFarlane and Matt Bierner, who are both developers on Visual Studio Code. They talk about what the workflow at Visual Studio Code looks like, what people can look forward to coming out soon,  and how people can follow along the VS Code improvements on GitHub and Twitter. They also touch on their favorite extensions, like the Docker extension and the Azure extension and their favorite VS Code features. In particular, we dive pretty deep on: Rachel and Matt intro Month to month workflow of Visual Studio Code VS Code JavaScript, TypeScript, and Mark Down support Working on GitHub and within the community Check out new features incrementally with insiders Community-driven work What is coming out in Visual Studio Code? GitHub helps to determine what they work on Working on Grid View Improved settings UI Highlighting unused variables in your code Improvements with JS Docs Dart Visual Studio Extension API How do people follow along with the VS Code improvements? Follow along on GitHub and Twitter Download VS Code Insiders Have a general roadmap of what the plan is for the year Technical debt week What do you wish people knew about VS Code? Favorite extensions Docker extension and Azure extension And much, much more! Links: Visual Studio Code JavaScript TypeScript Dart VS Code GitHub @Code VS Code Insiders Docker extension Azure extension Rachel’s GitHub Matt’s GitHub MattBierner.com @mattbierner Sponsors Linode Angular Boot Camp FreshBooks Picks: Charles Orphan Black Avengers: Infinity War Fishing Rachel GitLens Matt The Bronx Warriors

Panel: Nader Dabit Special Guests: Jared Palmer In this episode of React Round Up, the panel discusses Razzle and other projects with Jared Palmer. Jared is the lead engineer at The Palmer Group, where he spends his time building apps and services for companies that have been underserved by the recent technological changes. They talk about what Razzle is, the benefit of server-side rendering, and the difficulties he faced putting this project together. They also touch on why he chose to create Razzle and some of his other projects like Backpack and After.js. In particular, we dive pretty deep on: Jared intro How he got into programming Fell into programming by accident What is Razzle? Create React App with server-side rendering Gatsby Goal of Razzle What are the benefits of adding server-side rendering? The power of React Next.js React can hydrate once it renders on the server Razzle is thin layer around 2 Webpack watch tasks How do you handle routing? React Router After.js Performance pros to server-side rendering Is an app built in Razzle still considered a single-page application? React Resolver What were the technical difficulties putting Razzle together? Why made you want to create this? Wanted direct control over the project Backpack And much, much more! Links: The Palmer Group Razzle Create React App Gatsby React Next.js Webpack React Router After.js React Resolver Backpack The Palmer Group GitHub Jared’s Medium Jared’s GitHub @jaredpalmer Sponsors Kendo UI Digital Ocean FreshBooks Picks: Nader Proton Native Jared Guess.js Garden

Panel: Charles Max Wood Special Guests: Matt Hernandez and Amanda Silver In this episode, the JavaScript Jabber panelists discuss Visual Studio Code and the VS Code Azure Extension with Matt Hernandez and Amanda Silver at Microsoft Build. Amanda is the director of program management at Microsoft working on Visual Studio and VS Code. Matt works on a mix between the Azure and the VS Code team, where he leads the effort to build the Azure extensions in VS code, trying to bring JavaScript developers to Azure through great experiences in VS Code. They talk about what’s new in VS Code, how the Azure extension works, what log points are, and much more! In particular, we dive pretty deep on: Amanda intro Matt intro What’s new in VS Code? VS Code core VS Live Share Shared Terminal Now have Linux support Live Share is now public to the world for free What would you use Shared Terminal for? Are there other things coming up in VS Code? Constantly responding to requests from the community Live Share works for any language How does the Azure extension work? Azure App Service Storage extension Azure Cosmos DB What are log points? All a part of a larger plan to create a better experience for JS developers Visual debuggers Is it the same plugin to support everything on Azure? Want to target specific services that node developers will take advantage of And much, much more! Links: Visual Studio VS Code Azure Live Share Azure Cosmos DB Microsoft Build Azure App Service Amanda’s GitHub @amandaksilver Matt’s GitHub @fiveisprime   Picks: Charles Orphan Black Shout out to VS Code team Battle of the Books   Matt The Customer-Driven Playbook by Travis Lowdermilk The Speed of Trust by Stephen M.R. Covey Yes, And by Kelly Leonard Digital Marketing For Dummies by Ryan Deiss Ed Gets His Power Back Kickstarter   Amanda Microsoft Quantum Development Kit for Visual Studio Code Iggy Peck, Architect Tek by Patrick McDonnell