0:00
Uh hello guys in this video I'll show
0:02
you I built out a SAS video editing app
0:05
directly in browser using ffmpg web
0:08
assembly library in nexjs framework. Uh
0:11
this is actually the demo of the video
0:13
editing tool. Uh so we have a timeline
0:16
based editor where you can add your
0:19
video and put add text images
0:22
everything. Let me start the demo from
0:26
So once you load the application the
0:27
demo looks something like this. It's
0:29
actually coded inside next year. Let me
0:31
show you the directory structure. So if
0:34
you need the source code, I've given the
0:35
link. You can directly purchase it. I
0:38
basically created this project from
0:40
scratch. Each and every file is
0:41
customizable. It's coded inside
0:43
TypeScript. You can add more features on
0:46
top of this. And we are using ffmpg web
0:51
We are using the latest version of next
0:53
and react as you can just see right
0:55
here. And let me start the demo. So
0:58
first of all you add a new project. Just
1:01
give the project a name. Click on create
1:04
and then click the project and you will
1:06
be redirected to the timeline section.
1:09
So right here you add your video file.
1:12
Whatever video file you want to edit.
1:15
After adding it to the timeline, the
1:18
video will play right here. You will see
1:20
that. And now if you want to cut the
1:23
video at a specific time period. Let's
1:25
suppose I want only the first 6 seconds.
1:29
I can click the split button to split
1:32
the video into two parts. You will see
1:35
that. So now if I don't need this part,
1:39
So the video plays here. You can adjust
1:42
the volume, size of the video,
1:44
everything. Then we have the ability to
1:47
add text as well like this.
1:50
So here you can adjust the position here
1:57
and just select the text and here you
1:59
can change the color of the text and
2:02
just edit the text here.
2:05
So whatever watermark you want to add
2:08
and here you can adjust the position of
2:10
the watermark of the text
2:14
phone size everything you can control.
2:16
After that, same thing. You can do this
2:18
for images as well. So if you have a
2:22
you can add the image and just split
2:26
this. And so you can just see how easy
2:30
it is to add elements such as text,
2:32
images. You can even add audio file as
2:36
well. So audio file is also present. And
2:39
now if you want to adjust the position
2:41
of the image and the size.
2:47
So you can just easily do this. You can
2:49
just see here how easy it is.
2:56
So once you're happy with the video, now
2:58
you have the ability to export this. So
3:01
you can actually start a subscription
3:06
You can deploy this inside your own
3:08
domain name. It's really easy. So once
3:10
the processing start, it directly
3:12
happens in the browser. It doesn't have
3:14
a backet. All the processing is directly
3:16
happening in the browser. So once it
3:18
reaches 100% you will see the output
3:20
video. So you can safely purchase it. Uh
3:24
it will be very easy for you to deploy
3:26
this project. Once you purchase the
3:28
domain name and add a subscriptionbased
3:31
model such as a SAS service. So user
3:34
will come to the tool they will pay some
3:37
fees and uh they will use your tool or
3:40
you can put advertisement as well. So
3:44
for building this we are using this
3:47
library which is fmpp web assembly
3:50
library which allows you to execute
3:52
ffmppg directly in the browser.
3:56
So once it completes it will actually
3:59
show you the output video.
4:22
So it is processing your video frame by
4:32
so you can just see here. So, you can
4:34
download the video as well as an MP4.
4:44
So, definitely check out