Create a Custom PDF Viewer With JavaScript

[@n_fan329]

Again I'm still confirming that you are BY FAR a GOD gift for all coding community, worldwide 😍😍👌👌

[@kidethezdaga]

When I typed PDF.js in my youtube search I just hoped I will find a single video that can help me a bit. But only then I realised that I forgot about the best teacher in youtube programming community... Ty Brad , you are just awesome...

[@jamesbest2221]

Thank you. That was enjoyable to watch. Also, thanks for hand-typing your code, and explaining every step so clearly! I think that’s your secret-sauce as to why your videos are so good!

[@javascriptmastery]

For all those wondering how to create a dynamic PDF using JS and React, so you can later view it in this PDF viewer, I have created a video explaining how to do it! Cheers Brad, you're the best! 🥂

[@adrianhajdin1673]

Thanks man, that's exactly what I have been looking for!

[@luciafilicic4140]

Subscribed, Brad's video and yours go great together!

[@iMakeMemes]

where's the link

[@alexanderlo8380]

This video still helped me out in 2020, Thanks a bunch! Stay safe everyone

[@batesmjr]

Absolutely a fan! This really help me with understanding promises and catching errors. I really appreciate your work and breakdown of the language.

[@matthewmbonu3159]

As a starting coding bootcamp student I can't say how much your videos have been helpful thanks so much for the great content!

[@fuzzybuddy4457]

Hello, Just wanted to ask how can I display all of the pages of the pdf on page instead of going next page and previous page thanks, Arnav 😀

[@raymond1489]

Thank you very much bro. I upgraded this application by means of your current and previous lessons. I used localstorage and contenteditable options to user can choose a page he wants.

[@rosalyna_24]

can u share the code please

[@raymond1489]

@@rosalyna_24 github.com/SamFredrickson/PDFReader

[@happatrick7330]

Love your tutorials, ever since I started following your content my coding skills have definitely improved. Thank you Brad.

[@grey4032]

you are a life saver. thanks for all your videos

[@armaandhanji2112]

Exactly what I needed...thanks so much Brad. Best channel on youtube..hands down.

[@igorr4682]

very useful tool, you can take advantage of PDF reader install on your system and do the same with or tag as well

[@abodanzieri]

Thanks a lot. I just needed to have this for my Project so phones could see the pdfs without having to download them. I managed to change it so it works on my Application. Now it works nicely on Desktop and Mobile. Dont worry i credited you and refered to your video in my code.

[@kevinb6568]

Can you open local file documents?

[@oskarlaskowski3173]

it is a pleasure being able to code along. Great tutorial.

[@javascriptwar9525]

I would like to follow this channel for forever..☺🙌❤.. You all are such a great developers really honorable

[@mioszkaput235]

I really enjoy these quickshot-videos! (especially with usefull js!)

[@mitjed]

Its good for integrating your resume into your website.

[@itahirk]

Brad, You are Awesome. Presenting us always with something extraordinary.

[@ayodejisokan]

Thanks so much Brad! You've help a lot of us through your dedication to online education.

[@ziborgbe]

We are able to see your mind work flow during creation of an application. It is awesome. Is this your normal speed ? Have you prepared this before? Many thanks Brad.

[@sagarmaheshwary3150]

I was waiting for this since I saw the repo on my github dashboard.

[@derekgilbert1222]

I've started to feel guilty having all of this consistent content for free.

[@DhananjayGupta]

Just pay something

[@dkmodder4405]

I was just looking for one of these and what do you know, Brad has already made a tutorial!

[@perninha.93]

Hello, the code does not work, is giving 3 errors: 1º - The origin 'null' was blocked by the policy of cors. 2nd - Cannot read property 'xhr' of undefined. 3rd - Uncaptured error: cannot read the 'reject' property of undefined. Would you help me? I'm studying js, but could not succeed.

[@cahyoarissabarno46]

You can fix that ?

[@Thomas_Grusz]

Thanks Brad. That's a super handy project.

[@chijideagboje8424]

This project help me understand how canvas works. Thanks

[@MohdShoab-jx8qu]

Thank you so much sir for this amazing video 🤠 Love from India

[@durgachaitanya2871]

Sir... Your videos simply awesome..... Please make video on animated menu bar.... With search box

[@anuadebayo7267]

You are awesome

[@TraversyMedia]

Thanks :)

[@NIKHILKUMAR-jm6bb]

Mr. Brad You are really doing a great job. I have learnt a lot from your videos.Thanks. I need a help: Moving forward on your above web application, I want to know that how can I extract text, pictures,etc. from the pdf file? I will be very thankful to your help.

[@registrarmusica5793]

my friend your video is perfect. Congratulations for the good work

