Real World React
Real World React
  • 126
  • 655 815
Web Development in the Age of AI
The future of frontend development in the age of AI & AGI
Artificial intelligence has made heretofore unfathomable gains in capability, utility, and popularity since the release of ChatGPT in November 2022. The impressive capabilities are usurped only by the speed at which they are evolving and improving. So what does this mean for frontend development -- or for engineering itself? These are fascinating questions to explore -- with a potential for a paradigmatic shift the likes of which we haven't seen since the Industrial Revolution or the dawn of the World Wide Web. Join us as we discuss these ideas and more with Sean Grove & Swyx -- who will help us to contextualize these changes with insight and even some demonstrations of the technologies & concepts discussed.
About Sean Grove
Sean Grove is a seasoned tech leader and software engineer who's passionate about innovation and making complex problems simple. With a strong background in programming languages like Rust, Clojure, and OCaml, Sean is uniquely positioned to bridge cutting-edge technology with real-world solutions. He has even founded two Y-Combinator startups and sold OneGraph to Netlify in 2021, where he now serves as Principal Architect. Recently, Sean has ventured into the world of machine learning, working on projects like Journaliza, Prator, and Prof Dumbot. These projects aim to help developers and users leverage AI to enhance productivity and communication, and he's firmly in the camp that this is only the beginning of how ML will impact daily life and developer tooling. His passion for exploring new frontiers in this exciting and rapidly evolving field is contagious, and he's always eager to push the limits of what's possible with technology.
About Shawn Swyx Wang
Wwyx has helped Developer Tools cross the chasm at AWS, Two Sigma, and three devtool unicorns - Netlify, Temporal, and most recently at Airbyte. He has started and run communities for hundreds of thousands of developers, like Svelte Society, /r/reactjs, and the React TypeScript Cheatsheet. His blog (swyx.io/ideas) covers Tech, Careers, and Indie Hacking, and his nontechnical writing was published in the Coding Career Handbook for Junior to Senior developers. He's currently writing and podcasting on AI at latent.space
Recorded live in San Francisco at Reactathon 2023. Learn more at reactathon.com
Переглядів: 1 407

Відео

