PdfDatabase Rendering Frontend Code #1

Pdf_Library/PDFDatabaseRenderer/frontend-pdfrender/.gitignore

@@ -0,0 +1,23 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

Pdf_Library/PDFDatabaseRenderer/frontend-pdfrender/README.md

@@ -0,0 +1,44 @@
+# PdfRender Frontend
+
+This codebase allows user to render pdf data which come from dataBase on the UI with options to show and hide the PDF. The project is built using React and utilizes library to handle PDF rendering.
+
+## Table of Contents
+
+- [Installation](#installation)
+- [Usage](#usage)
+- [Features](#features)
+- [Demo](#demo)
+
+## Installation
+
+1. Clone the repository:
+   ```bash
+   git clone Github Repo
+
+2. Install the dependencies:
+   ``` bash
+   npm install
+
+3. Start the development server:
+   ``` bash 
+   npm start
+## Usage
+- Upload a PDF file using the provided upload form.
+- The uploaded PDF will be rendered on the UI.
+- Use the show/hide button to toggle the visibility of the PDF.
+
+
+## Features
+- Render PDF files using react-pdf.
+- Toggle the visibility of the PDF.
+
+
+
+## Demo
+
+![Upload PDF](./screenshots/Screenshot%202024-07-01%20172551.png) 
+
+
+![View PDF](./screenshots/Screenshot%202024-07-01%20172604.png)
+
+