[@camillapantoja873]

Mr. Brad to the rescue as always !!!!

[@stojkovv]

Very nice, I have become your patron from this video. Thank you

[@Flamewheel2001]

Thanks! Appreciate your tutorials and you udemy courses

[@kailashmalveeya9523]

Hey Brad! thanks a ton for this amazing explanation. could you please explain how to implement zooming in pdf viewer.

[@MissOttolini]

Thank you for this tutorial! How do I publish this to host on a web server?

[@muhammadsajjad7957]

@Brade, your videos are very helpful. Thanks man !

[@MathCoaching]

Hi, is there a simple way to force pdf to be resized according to the device of user ? the viewer is too big for smartphone devices.

[@skjerk]

Extremely useful! Just what I needed :-) You have a perfect way of explaining stuff!

[@HostDotPromo]

Build build build 💰 PDF libraries are changing the game.

[@Ribby00]

Very nice. You should do a video to show how to create PDFs in JS or PHP or something from db records or charts or something. Could be really handy for business creators that want to create apps that can display data then export the data to PDF

[@crypt0z]

Pretty slick Brad! I learnt a lot.

[@jorgealloza6139]

You are a hero, god will take care of you.

[@Waelio]

Wonderful, Thank you! You do however realise that the real pickle is how to generate a pdf :( Most of my project require exporting data to pdf or excel, and I always found it challenging to generate a pdf ready for printing (A1/Letter) and so on. If you have the time, this would be a wonderful lesson. Thanks

[@robertmckethan8749]

Thank you for your awesome tutorial! I've followed the directions with excellent results using Visual Code's Go Live feature. However, I am attempting to use the code on a Drupal 9 site. I've installed the CSS, HTML, and JS in the correct directories. The code works except that I must click on the Next Page button to display content and it starts on the 2nd page. Also, the 'Page of' doesn't display anything. Any suggestions? In advance thank you for any suggestions you might have. Robert McKethan

[@nadoguirra]

Very good! Thanks Traversy :D

[@baroiall9968]

Brad, I really loved this tutorial of yours. I was hoping if you could do an updated video on this, where, there is an input section to enter the URL of any online PDF..and the reader pulls the PDF document from that URL and displays it..and if the URL doesn't link to any PDF..it shows an error.. Thanks

[@arogueotaku]

I'm confused. Why are we using that recursive call to renderPage method?

[@omarashraf6193]

Thank you for simple and clear explanation 🖤. I have a question. Is there a way to use/extend annotations functionality without pdfjs paid license? do you have any guidance where to look at or focus on in order to develop annotations features my self?

[@randalleikelboom2099]

Thanks! This was a great video. It's working great...Is this any guidance on making the viewer more responsive?

[@ndilionel]

Works great. Thanks. keep up the good work

[@arnelarnaldo7376]

Hello Brad, can you point me to some JS codes that will allow the viewed PDF to be printed? Thanks and more power to you.

[@eswarkrishnamaganti6409]

Hey Brad thanks for All ur videos which helped me a lot to learn Please do a video on ajax php database operations plzz brad

[@erfanwinarno434]

It's very great video, how about choose file pdf first brother? Not only show file pdf.pdf

[@Defense89]

awesome video!!!!! juste wanted to ask...can we change language of the pdf ? is it customable? anyway to do that? thx for this video really inspired me.

[@jonathansloan334]

Excellent Video! Thanks for this!

[@cesarherrera7509]

Great tutorial, I was wondering if you have any idea on how to insert a digital pen signature onto a PDF file

[@rosalyna_24]

hey did u find the solution

[@amerpro1748]

Sounds like a fun project

[@amitsengupta8136]

Awesome! Can I view and edit a word document (docx) on a browser? Any thought? Thanks!

[@14Magik08]

Great tutorial, very useful. Thanks!

[@SabbirHossain-vh4fo]

This is a wonderful video, it would be better if you add zoom in out function on it. :D

[@mohamedismaiel5807]

Thanks for this nice tutorial, Mr. Brad. But why not take it to the next level, I mean is there a way to create a PDF from a view while preserving the style? Thank you again.

[@subhajitroy3775]

Please correct me if I am wrong somewhere, the next and previous buttons were not changing pages but after the following changes queueRenderPage it was working fine const queueRenderPage = num => { if(pageIsRendering){ pageNumIsPending = num; console.log("pageNumIspending"+pageNumIsPending); renderPage(pageNumIsPending); ///// Passed renderPage with the pending number }else{ renderPage(num); } }

[@sitikantasatapathy]

can you help in in this. I want to add zoom in / out functionality

[@ishitavemana]

I got this error when i am trying to host from google drive to web: Uncaught (in promise) MissingPDFException

[@haoyuandong]

Have you solved this problem?

[@reponseashimwe4469]

Thank u so much! This was so helpful

[@dkmodder4405]

I have a question; How would I go about creating an xlsx (Excel spreadsheet) file parser for the web which displays the excel sheet? I want to do it in PHP or JavaScript preferably.

[@cr0n0s224]

Thanks a lot! I have a question: If I move to the third page and reload the page, how can I make it reload on the page, leave me on the third page

[@abirbeisekei1382]

thank you braaaaah... wish you all the bests

[@SpringfieldTechCC]

Hi Brad! Useful video for sure! One problem though. If the PDF contains a link, the link doesn't seem to work. Any ideas?

[@tanganov]

I wonder how would you make synchronize with thumbnails list of document (nav panel) while scrolling the whole document?

[@Loppy2345]

Quality content as always.

[@davidmucioca6423]

Hello Brad. Useful tutorial there. How can add loading state to the PDF reader?

[@se7ensorrows]

Did you ever figure this out? I am trying to do the same

[@k40L1n]

Thanks Brad. Legendary !!

[@josiahphipps895]

Hey, this is great, but what about an MIT one?

[@vidalroland]

Excellent, If you can do a signature formular that can be used in a generated PDF, I'm very interested !

[@kywazzyoutube942]

I have a question the menu of number page next page and prev page move when i scroll and we don't see this menu when i'm on the footer of the pdf viewer how can i do to the menu is display when i scroll on the bottom

[@studiotancaartdancestudiot1300]

Hello, Thanks for great tutorials. Would You be so kind and make one about parsing PDF files to retrieve text and SIGNATURES (is PDF signed, who signed, when). Howto about signatures is nowhere to find.

[@dannyisrael]

You are the best

[@alipashaamiri1667]

hey brad can you release a course on flutter? it seems to be an awesome framework.

[@belmiris1371]

Thanks Brad!

[@ayatullahkhameni9301]

why we need this two variable pageIsRendering = false, pageNumIsPending = null; when we just want to get pageNum and wants to call again renderPage() function. const showNextPage = () =>{ if(pageNum >= 5){ return; } pageNum++; renderPage(pageNum); } what's problem with that....it works fine. (I am new in javascript)

[@robertocarreira5185]

Hi! I´m trying to follow your tutorial, but I think that things has change since 2019, and the pdf.js library simply don´t load when invoqued, or imported, or the file put under a local folder, so I keep getting error messages of no defined variables and export errors (mime type) from the console. Is there some thing that must be added to the original project, so it keep working fine?

[@JohnDoe-qs7mg]

Hello, can you manipulate with the number of pages that you just want show in pdf.js?

[@coderobot6544]

Is it possible to limit the pages to be rendered of the pdf file? Like only 2 out of 10 pages of the PDF file should be rendered

[@aminem2080]

thx Brad much appreciated tuts especialy this one. can any tell me how to search in pdf doc

[@arpitagrawal579]

Great video. But didn't understand what you are doing with pageNumIsPending

[@kushalgopee3033]

If you using XAMPP the ../ can be removed to read docs/pdf.pdf

[@sdshsjg]

how to add disable right clicking and printing so that the user cannot steal or download or print the pdf ?

[@pitchblackc0d314]

wot ant screenshot lmao

[@mohamedelmeziani4012]

is there a way to get a text from the pdf when we select smth and return it as a js string?

[@manishsahani4867]

I like the video before watching it

[@ajworkswebdesign2364]

thanks so much sir great work thanks lot

[@javiercutillasverdejo2492]

Currently when opening the index.html file the error (Deprecated API usage: No "GlobalWorkerOptions.workerSrc" specified.) appears. How can we solve it?

[@Silent-Scandals]

How files are running on local host. I am unable to figure out please help. We have simple html and other files but you are running inside local host

[@FajnyAleZaNiski]

+1, however this works only if file is not found, if you have not valid pdf document the catch not works, *you can't set promise on getPage or renderTask* !!! the mozilla pdf lib is broken, it not allow to handle other more useful errors !!!

[@angeloendozo256]

Hi guys im quite confused how the pageNumIsPending got a value of the page number automatically. Was that built-in with the API in the first place? How did it get a value other than null?

[@foxsayjs]

This video is very useful!

[@Saaztube]

Hi, I'm trying to export invoices to pdf files, what would be the best way, if I'm using php as my main language? Any suggestions would be welcomed. Thanks!

[@BrotherHank]

Quick question. What do we do if the PDF file has spaces in the name? I keep getting the error posted with %20 in place of the spaces in the file name.

[@prateekdubey4095]

I'm facing an issue with pdfjsLib object is there something i can do to fix that?