React Round Up23 Loka 2018

RRU 034: “Progressive Web Apps” with Aaron Gustafson / Live at Microsoft Ignite

Panel:
- https://twitter.com/cmaxw?lang=en
Special Guests: https://github.com/adtm In this episode, the Chuck talks with https://www.aaron-gustafson.com who is a web standards and accessibility advocate working at Microsoft. Aaron and Chuck talk about PWAs and the ins and outs of these progressive web apps. Check out today’s episode to hear more! Show Topics: 0:36 – Chuck: Our guest is Aaron, say HI! 0:41 – Aaron: Hi! I have been working on the web for 20 plus years. I am working on the Edge team for accessibility among other things. I have done every job that you can do on the web. 1:08 – Chuck: That is one of OUR publications? 1:14 – Aaron: No the communities. I joined the staff as editor in chief for 1.5 year now. It’s a nice side project to do. 1:36 – Chuck: I thought it was a commercial thing. 1:40 – Aaron: No it’s volunteer. 1:52 – Chuck: Talk about your web background? 2:02 – Aaron: I remember the first book I got (title mentioned). My first job on the web (cash) I was the content manager in Florida and this was in 1999. Gel Macs just came out. I relocated from FL to CT and worked for other companies. I got into CSS among other things. It’s been a wild ride and done it all. 3:52 – Chuck: Let’s talk about web standards? 4:05 – Aaron: It depends on the organization and what the spec is and where it originates. It’s interesting to see how HTML developed back in the day. When standardization started working then everything started to converge. Everything is a little different now. Some specs come out from companies that... (Apple, https://responsiveimages.org, and Grid are mentioned among other things.) 7:37 – Chuck: We set up to talk about PWAs. Where did PWAs come from? 7:57 – Aaron: Modern web design, best web applications. Being secure. One of the underpinnings came out from Google and they have been supporters of that. Firefox is working on installation as well. The Chrome implementation is weird right now, but it becomes an orphaned app. It’s like the old chrome apps where in Windows you can install from the Microsoft store. But the case of Chrome you don’t have to go through the store. 10:14 – Chuck asks a question. 10:24 – Aaron answers. 11:53 – Chuck: What makes it a progressive web app rather than a regular website? 12:05 – Aaron: The definition is running on HTPS and... Aaron defines the terms that Chuck asks at 11:53. 12:43 – Aaron: Of course you can push forward if it makes sense from the baseline. 12:56 – Chuck: We have an Angular podcast, and we talked about PWAs and nobody had a good definition for it. 13:18 – Aaron. 13:22 – Chuck: What are the pros of having a PWA? Let’s start with the basics first. 13:33 – Aaron: The ability to control how you react to the network. We development is challenging maybe in other areas because of the lack of control and how your code gets to your users. Any special needs that YOU might have. Aaron goes into detail on this topic. 17:14 – Chuck: Is the service worker the star for PWAs? 17:20 – Aaron: In a way, kind of. Aaron goes into detail on this topic. Share 2 is mentioned, too. 19:42 – Chuck: If the service worker intermediates between the browser and the page / Internet would it make sense to have your worker have it load and then load everything else? Cause you have those Web Pack now. 20:14 – Aaron: Some people would consider it but I wouldn’t necessarily. I am not a fan for that. If anything goes wrong then nothing loads. I remember back when... 22:23 – Aaron: That is a lot of overhead. 22:34 – Chuck: I am wondering what is the best practice? How do you decide to pull in a service worker and then move into more complicated issues? 22:53 – https://www.youtube.com/channel/UCDWpGhFB8j6Kia4B_MKUG3w: Progressive Web App where they talk about their evolution about this. 25:17 – https://www.freshbooks.com/?adgroupid=51893696397&ag=%255Bfreshbooks%255D&camp=US%2528SEM%2529Branded%257CEXM&campaignid=717543354&crid=289640536553&dclid=CNGHh6XkmN4CFQO5TwodEqEA2w&dv=c&gclid=EAIaIQobChMIzpSso-SY3gIVDoxpCh0-HwkaEAAYASAAEgI6JfD_BwE&gclsrc=aw.ds&kw=freshbooks&kwid=kwd-298507762065&ntwk=g&ref=ppc-na-fb&source=GOOGLE Code: DEVCHAT. 26:25 – Chuck: In order to be a PWA you don’t need to have a push notification. 26:38 – Aaron: I don’t think anyone would want a push notification from me. 27:12 – Chuck: What features do PWAs have? 27:18 – Aaron: Features? None of them really, other than push notifications, it’s just standard it’s going to make an App feel more App “y”. If that’s something you want to do. It’s up to you to determine that. There is going to be like push notifications – sending person new updates about the order. If you were a new site you want to make sure you are not doing a push notifications on everything cause that would be too much. Exercising care with the capabilities with what the users are doing on your computer. This is a person that you are dealing with. We need to seem less needy. Give users control of how they want to use it. For example, Twitter will give you that control per user. 30:56 – Chuck: Could you also do it for different parts of the page? 31:01 – Aaron: It’s different scopes. Your servicer worker has different scopes and it needs to be in the root folder or the JavaScript folder. You can have different workers but they will come from different scopes. 31:32 – Chuck gives a hypothetical example. 31:50 – You can do a bunch of different service workers. 32:11 – Chuck: This is why we create different hierarchies in our code. 32:26 – Chuck: Is there a good point where people can be more informed with PWAs? 32:40 – Aaron: https://www.pwastats.com and https://twitter.com/pwastats with Cloud 4. 33:22 – Chuck asks a question. 33:26 – Aaron: Yes. If you are a photographer you don’t want to cash all of your photos on someone’s hard drive. We have to be good stewards of what is operating on people’s hard drives. Even something as simple as a blog can benefit from being a PWA. 35:01 – Chuck: Are there new things that are being added to a PWA? 35:12 – Aaron: A new feature is the background sync. Aaron: What is native and what is web? 36:33 – Chuck: Yeah it can detect a feature in your machine. Dark mode is... 36:48 – Aaron: It would be nice to see things standardized across the board. 37:00 – Chuck: How does this play into https://electronjs.org or Android or...? Do those need to be PWAs? 37:16 – Aaron: It depends on what you are building. So I talked with people through Slack and they want total control. If you r desire is to shift the same experience then https://electronjs.org can make a lot of sense. They will have to pay a premium, though, your users. If you are aware of that then go the https://electronjs.org route. But for most cases then https://electronjs.org might be overkill for you. You don’t need that extra overhead. 39:55 – Aaron continues. Aaron: I think the major benefit of PWA is... 41:15 – Chuck: The other angle to that is that in an Electron app does it make sense to use a PWA things? 41:23 – Aaron: Yes that makes sense. 41:34 – Unless for some reason you need to unlock into an older version, which I hope is not the case b/c of security reasons. 41:55 – Aaron continues. 42:34 – Chuck: Where can we find you? 42:35 – Aaron mentions Twitter and other sites. See Links! 43:02 – https://www.digitalocean.com/ Links:
- https://rubyonrails.org
- https://angular.io/guide/quickstart
- https://www.pwastats.com
- https://twitter.com/pwastats
- https://electronjs.org
- https://www.aaron-gustafson.com
- https://www.linkedin.com/in/aarongustafson
- https://twitter.com/AaronGustafson
- https://github.com/aarongustafson
- https://www.youtube.com/channel/UCDWpGhFB8j6Kia4B_MKUG3w
- https://medium.com/@AaronGustafson
- https://devchat.tv/get-a-coder-job/
- https://twitter.com/cmaxw?ref_src=twsrc%255Egoogle%257Ctwcamp%255Eserp%257Ctwgr%255Eauthor
Sponsors:
-

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

