0:00
Uh hello guys, welcome to this video. So
0:02
in this video I'll show you I built out
0:04
a offline PDF editor something like
0:06
Adobe Acrobat clone in ReactJS using MU
0:10
PDFJS library. So we are running this
0:14
project local locally just to show you
0:18
the demo of this application. Uh this is
0:20
the readym made project here as you can
0:22
see if I show you the package.json JSON
0:24
file. We using this library MU PDF
0:29
and we are also using the latest version
0:31
of React. So if you're interested in
0:33
purchasing this project, the link is
0:36
given in the description. After
0:37
purchasing it, you will get the full
0:40
source code. Each component as you can
0:42
see is divided into its appropriate
0:44
TypeScript file here. So it's fully
0:47
customizable. You can easily customize
0:50
this. and we are running this project on
0:52
local host. It's also very easy for you
0:55
to deploy this as well. So once you
0:57
click the browse file button, you simply
1:00
select whichever PDF file that you want
1:02
to edit. After selecting that, both the
1:05
pages will show right here. All the
1:07
pages in the live preview section. And
1:10
here you can easily have all the options
1:12
right here on the left hand right hand
1:14
side. If you want to add something,
1:18
you basically select this tool. And here
1:21
you have the text field. And here you
1:26
it's you can just see here how easy it
1:30
You can adjust the size as well. The
1:33
color, phone size, everything. So it's
1:35
every tool is there. Uh this is a select
1:39
tool. So here you can actually select
1:43
You can also directly print. This is a
1:46
print option which is given if you want
1:47
to print your PDF document. So this
1:50
print window will open and it will
1:53
actually allow you to directly select
1:55
which PDF document that you want to
1:59
print out. All these options are also
2:01
there. So as you click the print button
2:04
the printing will start. So as you can
2:10
apart from that we also have the option
2:12
to highlight add images as well. So if
2:16
you want to highlight your text, you
2:17
simply select this tool
2:34
Uh so it does this editor doesn't
2:38
require internet that's the main thing.
2:40
So once you actually deploy this it all
2:44
the processing directly takes place in
2:46
the browser. So you select this tool and
2:49
you can easily highlight anything.
2:53
So as you can just see here this is the
2:55
highlighting tool and if you want to
2:58
remove any text from the PDF document
3:01
you use this tool and this will actually
3:04
remove everything. So you will see the
3:06
permanently removed from PDF.
3:12
So this is the thing. So here you can
3:15
insert a page, delete a specific page as
3:18
well. This is the total number of pages
3:20
which are shown. So you can easily read
3:22
your PDF file. We have the zoom in zoom
3:25
out control. So this is a tool here. If
3:28
you want to hide something, you simply
3:30
select and this magically will remove
3:33
everything. So now you can't see the
3:37
Similarly, you go to the next page.
3:39
Simply select the portion that you don't
3:41
want to and easily it removes
3:50
all the features of this if you are
3:53
interested in this. And then after that
4:01
everything will be saved here. You can
4:02
see all the changes that you have done.
4:04
Everything is saved. You can even export
4:06
this to a PNG file as well. Image file.
4:10
So we have all the format here. Text,
4:13
HTML, SVG, WEBP. So all the export
4:17
options are there. So if you're
4:19
interested in this project guys, the
4:21
link is given in the description. It
4:23
will download a zip file which will
4:25
contain both the images. So it's a
4:28
complete PDF editor and viewer where you
4:30
can read your PDF files and also at the
4:32
same time edit them as well similar to
4:35
Adobe Acrobat. So we are using this
4:38
library MU PDF and React.
4:42
So if you're interested in this project
4:45
the link is given you can directly