Up next in 10
Build a FFMPEG WASM Audacity Clone Audio Editor to Trim & Apply Effects in Browser Using HTML & JS
Mar 3, 2026
Buy the full source code of application here:
https://procodestore.com/index.php/product/build-a-ffmpeg-wasm-audacity-clone-audio-editor-to-trim-apply-effects-in-browser-using-html-js/
Show More Show Less View Video Transcript
0:00
So in this live stream I'll show you an
0:02
ultimate Audacity FMPPG web assembly
0:05
audio editor that I built inside the
0:08
browser. I've also given the demo link
0:10
in the description of the video. So this
0:12
is the actual audio editor where you can
0:14
actually trim your audio and apply
0:16
different kinds of effects to your audio
0:18
file with the live timeline editor. So
0:21
once you land on this you basically load
0:24
your audio file or video file. You
0:26
simply select and it will initialize the
0:29
ffmppg library directly in the browser
0:31
using ffmpg web assembly. After that it
0:34
will construct the timeline of your
0:35
audio file. You can play the audio here
0:37
by clicking the play button.
0:39
>> Hello guys, welcome to this video. So in
0:41
this video I will you can even upload uh
0:43
select. So we have the play and the
0:45
pause button. So you basically get this
0:47
nice little timeline and through this
0:49
timeline you can actually cut your audio
0:52
file. So just select the portion of
0:54
whatever audio file you want to cut. So
0:57
from this duration to this duration I'm
1:00
cutting the audio file. So you basically
1:02
here you can listen
1:05
before purchasing it. There is a buy
1:07
button which is the buy button. It also
1:10
works. So now I just need to cut this
1:13
portion. I selected in the timeline and
1:15
then basically uh we have this option
1:18
here.
1:20
All these options we basically say
1:22
preview effects. So now f ofmppg will do
1:25
its job by cutting the video and now it
1:27
has successfully you can try this tool
1:29
before if you count page where you can
1:31
purchase. So now it has cut the audio
1:33
file. Now you can export this by
1:35
clicking the export button. So this is a
1:36
readym made project that I built in
1:38
HTML, CSS and JavaScript. So the link is
1:41
given in the description. You can
1:42
directly purchase the full source code.
1:45
This is the full directory structure. We
1:46
are using ffmpg web assembly library. As
1:49
you can see, these are all the libraries
1:51
which are loaded right here in this
1:53
folder. And this is the main file. You
1:55
can run this locally. I'm running this
1:59
uh locally this application. As you can
2:01
see, I started this HTTP server and my
2:05
application has started at localhost
2:08
8080.
2:10
So I'm also running it at locally as
2:12
well. So
2:15
you again repeat the process. Simply
2:17
select your audio file that PG will
2:19
initialize and uh here you can even
2:22
apply some effects to this audio file as
2:24
well. In the sidebar section you can
2:26
adjust the volume
2:28
by default it is set to 100%. You can
2:31
adjust the pass level treble eco effect
2:34
speed of the audio as well. You can
2:36
adjust let's suppose I decrease the
2:38
speed and again play. I can preview
2:41
effects. So now it will do the
2:43
processing. All the processing will
2:45
happen directly in the browser. No
2:47
server side back end is there in this
2:49
source code. Uh hello guys welcome to
2:52
this video. So in this video I will show
2:55
you a so now you can see the uh speed is
2:58
decreased. If I increase this slider to
3:01
increase the speed of the video. So now
3:04
what you will see the speed will be
3:06
increased.
3:08
>> Hello guys welcome to this video. So in
3:09
this video I will show you a camera
3:10
clone remove background. So now after
3:13
applying the effect you have also this
3:15
export audio button. So you click the
3:17
button and then the export process will
3:20
start and the export will directly
3:22
happen and it will download this as an
3:24
output file. It's really simple. It's a
3:27
complete
3:27
>> welcome to this video. So in this video
3:28
I will show you a I will refund your
3:30
money.
3:31
>> So you can just see here you can even
3:33
apply to background music songs
3:36
everything. We also have the slider for
3:38
adjusting pitch as well which is really
3:41
important
3:43
in music program. So you can increase
3:45
the pitch again. Click preview effects
3:48
then it will generate the live preview
3:50
for you.
3:52
So you also see this progress bar as
3:54
well.
3:54
>> Uh hello guys welcome to this video. So
3:56
in this video I will show you a Canva
3:59
clone remove background.
4:00
>> So now the pitch is increased. You can
4:02
even decrease the pitch
4:05
and then click preview effects
4:12
and then play.
4:13
>> Hello guys, welcome to this video. So in
4:15
this video I will show you a Canva clone
4:18
remove background from
4:19
>> so all these nice little effects. So
4:21
before you purchase the source code you
4:23
can try out this editor I have given at
4:26
the check out page. This is the full
4:28
link. So if you're interested, you can
4:30
purchase the full script. You will
4:33
basically get all the source code after
4:35
you purchase it from Google Drive
4:36
automatically. So all the binaries would
4:39
be loaded for you. You can easily deploy
4:41
this and run this project and it has
4:44
fading effect, fade out effect. Now
4:47
reduction is also there
4:51
from image kind of offline.
4:54
So slow above effect is also there as
4:57
you can see speed pitch everything is
5:01
there. So you can try out this. If you
5:04
are interested, you can purchase this.
#Jobs & Education