Making state management intelligent - David Khourshid
Переглядів 1,8 тис.Рік тому
Making state management intelligent Managing state is complicated. Humans are even more complicated. As developers, it's our job to deliver seamless and intuitive user experiences, but the sheer complexity of human behavior and the real world can make this a daunting task. In this talk, we'll explore a radical new approach to app development where language models (LLMs) and reinforcement learni...
Modern CSS - A fireside chat with Nicole Sullivan
Переглядів 1,1 тис.Рік тому
Nicole was lucky enough to be a part of 3 major evolutions in the web. During the first, she introduced components to CSS and HTML when she created the first design systems in 2006 During the second, she was at Meta when the precursor to React (XHP) was created in 2009 The next one is happening now! After working as a web developer, Nicole joined Chrome as a PM so she could solve developer’s ch...
Concurrent React Made Easy - Henrique Inonhe
Переглядів 1,4 тис.Рік тому
Concurrent React Made Easy UI’s are composed of fast parts, and slow parts in terms of how responsive they are to user interaction. React's concurrent renderer decouples the fast parts from the slow parts by allowing us to render the slow parts in the background without blocking the fast parts, so that each part can respond to user interaction at its own pace. In this talk, we'll explore Concur...
The long-tail of type safety - Simon Sturmer
Переглядів 532Рік тому
The long-tail of type safety So you've added TypeScript to your codebase, tweaked your tsconfig file and you're flying high with the confidence of no more runtime exceptions and the joy of being able to confidently refactor your code, right? I've been there, it's a great feeling. But as you soon discover, adding TS to your code is only the first step of true end-to-end type safety. In fact, it'...
The time to go full stack is now - Andre Landgraf
Переглядів 1,3 тис.Рік тому
The time to go full stack is now Do you currently feel stuck working on a React SPA? Is the performance declining? Then it's time to sit down with the decision-makers at your company and convince them to unlock the full potential of the web platform. It is 2023, and the JavaScript ecosystem has never been stronger. In this talk, I want to make 7 points to convince your boss to go full stack. On...
Unlocking the Mystery of React's Re-Rendering: Ankita Kulkarni
Переглядів 2,1 тис.Рік тому
Unlocking the Mystery of React's Re-Rendering Your users will not care what tech you used but how fast your app loads. Have you used a hot new stack that everyone loves but still don’t know how to make it performant? Well, it’s because we think about performance as a after-thought after it becomes a bottleneck and when our infra gets costly, ouch! But there is a way to solve this, introducing C...
Next-Gen Server JavaScript: Web Standards - Wes Bos
Переглядів 2,1 тис.Рік тому
Next-Gen Server JavaScript: Web Standards What the heck is the Edge? Why did the creator of Node.js make Deno? Heard of Bun? Why can't you use some Node.js APIs in Cloudflare workers? There are more serverside JavaScript runtimes than browser engines! This talk will dive into each of them, and how we can use them to render, stream, intercept and distribute our applications. More importantly, we...
Discussion on React server components with Ryan Carniato, Tanner Linsley, & Ben Holmes
Переглядів 2,4 тис.Рік тому
You've heard the case for React Server Components from the React Core Team, Vercel, and Next.js. But what is the reaction to these patterns and technologies from other members of the extended community? In this panel, we explore how 3 leaders in the community perceive RSCs both for the community at large and within their own niche. Shruti Kapoor Shruti is a Lead Engineer at Slack and is passion...
The Costs & Benefits of React Server Components: Jeff Escalante
Переглядів 4,7 тис.Рік тому
The Costs & Benefits of React Server Components React server components (RSC) were initially announced in 2020 and finally made broadly available as a beta via next.js a few months ago. There has been talk and hype around them for years, but genuine understanding of what they are, how they work, and where they shine vs struggle is in short supply. In this talk from the former engineering manage...
Splitting the Work: Streaming Server Rendering with Suspense: Shaundai Person
Переглядів 3,4 тис.Рік тому
Splitting the Work: Streaming Server Rendering with Suspense Many React developers use server rendering to improve performance. Before React 18, however, all four (4) steps in the server rendering process (data fetching, rendering to HTML, loading JavaScript, and hydrating) had to be completed for the entire app at once. This meant that a bigger or more complex part of your app would block othe...
A Component is worth 1000 APIs: Colin Sidoti
Переглядів 1,8 тис.Рік тому
A Component is worth a thousand APIs After a decade of REST APIs, developer tools have evolved to speak a new language: React Components. From Next.js's "Image" to Clerk's "SignIn", components have rewritten the rulebook for how much power can be packed into a single line of code. They bundle a frontend with an API, and offer a ridiculously fast, 'lego block' integration experience. But what ma...
The Future of React is Us: Theo Browne
Переглядів 3,9 тис.Рік тому
The future of React is us From components to JSX to hooks, React has been a beacon of innovation for the web dev world. It didn’t start that way though. When we first saw React’s abstractions in 2012, we were horrified. We eventually were convinced. Now, the roles have reversed. Gatsby, Next and Remix all showed the need for React on the server. It took a bit, but the React team caught on. For ...
How NOT to build a video game - Christoph Nakazawa
Переглядів 1,1 тис.Рік тому
How Not to Build a Video Game Do easy solutions come at the expense of high performance? In this talk, we'll explore this question as I build a video game from the ground up with JavaScript & React. Along this journey, you'll gain valuable insights into rapid prototyping, test infrastructure, and a range of CSS tricks that can be applied to both game development and your day-to-day work. And pe...
Latent Space Podcast with guest Wes Bos, LIVE from the Boom Boom Room
Переглядів 409Рік тому
Latent Space Podcast hosts Shawn Swyx Wang & Alessio Fanelli present their popular podcast live at the after-afterparty at Reactathon 2023! They discuss agents and get Wes' general thoughts on AI technologies. Sponsored by OpenSauced, which provides enterprise insights into your open-source contributions. Learn more at opensauced.pizza/ 00:00 - Preview 01:39 - Swyx & Alessio welcome 02:52 - Int...
Google Chrome Aurora with Houssein Djirdeh
Переглядів 388Рік тому
Google Chrome Aurora with Houssein Djirdeh
Multiplayer doesn’t have to be hard - Paul Butler
Переглядів 414Рік тому
Multiplayer doesn’t have to be hard - Paul Butler
Opt-in design: A new era in web development - Ben Holmes
Переглядів 1,3 тис.Рік тому
Opt-in design: A new era in web development - Ben Holmes
Building Static Sites with Yext - Aaron Pavlick
Переглядів 269Рік тому
Building Static Sites with Yext - Aaron Pavlick
The future of React is Us - Theo Browne
Переглядів 398Рік тому
The future of React is Us - Theo Browne
Discussing tRPC & GraphQL with Theo Browne & Max Stoiber
Переглядів 8 тис.Рік тому
Discussing tRPC & GraphQL with Theo Browne & Max Stoiber
Reflections on a career managing React with Tom Occhino
Переглядів 3,8 тис.Рік тому
Reflections on a career managing React with Tom Occhino
On the merits & limitations of React & single-page apps
Переглядів 10 тис.Рік тому
On the merits & limitations of React & single-page apps
The future of Jamstack & Serverless
Переглядів 522Рік тому
The future of Jamstack & Serverless
New JS runtimes Deno & Bun - Shawn Swyx Wang
Переглядів 1,8 тис.2 роки тому
New JS runtimes Deno & Bun - Shawn Swyx Wang
The State of Serverless 2022: Jeremy Daly
Переглядів 4,2 тис.2 роки тому
The State of Serverless 2022: Jeremy Daly
Syntax.fm Live at Reactathon 2022!
Переглядів 3,7 тис.2 роки тому
Syntax.fm Live at Reactathon 2022!
The third age of JavaScript: Three years in - Swyx
Переглядів 7 тис.2 роки тому
The third age of JavaScript: Three years in - Swyx
Tame the Component Multiverse: Michael Chan
Переглядів 4,4 тис.2 роки тому
Tame the Component Multiverse: Michael Chan
React Native: 2022 & Beyond - Gant Laborde & Jamon Holmgren
Переглядів 4,6 тис.2 роки тому
React Native: 2022 & Beyond - Gant Laborde & Jamon Holmgren

