Greetings…in this video I will tell you how you can view your pdf files in your react application using a popular component named React Pdf Viewer.

Install these package

1- install pdfjs library | npm install pdfjs-dist@2.6.347
2- install the core package | npm install @react-pdf-viewer/core@2.4.1
3- install pdf viewer default layout | npm install @react-pdf-viewer/default-layout

All the required imports for React Pdf Viewer Component from the packages

// Import the main component
import { Viewer } from ‘@react-pdf-viewer/core’; // install this library
// Plugins
import { defaultLayoutPlugin } from ‘@react-pdf-viewer/default-layout’; // install this library
// Import the styles
import ‘@react-pdf-viewer/core/lib/styles/index.css’;
import ‘@react-pdf-viewer/default-layout/lib/styles/index.css’;
// Worker
import { Worker } from ‘@react-pdf-viewer/core’; // install this library

Create new plugin instance

const defaultLayoutPluginInstance = defaultLayoutPlugin();

Watch this video: (How to upload and view pdf files in reactjs)
Link: https://www.youtube.com/watch?v=v-PoG1X8jig&t=610s

The above project github link:
https://github.com/HamzaAnwar1998/Upload-View-Pdf-In-Reactjs

#pdfs #react