Kokeile Premiumia

Nauti 14 päivää ilmaiseksi

Tilaa Premium

Jaksot(310)

Exploring Micro Frontend Architecture with Florian Rappel - RRU 283

Welcome to React Roundup, the podcast where we keep you updated on all things React related! In today's episode, we have an enlightening discussion featuring Paige Nedringhaus as host, our panelist TJ Van Toll, and our special guest, Florian Rappel, a solution architect from Munich, Germany. Florian, a noted figure in the web community, especially in TypeScript, React, and Microfrontends, dives deep into a variety of engaging topics.Throughout the episode, we explore the complexities and benefits of using React, often described as a "black box" for the way it abstracts away many details from developers. We also delve into the intriguing world of Microfrontends, where Florian provides a comprehensive overview of this approach, discussing its practical implementation and the organizational shifts it can entail.Additionally, Florian introduces his new book, "The Art of Microfrontends," and shares insights on how to manage complex front-end projects more efficiently. Whether you're a seasoned developer or new to the ecosystem, this episode offers a wealth of knowledge and practical advice to enhance your development practices.So, tune in for an insightful journey through the realms of React and Microfrontends, and get ready to elevate your coding game!Become a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

24 Tammi 53min

React Component Tests for Humans with Miroslav Nikolov - RRU 282

On this episode of React Round Up we chatted with Miroslav Nikolov, a UI developer at one.com, about his approach to unit testing React components. Miroslav discussed writing components in a human-friendly way, using the library UnexpectedJS. We also talked about Miroslav’s blog, including how he got started with it, and some of the tools he used, like Gatsby and Mailchimp. This is a great episode if you’re looking to learn more about how to approach unit testing in React.Linkswebup.org/blog | Miroslav NikolovUnexpectedJSReact Component Tests for Humans | CSS-TricksmailchimpSubstackPicksMiroslav- erikras.comMiroslav- Application State Management with ReactPaige- Tom Clancy's | Jack RyanTJ- DREAM SPORT Bike Computer Bicycle Speedometer and Odometer 16-Function Wired Bike Computer WaterproofBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

8 Tammi 39min

Run NextJS and Node in the Browser ft. Eric Simons - RRU 281

