How to Create Videos using React w/ Remotion | Say Goodbye to ADOBE After Effects
Рет қаралды 14,242
Күн бұрынIf you ever wanted to create videos using your loved web technologies and UI Frameworks using it with the composable React Ecosystem to finally render it out into a full video. Well, it is possible with Remotion. In this video, we will go through Remotion and how to use it to create a full video using React with CSS and HTML and your favorite React library, in fact, we will create my youtube channel logo intro all using React and Render it to a video with Remotion.
⭐ Timestamps ⭐
00:00 Introduction
02:23 Getting started with Remotion
11:36 Understanding Remotion and How it works
22:55 Creating CoderOne Logo
26:14 Putting logo SVG Paths together
40:10 Animating Logo w/ spring animations
48:47 Global Redux Store State access
56:41 Exporting React into a Video
My Channel (CoderOne) Logo Video Source Code:
github.com/ipenywis/coderone-...
🧭 Watch Tutorial on Designing the website on Figma
• I Design a onecolor We...
🧭 Watch Create a Modern React Login/Register Form with smooth Animations
• Create a Modern React ...
🐦 Follow me on Twitter: / ipenywis
💻 Github Profile: github.com/ipenywis
💡 My Blog: ipenywis.com
Made with 💗 by Coderone
@olehcb1467 3 жыл бұрын
Awesom! thanks bro the update, i also loved it
@happylau2318 2 жыл бұрын
the secret of DOM Animation to MP4 is ffmpeg + puppeteer + headless Chrome. infact you can use any animation lib, not just Remotion.
@MikeNeder 4 ай бұрын
nice work on this video. I am a React developer for my day job and also a video editor for my side work. I had not heard of Remotion until a week ago. In fact, have been subscribed to your channel for around 3 months and watch a lot of your videos but had not seen this one. I am curious about your take on this now. Based on the level of effort that you are doing for that in this video, I wonder if it is worth it.
@saviomartin7 3 жыл бұрын
Thanks 🎉
@CoderOne 3 жыл бұрын
Glad you liked it!
@sithsithari 3 жыл бұрын
Wow, this is something.
@ishakm.benbaouche7742 3 жыл бұрын
You need to make this as a thesis theme dude !
@CoderOne 3 жыл бұрын
Work in progress... it it interesting tho
@chubbyshady 2 жыл бұрын
Remotion is cool. But that's it. It can't replace AF yet
@6parzival9 Жыл бұрын
What's AF?
@chubbyshady Жыл бұрын
@@6parzival9 after effect. Sorry I clearly don't know how to abbreviatie
@shubhajit_07 Жыл бұрын
@@chubbyshady AE
@MikeNeder 4 ай бұрын
based on the level of effort that he puts in to accomplish this simple animation, I tend to agree it would be easier/faster to go do it directly in AE
CoderOne
Рет қаралды 29 М.