I remember when react first came out, I found a really good video from a game dev, explaining how react's rendering model is inspired by "immediate mode rendering" in graphics. Funny to see how we've come a full circle and people are now using react for graphics
At my work we're currently using React PDF and React Three Fiber and are looking to use React Email in the future. While none of them are best in class, the huge benefit for us is that as a small company and small dev team it's so much easier for anyone to work on systems using these with no prior exposure. Remotion looks perfect for one of my personal projects. Will check it out.
React email has been amazing to work with. Was previously been using handlebars templates and even ejs templates. I never knew about react-pdf. That will definitely simplify my pdf creation process.
React mail and react pdf are so dope. We (myself and one more person) wrote a big Course management webapps, we use react PDF to generate invoices and contracts and react mail for sending mails, like „he you have a course, accept it now in your panel“ or „you successfully added course change requests“. They made all our stuff very high end, especially because we where using easyinvoice before. Don’t forget: react-mail can also render Plaintext! We where handeling that ourselfs, which ended in a sync email html and plaintext (as expected)
I make a living selling D&D books, and react-pdf is such a godsend. There's a *couple* features I wish it had, that it doesn't yet, but wow this is miles better than any other option on the market right now. I've used react-three-fiber as well and it's an absolute life-saver too.
I have spent the past year preaching this exact topic everywhere. Nice to have a video from someone who explains it in simple terms that i can now show people
I bet that if a VR revolution happens in the future and we all ditch our current devices for VR headsets, that the first VR UI component framework would be based on React.
I really think that because React separates its render graph from rendering concerns, that alone makes it better than most UI systems. Efficiencies aside (yeah, diffing ain't great), having such separation just allows for so much flexibility. The React Three Fiber library especially. Unfortunately, I don't like authoring React (or any UI code), but can appreciate good design when I see it.
@@zemaumm It's a hierarchical graph of nodes that when enumerated (or visited) can be used to render something. The HTML DOM is a render graph for example. If you do computer graphics (i.e. 3D), it's usually called a Scene Graph. By react keeping it's render graph separated, it means it can map onto the DOM as well as anything else that also uses a graph to render things (for example, ThreeJs, WinForms, or any other UI system)
Even though React pushed this rendering-agnostic approach forward in JS, it was not only library that does so. Both Solid and Vue, heck even Angular already provides ways to plug in custom renderers (Solid being directly inspired by React's renderer).
@@BinaryReader ohhh, is that abstraction why like mentioned in the video the react is output structure agnostic ( it could be email html, pdf, webgl nodes ), but it’s input structure needs more improvement as people suggest ? ( diffing , no reactivity, JSX… etc ). I didn’t even know the word render graph but I think it makes sense now
I want to add React Ape , there is not much activity though. React Ape is a react renderer to build UI interfaces using canvas/WebGL. React Ape was built to be an optional React-TV renderer. It's mainly a renderer focused on creating things for TV, PS5, PS4, Nintendo Switch, PS Vita, PS3 and low memory devices.
I agree. It's getting out of hand. All this just to keep using JavaScript in ways it was never intended. I really think we need to switch to a new fixed type native language. Web Assembly? Rust? Dart? I don't know
@@ChristopherCricketWallace Web Assembly is the answer there. Since its a compile target not a language so by its very nature of existing it includes every other language in its confines (including javascript ironically enough) Basically what java was trying to do, without the disgusting language and with a much more lightweight runtime.
@@MrTeathyme ah yes I love downloading megabytes of runtimes everytime I visit a website, also no garbage collector and needs javascript to do pretty much anything
Funnily enough, first 3 major version of MJML were in React too. We gave up on it as it was too limited to ensure compatibility for non modern client (invalid HTML properties, non closed tags, external templating compatibility, outlook comments...)
There is a cool VS Code extension that converts .md files to .pdf. That one is the easiest way I found to make a .pdf but you're limited to markdown's functionality.
Anyone who’s an expert in any of those areas on interest would not use react but the native tools. These react implementations just help react developers become familiar with the tech and eventually move on to native.
By the way Remotion renders standard DOM elements too, fun thing is that you can inspect your elements in the video real-time too 😅 Yea, you can render a video with ffmpeg an stuff, but you can't really use a lot of cool animation libraries (like framer-motion) because you need to interpolate the state of every element for every frame in your video.
react-pdf has issues with generating the incorrect text, BE WARNED, it will visually look right in a PDF, but when you extract the text from it, it can be wildly wrong. I used it for a resume builder. I ended up entirely rewriting it to use regular react + puppeteer to make it into a PDF. I actually ended up ditching react for 11ty.
As far as I find those tools amazing, I am struggling to find a use case where you would chose them over already implemented (and more performant) non js solutions for some of the examples given. There definitely is otherwise, those tools wouldn't still exist after a while, but yeah, I am curious.
I just wish we could have a language fundamentaly based arround those concepts, declarativity & reactivity. It makes so many problems trivial to solve... Every new language people create is just another syntax for imperative functions with someones vision of the perfect type system.. I wonder why no one explored that path yet, maybe because everyone is too busy hating on react for being JS and "for the web", so they avoid studying its core concepts like the plague...
Reactivity predates react by a lot. Also, elm and svelte are technically their own languages that compile to JS. Even CSS is reactive (you can look at "corset" which builds on this idea). There are a ton of esoteric languages and DSLs that people have created to incorporate reactivity as a first-class citizen, but few have really taken off. At the end of the day, reactivity can introduce overhead and may not be the most performant way to program, so language developers may not want to be prescriptive about it.
This has actually helped me appreciate what React is as a technology a lot more. In the browser space, I was always put off by it as it felt like it was recreating too many things that were already built in to the HTML/CSS/JS stack. So Svelte and "less is more" frameworks always seemed objectively better. But I didn't realize that React was in a different ballpark from the outset by being more than a web framework, and *actively* pursuing that course of development. That definitely changes the value proposition.
@Theo, you are right. React wasn't built for the DOM (web). React can render in other environments without much hassle or perf hits but for the DOM, it becomes a real PAIN! This is why for the DOM in the browser, i will prefer SolidJS + signals over ReactJS
Last year, I used React to build a sub-app that would capture the image at the right inclination on top of the react-webcam using JS sensor APIs. React is pretty versatile.
I'm (slowly) making a top-down dungeon crawler game, and I decided to write it in ThreeJS because it's available through NPM (Better than my alternative EaselJS anyway), and I'd be able to take advantage of the lighting effects and 3D layering. I built a tech demo with a scene, a HUD, and even a film grain shader, and then I realized I'd need mouse interactions which are apparently done best in react-three-fiber, so I rewrote the whole thing. React-three-fiber is definitely janky when it comes to odd configurations like the HUD and the shader, but once you get to more typical things, it makes more sense.
Someone else already said it, Remotion IS rendering to the web and doing screen capture. Ffmpeg is just to stitch the images together into an mp4 and probably to add the audio. EDIT: it uses puppeter. Headless chrome but you can also open any browser to preview.
Holy shit React PDF?! I have been fighting Pandoc to manage our templated .pdf documents as code and FINALLY there is something with the flexibility I need. WTF thank you for this video!
Really well timed video for me personally. I got into web development about two months ago. Had been working with html css vanilla ever since. Started learning React 2 days ago and finally saw its beauty while making the tutorial tic-tac-toe game. Absolutely fascinated with how cool its structure is and how easy JSX is over html, i love it!
Wow! I rarely comment on videos, but at least two of the things you showed were precisely what I was looking for in the last six months. I am surprised by how I encountered this video. Thank you very much!
Yes please about Remotion! I've been super interested to see how it works but I just haven't really had a side project it applies to. Very interesting project
...Why was I recommended this video? I'm a die hard Rust, and tentatively WASM guy, lol. Regardless, this was a well presented video, and your excitement for these solutions really came through!
This is a really eyeopening video - I've just used react in wetland, and believed that it was it's only use case, but seeing these examples is really making me go wow...
Love this content as a React Developer, particularly its cross-compatibility feature (React Native). This would be vital to me when exploring the Web3 space in future, that's when developing smart contracts on decentralised apps.
Your ring light is too strong. Thanks for the video. I'm glad people talk about the realities of React -- both good and bad. Regardless, this constant onslaught of criticism is necessary for React to survive. It'll be around for a good while still, but I think we are all looking forward to improvements.
React was in fact built for the web. It just allows for more things to be built with it, but that doesn't change the fact that it is a library for JavaScript, the programming language of the web. If it really hadn't been made for the web, they wouldn't have made it in JavaScript and they wouldn't have put so much effort into making everything work perfectly to improve the web development.
Surprised you didn’t mention Raycast. I guess it’s kinda like react native, but they have a great react developer API for writing custom commands in their native swift app
The truth is that frontend communities often don't know data structures, algorithms and classic programming patterns and paradigms. And when they "invent" something, it's often glorified and used everywhere. I am not saying it's bad, react is good. But please please frontend community, study Knuth, study computer science. It will give you a better perspective and sound judgement. I ask about concurrency, I ask about virtual memory, I ask ask about algorithms, zero-copy and I always hear how great react virtual DOM is without any real info. Like it's some magic hard to understand, a religion almost, when in fact it's not, it's a standard data structure so common in CS.
Wow. This is the first time I've ever seen something interesting about React. I had always thought of React like Windows or Angular -- an inferior legacy platform continuing to exist because of the momentum of a very large legacy community! But how wrong I was! This is actually impressive.
The email and pdf use cases confuse me cause they are static documents. There is no rerendering or reacting going on. The usefulness seems to find from bringing the components or atomic design of the web to PDF and email which can also be done with templating libraries. React at it's core just handles *reacting* to state changes with hopefully the least necessary re-rendering possible while using a component, atomic design, pattern. It can be a state management and view-updating solution for discord bots, threejs, and cli tools with a familiar interface. But I don't see how this makes them an easy entry-point into a whole new domain. There's a lot more that goes into 3d graphics than updating values based on state and react-three drops you right into that complexity with its meshes, light sources, cameras. It may even be an extra layer of confusion to translate between threejs examples and how to do it in react-three. I'm baffled by the existence of react-nil. I get that it's just experimental and Theo says we should never use it -- I agree, fine if it's just made for fun/exploration. But still. React is a view library at the end of the day, regardless of what it's rendering to: email, pdf, 3d canvas, mobile, etc. React nil doesn't use the component pattern because nothing is rendered. There's no need to re-render if everything's null and maybe there are state changes? (idk how b/c we have all the info we need from the request on server side). So we've lost both core parts of react. We're left with, what this library clings to: the react lifecycle. Shoe-horning arbitrary (non-rendering) processes so they fit into the react lifecycle which was designed for rendering views sounds like a horrible violation of the interface segregation principle. Managing the user lifecycle like the docs are suggesting? You may want a model lifecycle which gives you creation, deletion, update hooks like nestjs and sailsjs provide instead of the render function or a useEffect.
I love such videos, I had faced issues while working with React Native for web, from basic stuff like responsiveness (I am not good at it) to some libraries not being compatible on web, I felt it was not worth it in the long run, if the web and mobile app will change independently. I feel React Native for web is a easy way to use common components for web and mobile, but seems to be creating more problems then it solves (for now). If anybody has a different experience or advice, I'd appreciate it, Thanks
think of these renderers as a form, that's really what they are. they teach react about a platform, what primitives it has (div, h, span, etc), which colors, formats, how events work, etc. react has a high level tool for making a renderer: react-reconciler. if you google it you can get an idea how it works.
babe wake up Theo posted another controversial video
babe will never get a full night's rest
React also renders my sleep paralysis demon
Does he look like me?
@@t3dotgglil bit
@@t3dotggnow I'm just picturing Theo standing in the corner of my room at 3am
He looks like Theo wearing those cartooney swim goggles :P
@@null_spacex He's just standing there... *MENANCINGLY* !
I remember when react first came out, I found a really good video from a game dev, explaining how react's rendering model is inspired by "immediate mode rendering" in graphics. Funny to see how we've come a full circle and people are now using react for graphics
React somewhat feels like immediate mode but has none of the actual benefits.
@@clickrushThat is the benefit
At my work we're currently using React PDF and React Three Fiber and are looking to use React Email in the future. While none of them are best in class, the huge benefit for us is that as a small company and small dev team it's so much easier for anyone to work on systems using these with no prior exposure.
Remotion looks perfect for one of my personal projects. Will check it out.
Which other packes/projects would you consider best in class above these ones?
React email has been amazing to work with. Was previously been using handlebars templates and even ejs templates. I never knew about react-pdf. That will definitely simplify my pdf creation process.
React mail and react pdf are so dope.
We (myself and one more person) wrote a big Course management webapps, we use react PDF to generate invoices and contracts and react mail for sending mails, like „he you have a course, accept it now in your panel“ or „you successfully added course change requests“.
They made all our stuff very high end, especially because we where using easyinvoice before.
Don’t forget: react-mail can also render Plaintext! We where handeling that ourselfs, which ended in a sync email html and plaintext (as expected)
We wrote a React renderer for our game engine at work! Called Hiber3D HDK. Has gotten some people who never would have done game development into it.
I make a living selling D&D books, and react-pdf is such a godsend. There's a *couple* features I wish it had, that it doesn't yet, but wow this is miles better than any other option on the market right now.
I've used react-three-fiber as well and it's an absolute life-saver too.
Didn't expect to find you here
Running server code using the react lifcycle was the jumpscare i could have never anticipated
Your ability to show the positive side of things is close to none! keep the positivity and productivity alive! peace
I have spent the past year preaching this exact topic everywhere. Nice to have a video from someone who explains it in simple terms that i can now show people
I bet that if a VR revolution happens in the future and we all ditch our current devices for VR headsets, that the first VR UI component framework would be based on React.
I really think that because React separates its render graph from rendering concerns, that alone makes it better than most UI systems. Efficiencies aside (yeah, diffing ain't great), having such separation just allows for so much flexibility. The React Three Fiber library especially. Unfortunately, I don't like authoring React (or any UI code), but can appreciate good design when I see it.
What’s a render graph?
@@zemaumm It's a hierarchical graph of nodes that when enumerated (or visited) can be used to render something. The HTML DOM is a render graph for example. If you do computer graphics (i.e. 3D), it's usually called a Scene Graph. By react keeping it's render graph separated, it means it can map onto the DOM as well as anything else that also uses a graph to render things (for example, ThreeJs, WinForms, or any other UI system)
Even though React pushed this rendering-agnostic approach forward in JS, it was not only library that does so. Both Solid and Vue, heck even Angular already provides ways to plug in custom renderers (Solid being directly inspired by React's renderer).
@@BinaryReader ohhh, is that abstraction why like mentioned in the video the react is output structure agnostic ( it could be email html, pdf, webgl nodes ), but it’s input structure needs more improvement as people suggest ? ( diffing , no reactivity, JSX… etc ).
I didn’t even know the word render graph but I think it makes sense now
I want to add React Ape , there is not much activity though. React Ape is a react renderer to build UI interfaces using canvas/WebGL. React Ape was built to be an optional React-TV renderer. It's mainly a renderer focused on creating things for TV, PS5, PS4, Nintendo Switch, PS Vita, PS3 and low memory devices.
i thought it would be something to render NFTs
why would you use js or vdom on low memory devices. And why would you use stateful UI over imgui when targeting graphics API's directly?
@@pokefreak2112 because everyone LOVES js and react and it may be faster than 99999 divs idk fuck js devs tbh
Can't help but think that we've strayed too far with these levels of abstraction, but at the same time, these things are damn cool
I agree. It's getting out of hand.
All this just to keep using JavaScript in ways it was never intended. I really think we need to switch to a new fixed type native language. Web Assembly? Rust? Dart? I don't know
@@ChristopherCricketWallace Web Assembly is the answer there.
Since its a compile target not a language so by its very nature of existing it includes every other language in its confines (including javascript ironically enough)
Basically what java was trying to do, without the disgusting language and with a much more lightweight runtime.
@@ChristopherCricketWallacedo u feel the same about React Native?
@@MrTeathyme ah yes I love downloading megabytes of runtimes everytime I visit a website, also no garbage collector and needs javascript to do pretty much anything
I love those levels of abstraction. I just don't love Javascript 😢
Funnily enough, first 3 major version of MJML were in React too.
We gave up on it as it was too limited to ensure compatibility for non modern client (invalid HTML properties, non closed tags, external templating compatibility, outlook comments...)
developers were so preoccupied with whether or not they could that they didn't stop to think if they should.
"Your Scientists Were So Preoccupied With Whether Or Not They Could, They Didn’t Stop To Think If They Should"
Loved the video, btw
I've never used React and I had no idea all these things were possible. Hugely impressed
There is a cool VS Code extension that converts .md files to .pdf. That one is the easiest way I found to make a .pdf but you're limited to markdown's functionality.
this has been my fav theo video recently, so useful - thanks!
Anyone who’s an expert in any of those areas on interest would not use react but the native tools. These react implementations just help react developers become familiar with the tech and eventually move on to native.
React was definitely built for the Web. That did however, change along the way.
By the way Remotion renders standard DOM elements too, fun thing is that you can inspect your elements in the video real-time too 😅 Yea, you can render a video with ffmpeg an stuff, but you can't really use a lot of cool animation libraries (like framer-motion) because you need to interpolate the state of every element for every frame in your video.
12:32 - My first job in the Netherlands was for a company that had an app on PS4 and was built using React 😂
Now imagine combining React-Three-Fiber and Remotion?
Everybody is sleeping on it IMHO!
Yes we want a Remotion video!
react-pdf has issues with generating the incorrect text, BE WARNED, it will visually look right in a PDF, but when you extract the text from it, it can be wildly wrong. I used it for a resume builder. I ended up entirely rewriting it to use regular react + puppeteer to make it into a PDF. I actually ended up ditching react for 11ty.
React is spreading to other flatforms likes zombies do in movies, And I am loving it. Legend has it zombies use react to control their spaceship.
Yeah, they are made for Vercel now and Vercel needs to sell hosting. React is made for webhosts.
I used the react-pdf for my thesis at university :D It is very usefull and easy use :D
As far as I find those tools amazing, I am struggling to find a use case where you would chose them over already implemented (and more performant) non js solutions for some of the examples given.
There definitely is otherwise, those tools wouldn't still exist after a while, but yeah, I am curious.
React for a CLI tool is wild
oh ThePrimeagen is gonna love this one
I'm absolutely blown away by what the threejs and R3F crew is doing
Some of these projects blew my mind. I didn't know they existed. Thanks Theo.
I just wish we could have a language fundamentaly based arround those concepts, declarativity & reactivity. It makes so many problems trivial to solve... Every new language people create is just another syntax for imperative functions with someones vision of the perfect type system..
I wonder why no one explored that path yet, maybe because everyone is too busy hating on react for being JS and "for the web", so they avoid studying its core concepts like the plague...
Reactivity predates react by a lot. Also, elm and svelte are technically their own languages that compile to JS. Even CSS is reactive (you can look at "corset" which builds on this idea). There are a ton of esoteric languages and DSLs that people have created to incorporate reactivity as a first-class citizen, but few have really taken off.
At the end of the day, reactivity can introduce overhead and may not be the most performant way to program, so language developers may not want to be prescriptive about it.
This has actually helped me appreciate what React is as a technology a lot more. In the browser space, I was always put off by it as it felt like it was recreating too many things that were already built in to the HTML/CSS/JS stack. So Svelte and "less is more" frameworks always seemed objectively better.
But I didn't realize that React was in a different ballpark from the outset by being more than a web framework, and *actively* pursuing that course of development. That definitely changes the value proposition.
Ah yes, this is what Dante's Inferno prophesied about.
Wish react would go towards signals like solid/svelte. Performance is the biggest major area where react is way behind other frameworks.
Preact has a signal package for React!
Theo thank you. I put your videos on while I code and it makes me feel like I’m part of the community.
Raycast is a nice spotlight alternative for macos that uses react for it's plugin api.
Just got hired at a job and we use React to build applications for touch screen kiosks like the ones you’d see at McDonalds.
@Theo, you are right. React wasn't built for the DOM (web). React can render in other environments without much hassle or perf hits but for the DOM, it becomes a real PAIN!
This is why for the DOM in the browser, i will prefer SolidJS + signals over ReactJS
Last year, I used React to build a sub-app that would capture the image at the right inclination on top of the react-webcam using JS sensor APIs.
React is pretty versatile.
Craziest usecase I have seen is using react nested inside of java minecraft to render a minecraft hack client gui
I'm (slowly) making a top-down dungeon crawler game, and I decided to write it in ThreeJS because it's available through NPM (Better than my alternative EaselJS anyway), and I'd be able to take advantage of the lighting effects and 3D layering. I built a tech demo with a scene, a HUD, and even a film grain shader, and then I realized I'd need mouse interactions which are apparently done best in react-three-fiber, so I rewrote the whole thing. React-three-fiber is definitely janky when it comes to odd configurations like the HUD and the shader, but once you get to more typical things, it makes more sense.
Someone else already said it, Remotion IS rendering to the web and doing screen capture. Ffmpeg is just to stitch the images together into an mp4 and probably to add the audio.
EDIT: it uses puppeter. Headless chrome but you can also open any browser to preview.
holy shit that's stupid but kinda works
Holy shit React PDF?! I have been fighting Pandoc to manage our templated .pdf documents as code and FINALLY there is something with the flexibility I need. WTF thank you for this video!
Exactly! I was trying so hard to template LaTeX with Jinja in Python. Now, I will give a try to this.
An open source game I contribute to, SS13, uses React for its UI. It works pretty nicely, and is easy to contribute to even as an amateur.
Really well timed video for me personally. I got into web development about two months ago. Had been working with html css vanilla ever since. Started learning React 2 days ago and finally saw its beauty while making the tutorial tic-tac-toe game. Absolutely fascinated with how cool its structure is and how easy JSX is over html, i love it!
That's probably the only reason why I want to come back to React sometimes. It just have everything around.
Wow! I rarely comment on videos, but at least two of the things you showed were precisely what I was looking for in the last six months. I am surprised by how I encountered this video.
Thank you very much!
Yes please about Remotion! I've been super interested to see how it works but I just haven't really had a side project it applies to. Very interesting project
Very eye opening and interesting! Excited to try some of these out!
can't wait to play with react three. their other work, jotai, is beautifully simple.
Incredible video Theo! Loved it
+10000 to Jotai! Daishi is worth his weight in gold.
...Why was I recommended this video? I'm a die hard Rust, and tentatively WASM guy, lol.
Regardless, this was a well presented video, and your excitement for these solutions really came through!
Blame @theprimeagen and overlap in audiences.
This is a really eyeopening video - I've just used react in wetland, and believed that it was it's only use case, but seeing these examples is really making me go wow...
I am ashamed of myself to have 10 years of webdev engineering experience, and getting my jaw drop, thank you for this knowledge.
Love this content as a React Developer, particularly its cross-compatibility feature (React Native). This would be vital to me when exploring the Web3 space in future, that's when developing smart contracts on decentralised apps.
Somehow i watch all your videos, i litereally never skip them because they are very informative, theo you the best
2:32 I was put in charge of updating our company email signatures earlier this year…it was rough indeed
That Reacord looks really promising to implement auto admin and maybe make the admin account we use actually feel a little alive
Your ring light is too strong.
Thanks for the video. I'm glad people talk about the realities of React -- both good and bad. Regardless, this constant onslaught of criticism is necessary for React to survive. It'll be around for a good while still, but I think we are all looking forward to improvements.
Ad. React pdf. I will definitely look at it as I worked my butt of to generate a clean invoice in math lab :P
I'm writing my first video game in React with the DOM & TailwindCSS. I'll eventually add redux for refactoring, but right now, it's working just fine.
We really need a decent and actively maintained react renderer for linux
React was in fact built for the web. It just allows for more things to be built with it, but that doesn't change the fact that it is a library for JavaScript, the programming language of the web. If it really hadn't been made for the web, they wouldn't have made it in JavaScript and they wouldn't have put so much effort into making everything work perfectly to improve the web development.
I think Vue also can implement these libs you mentioned.
react. the slowest way to do anything on a computer
Surprised you didn’t mention Raycast. I guess it’s kinda like react native, but they have a great react developer API for writing custom commands in their native swift app
The truth is that frontend communities often don't know data structures, algorithms and classic programming patterns and paradigms. And when they "invent" something, it's often glorified and used everywhere. I am not saying it's bad, react is good. But please please frontend community, study Knuth, study computer science. It will give you a better perspective and sound judgement. I ask about concurrency, I ask about virtual memory, I ask ask about algorithms, zero-copy and I always hear how great react virtual DOM is without any real info. Like it's some magic hard to understand, a religion almost, when in fact it's not, it's a standard data structure so common in CS.
Every goddamn thing is a SAAS nowadays
V8 does not render HTML it executes JS. Blink renders the HTML & CSS in Chrome.
Def do a video on Remotion! That would be dope.
Well soon start saying: whatever can be written in react will eventually be written in react
React Email is cool, but it almost seems abandoned now. They're not putting out updates or updating their changelog.
This react-react-dom distinction would have been so useful when I switched to it after Angular
Would love a Remotion video with Johnny
FYI, if you want your thumbs to be more authentic, they ain't called "Retweets" anymore.
I really like React, it is so versatile! my personal project stack is all based on react, NextJs for web, Expo for mobile, and Electron for desktop
I'm definitely going to be using Ink
this is the kind of content I crave for! this was eye opening.. thanks!
Oh wow. As someone who _has_ built email templates, I really wish I'd known about React Email at the time. Email templates are truly miserable.
VueJs offers something similar called Custom Renderer API.
Note that the tweet/X post date on the thumbnail is three days *after* the video was posted.
Wow. This is the first time I've ever seen something interesting about React. I had always thought of React like Windows or Angular -- an inferior legacy platform continuing to exist because of the momentum of a very large legacy community! But how wrong I was! This is actually impressive.
Oh this is dope Theo wow.
Thank you 🎉
react wasn't built only for the web. There I fixed it, stop baiting people
Remotion seems like the perfect candidate for AI to go wild with.
upvoted for the LaTeX shoutout!
The email and pdf use cases confuse me cause they are static documents. There is no rerendering or reacting going on. The usefulness seems to find from bringing the components or atomic design of the web to PDF and email which can also be done with templating libraries.
React at it's core just handles *reacting* to state changes with hopefully the least necessary re-rendering possible while using a component, atomic design, pattern. It can be a state management and view-updating solution for discord bots, threejs, and cli tools with a familiar interface. But I don't see how this makes them an easy entry-point into a whole new domain. There's a lot more that goes into 3d graphics than updating values based on state and react-three drops you right into that complexity with its meshes, light sources, cameras. It may even be an extra layer of confusion to translate between threejs examples and how to do it in react-three.
I'm baffled by the existence of react-nil. I get that it's just experimental and Theo says we should never use it -- I agree, fine if it's just made for fun/exploration. But still. React is a view library at the end of the day, regardless of what it's rendering to: email, pdf, 3d canvas, mobile, etc. React nil doesn't use the component pattern because nothing is rendered. There's no need to re-render if everything's null and maybe there are state changes? (idk how b/c we have all the info we need from the request on server side). So we've lost both core parts of react. We're left with, what this library clings to: the react lifecycle. Shoe-horning arbitrary (non-rendering) processes so they fit into the react lifecycle which was designed for rendering views sounds like a horrible violation of the interface segregation principle. Managing the user lifecycle like the docs are suggesting? You may want a model lifecycle which gives you creation, deletion, update hooks like nestjs and sailsjs provide instead of the render function or a useEffect.
Ah I've been playing with Remotion for almost the past year! Remotion video please!!
I made invoices with Latex in the college, it was fun.
I love such videos,
I had faced issues while working with React Native for web, from basic stuff like responsiveness (I am not good at it) to some libraries not being compatible on web, I felt it was not worth it in the long run, if the web and mobile app will change independently. I feel React Native for web is a easy way to use common components for web and mobile, but seems to be creating more problems then it solves (for now).
If anybody has a different experience or advice, I'd appreciate it, Thanks
glad I watched this to learn about react email
whoever made react,
the same guy that discovered fire
I always assumed react-dom was just code organization not an actual functional/useful
abstraction
think of these renderers as a form, that's really what they are. they teach react about a platform, what primitives it has (div, h, span, etc), which colors, formats, how events work, etc. react has a high level tool for making a renderer: react-reconciler. if you google it you can get an idea how it works.
Liked and subbed just cause of the 'Let's dive in' part 🤣