КОМЕНТАРІ

  • @PRIST.A.C
    @PRIST.A.C 12 днів тому

    Shaundai Person much love

  • @hamzamiloudamar8162
    @hamzamiloudamar8162 28 днів тому

    As someone who's always struggled to understand rendering patterns, this article series was a lifesaver. It finally clicked for me! The conversational style makes it feel like you're chatting with a friend, and the topics are super relevant. Highly recommend checking it out! www.miloudamar.com/blogs/rendering-pattern-introduction

  • @yoJuicy
    @yoJuicy Місяць тому

    honestly one of the best talks ive come across for react.

  • @alpercugun-gscheidel6988
    @alpercugun-gscheidel6988 2 місяці тому

    There are no alternatives. Just like we don't raw dog javascript (we use Typescript), we also don't raw dog the DOM. Please.

  • @alpinelogic
    @alpinelogic 4 місяці тому

    Oh boy, this conversation was such an eye-opener to the ignorance surrounding React devs

  • @hasan_haja
    @hasan_haja 4 місяці тому

    This has been my go to recommendation recently: ua-cam.com/users/clipUgkx0x1Df8hcTvmzqaGxCQI3atckoxquOmBW?si=kWkeqlkntdSDSscw I think a fundamentals-first approach is more valuable in the long run rather than hitting the ground running with a framework.

  • @Luisllaboj19
    @Luisllaboj19 4 місяці тому

    I wish Lydia had a series about how all these features work now in the App Router, her content and diagrams are SO useful

  • @aniokechukwudi2472
    @aniokechukwudi2472 7 місяців тому

    Hey, lydia .. I just want to thank you so much for sharing your understanding. You really amazing

  • @MrBINGEBOY
    @MrBINGEBOY 8 місяців тому

    Ryan crushed

  • @seanjohnson67
    @seanjohnson67 8 місяців тому

    The more we use functional components, the further we stray from the light of god.

  • @saorlandini0
    @saorlandini0 9 місяців тому

    Why is it that it took me 15 minutes in I realized Max had antlers? I need a break...

  • @PaulSebastianM
    @PaulSebastianM 10 місяців тому

    It's wonderful that the JS ecosystem keeps evolving and doesn't seem to want to slow down the pace of innovation, but there is something that has stopped evolving and that is JS itself. I think the number 1 major limitation that JS has compared to other languages and runtimes that offer the same kind of development propositions for web apps, like C#, Go or Elixir, is its single threaded design.

  • @davidmichaelwallace
    @davidmichaelwallace 10 місяців тому

    I’m suddenly very aware of how much Kent I’ve been watching that I can identify his voice from the audience 😅

  • @user-sd5le3tl7n
    @user-sd5le3tl7n 10 місяців тому

    Thank too much for clearly explanation!

  • @nazarshvets7501
    @nazarshvets7501 11 місяців тому

    Idk about u, but i feel scammed

  • @mirazking7694
    @mirazking7694 11 місяців тому

    What should i Do? Is I Saw Her Or see On Her Presentation.

  • @zachaluza3410
    @zachaluza3410 Рік тому

    Damn, that speaker killed it

  • @RaducuGabriel
    @RaducuGabriel Рік тому

    is nobody gonna say anything about the fact that she is using memo and useCallback like it's a free pie?

  • @raphaeljcm
    @raphaeljcm Рік тому

    Great talk, loved the examples!

  • @WickramarangaAbeygunawardhana

    Looking at all the weird ways even senior devs use react hooks, I feel like they have provided us with hammers and wrenches where we actually needed scalpels and needles, or the other way around idk. Everyone has a new interpretation of what each hook does. Anyway isn't this ua-cam.com/video/HPoC-k7Rxwo/v-deo.html what useQuery and useSWR do?

  • @technocoh
    @technocoh Рік тому

    you go way to fast through your examples...

  • @madashindeinai4783
    @madashindeinai4783 Рік тому

    Nicole told so many interesting things! Thank you! But still qurious, the babylist team made sliders for 6-8 weeks or 68 😄

  • @josephh8117
    @josephh8117 Рік тому

    Relate v strongly with async struggles

  • @avimehenwal
    @avimehenwal Рік тому

    Hello World ! I am little new to JS/Ecmascript works. In the talk Lydia Hallie mentioned some great resources to look out for better understand the inner workings of js and ecosystem inside browser. Kindly please share links to your favourites resources for me as for me its still little difficult to narrow it down to good resources. All I get in my search results are stackoverflow and medium posts XD Some Personal Blogs would be nice as SEO underestimates them

  • @avimehenwal
    @avimehenwal Рік тому

    amazing amazing content XD Thankyou Lydia for sharing it. Cleared up so many things for me. Very high quality content and graphics

  • @thayto_dev
    @thayto_dev Рік тому

    🇧🇷

  • @goosebumpsfm
    @goosebumpsfm Рік тому

    nice to see new talks from Wes!

  • @madashindeinai4783
    @madashindeinai4783 Рік тому

    02:36:56 Ryan sold Solid Start to me 😀

  • @michaelangelovideos
    @michaelangelovideos Рік тому

    This is great thank you

  • @oliverhughes169
    @oliverhughes169 Рік тому

    Great talk and explanation of CSR vs SSR. This seemed like a talk that could have come from the React core team, using Netflix as an example site. Since Shaundai is working at Netflix, it would have been really interesting to see (at the end of the talk) a real world example of where Netflix adopted Suspense to improve the UX of their users, rather than just the hypothetical example app with a comments section (which was great for explaining the topic).

  • @yachujoshi
    @yachujoshi Рік тому

    Great Talk!!

  • @rockNbrain
    @rockNbrain Рік тому

    Great job Theo 🎉 tks

  • @nikilk
    @nikilk Рік тому

    does it make sense for teams building stuff that doesn't benefit from SEO, and the fast load times like e-commerce apps to consider RSC ? What if your building internal applications to help drive various business use cases. What's the pitch for RSC here ? How do I go around talking to my backend teams / decision makers to give Next / Remix a go ? One use case is reducing bundle size, but again for most internal apps the business doesn't care about that factor to consider switching frameworks.

    • @inwerpsel
      @inwerpsel Рік тому

      RSC mostly makes sense for apps that are largely static with small islands of interactivity. If your application is almost completely dynamic (say a visual editor), you don't have to use them.

    • @nikilk
      @nikilk Рік тому

      @@inwerpsel how about apps that are primarily grid driven with lots of crud operations ? All the data driving them come from existing endpoints. Any advantage going with NextJS ? Also a few graphs and charts to visualize all the data in the tables. I guess most internal applications supporting business are of that nature.

    • @inwerpsel
      @inwerpsel Рік тому

      ​@@nikilk Yeah that's indeed a more common type than a visual editor, I'm a bit biased because of what I'm currently working on ;) Both share the fact that there's quite a lot of interactivity throughout the entire page. The fact that you can ask data from a server and then have a large amount of flexibility of how to exactly render it, without necessarily hitting the server all the time to get slight variations of the HTML, probably makes RSC less useful for such a case.

    • @nikilk
      @nikilk Рік тому

      @@inwerpsel it appears unlike react hooks RSC has a much smaller niche case. That's then pretty much dead on arrival, if there isn't a compelling pitch to use it. I suppose the team behind Figma that heavily relies on WebGL on the browser has no reason to go the RSC direction too. If i ask my tech decision makers to give Next a go to reduce bundle size he'll laugh, saying you wanna go from X Mb to 500kb by overhauling the entire tech stack.. The ROI on that doesn't look good.

    • @inwerpsel
      @inwerpsel Рік тому

      @@nikilk If your technical leadership is that unwilling to set up a POC and just see how it works, and makes this kind of decisions purely based on some vague assumptions, then whatever you're building is probably DOA. If it doesn't make sense for your use case at all, that should be easy to find out. The pitch is, there will be applications where you don't have to ship JS at all, or like 1% of what you shipped when you had to hydrate the whole tree. It's not hard to imagine there's cases where that's compelling.

  • @developer_01
    @developer_01 Рік тому

    This is the best video for RSC. Thanks Jeff

  • @ThaboMosenthal
    @ThaboMosenthal Рік тому

    Enjoyed Theo's keynote

  • @WesBos
    @WesBos Рік тому

    Thanks for having me! Super fun conf

  • @mortallyatomic
    @mortallyatomic Рік тому

    Forgive my naive q - but at 14:25 Christoph mentions the server would control visibility. Even then, how would it actually be handled? Would the server not send any data about that particular foggy block at all to the opposing player? Only way I see this working is if we only send the data visible to P1. And that would mean computing the game state on the server for each player? Is this correct, or am I misunderstanding anything?

  • @ChaiFlyGuy
    @ChaiFlyGuy Рік тому

    Glad to see someone fighting to make developer's lives easier like Nicole!

  • @t3dotgg
    @t3dotgg Рік тому

    This is arguably the most important talk from Reactathon and it's a shame it won't get watched enough to reflect that :(

    • @misode
      @misode Рік тому

      Thanks for bringing me here!

  • @rootbeernineteen135
    @rootbeernineteen135 Рік тому

    Theo at 12:50

  • @palyanytsia
    @palyanytsia Рік тому

    I express my gratitude for the discussion and admiration of the guests. Despite the fact that their thoughts differ on many issues, it seemed to me that both of them are AI optimists. But I would like to hear the opinion of an AI pessimist as well. For example, what's gonna happen with beginner level jobs? Who barely mastered React or Photoshop recently. They don't live in San Francisco, they don't have the title "principal architect". Telegraph operators are often cited as an example, most of whom have retrained as telephone operators. But now there is no such luxury: professions disappear faster than new ones appear, and the speed of people's learning is not unlimited. And what will happen in 5-10 years, when millions or tens of millions of people will be left without work, because one person + AI will be able to replace today's dozen?

    • @benjamindunphy8844
      @benjamindunphy8844 Рік тому

      Organizer here. Those conversations are happening, but it's not the right conversation at a technical conference (at least this one). Engineers are implementers, and we're excited about the technologies and want to understand how to use them. There will certainly be regulation, societal norms, best practices for business, and perhaps a fundamental shift in work that live upstream from the domain of engineering. This was a discussion and not a talk because this is a brand new domain for this audience in particular (mostly frontend engineers) and we wanted to highlight for them what these technologies are capable of on an introductory technical level. I'll be organizing a new conference for AI Engineers that dives deeper into these subjects so watch for that. The implications you speak of can be mitigated with open education for engineers to learn, adopt, & evolve. Engineers of today no longer code with punchcards -- and the engineers of tomorrow may no longer code with VS Code and JavaScript. But I hear you -- as I mentioned on the panel I think the main issue is the velocity at which these technologies are advancing. But I think as our human brains come around to understanding it, and we break out of old established patterns of engineering, we can be a bit more optimistic about the situation as it is less alien and more of "yet another tool" to be used. I think that engineers who today fear this tech will soon grow to love it as it will enable them to move faster and be more productive than they ever dreamed.

  • @rockNbrain
    @rockNbrain Рік тому

    Great job Henrique, tks a lot!!

  • @aristosxanthus658
    @aristosxanthus658 Рік тому

    Great explanation of CSR vs. SSR

  • @aristosxanthus658
    @aristosxanthus658 Рік тому

    Never thought about the wasted energy rerendering static components like a logo or button.

  • @rockNbrain
    @rockNbrain Рік тому

    Great job Wes 🎉

  • @dominuskelvin
    @dominuskelvin Рік тому

    Amazing talk Wes. I’m always fascinated at Server side JavaScript

  • @MrJonathandsouza
    @MrJonathandsouza Рік тому

    The migration from AngularJS to Angular 2 was my Vietnam.

  • @JLarky
    @JLarky Рік тому

    Instant classic comparing RSCs with Angular 2

  • @scottb9937
    @scottb9937 Рік тому

    Next-Gen Server JavaScript: Web Standards Wes Bos 16:28 Unlocking the Mystery of React's Re-Rendering 43:00 The time to go full stack is now 1:05:00 The long-tail of type safety 1:51:54 Concurrent React Made Easy 2:13:41 How Not to Build a Video Game 2:30:00 Lunch & Learn: Improving Deploy Previews with the new Xata workflow 4:44:24 Fireside: Modern CSS 5:10:38 Making state management intelligent 5:40:35 Fireside: The future of frontend development in the age of AI & AGI 6:17:19