Eric Simons joins the round-up to discuss the latest advancements made by StackBlitz that enables you to run NodeJS in the browser. Eric expands that to the work they've done with the NextJS team to run NextJS in the browser without the need to have a server in the background.LinksIntroducing WebContainers: Run Node.js natively in your browserStackBlitzStackBlitzEricSimons – StackBlitzTwitter: Eric Simons ( @ericsimons40 )PicksEric- ViteJack- WestworldPaige- Elgato Wave:3TJ- Podcast from The VergeBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

1 Tammi 47min

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

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 seriesBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

25 Joulu 202445min

React Ecosystem: Libraries, Tools, and Third-Party Integrations - RRU 279

In today's episode, Lucas and Peter dive deep into the world of front-end frameworks with a captivating discussion featuring PRANTA Dutta, a seasoned React Native developer. Pranta shares his journey transitioning from Vue to React, highlighting both the challenges and advantages of React's manual configurations and rich third-party ecosystem. They explore the contrasts between frameworks like React, Angular, and Flutter, delving into the trade-offs between their built-in features and flexibility. From the complexities of using Flutter's custom canvas painting to the streamlined utilities for notifications and Firebase, we cover it all. They also tackle the ongoing debate of native versus hybrid mobile app development, with insights into the Kotlin Multiplatform project and the importance of choosing the right tools based on project needs.Join them as they unravel the intricacies of React's success and shortcomings, discuss the merits of design patterns in both Flutter and React, and examine the responsibilities developers hold in shaping their applications. Stay tuned for a valuable conversation packed with industry insights and practical examples!LinksWhy React Won the Front-End RaceSocialsLinkedIn: PRANTA DuttaBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

18 Joulu 202454min

Error Reporting and Bug Monitoring with James Smith - RRU 278

In this episode of React Round Up we chatted with James Smith from Bugsnag. We talked about the importance of error monitoring and reporting, and how to actually implement those workflows in your production apps. James shared a number of tips for React developers, like what are the most common errors and how you can help prevent them (hint: linters help a lot). We also got into mobile, and what developers can do to protect against third-party SDK errors. Picks TJ - https://www.amazon.com/What-Doesnt-Kill-Environmental-Conditioning James - Fall GuysBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

11 Joulu 202444min

How to Structure Your React Projects - RRU 277

Akash Joshi Is a frequent blogger across many of the larger blogs across the internet.He joins the Round Up to share his opinions on how you should put your React applications together as well as some tips on where you shouldn't put files and where you should avoid putting specific types of files.Some of this is inspired by projects like Next.js and others by his own experience. Paige and TJ chime in with their experience to help provide more context to the conversation.LinksLearn Structuring React Projects with a Dogs App [⚛ + 🐶]A Better Way to Structure React ProjectsImproving my OSS library and taking steps towards improving my YT qualityAkash JoshiThe Writing Dev Akash Joshi - thewritingdev - YouTubeTwitter: Akash ( @thewritingdev )PicksAkash- Lapel MicrophonePaige- Harney & Sons Earl Grey Loose Leaf TeaTJ- Kombucha TeaBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

4 Joulu 202435min

Building Component Libraries with Kathryn Grayson Nanz - RRU 276

Senior Frontend Engineer Kathryn Grayson Nanz joins the React Round Up team to talk about all things component libraries. Kathryn shares her experiences building not one but two component libraries, as well as tips and tricks on the benefits of shared libraries, how to get buy in from product and developer teams, the best way to set up libraries and keeping them up-to-date. She also shares pitfalls to try and avoid when getting started with building a new library. Definitely a good listen for anyone debating whether an existing library or a brand new, custom one is the way to go for a project.LinksUI audit background from Brad FrostStorybookBubbleUphttp://kgrayson.com/PicksTJ - StravaPaige - Tresanti Standing DeskKathryn - NotionKathryn - RocketbookBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

27 Marras 202448min

Kaikki yhdessä sovelluksessa

Kuuntele kaikki suosikkipodcastisi ja -äänikirjasi yhdessä paikassa.

Sinulle valikoitua sisältöä

Podme-sovelluksessa kokoat suosikkisi helposti omaan kirjastoosi. Saat meiltä myös kuuntelusuosituksia!

Jatka kuuntelua koska tahansa

Voit jatkaa siitä mihin jäit, myös offline-tilassa.

Premium

9,99 €/kk

Kaikki premium-podcastit
Ei mainoksia
Ei sitoutumista, peruuta koska tahansa

Aloita 14 päivän kokeilu

Premium

13,99 €/kk

Kaikki premium-podcastit
Ei mainoksia
Ei sitoutumista, peruuta koska tahansa
Yksi lisäkäyttäjä

Kokeile 14 päivää maksutta

Suosittua kategoriassa Liike-elämä ja talous

Tarinat ja äänet, joita rakastat kuunnella

Kuuntele kaikki suosikkipodcastisi ja -äänikirjasi

Lue lisää