Installation

Follow these steps to install and set up EasyPdf in your React application. EasyPdf is completely free and open source.

Requirements

• Node.js 14.0 or higher
• React 16.8 or higher

Installation Steps

1. Install the package using your preferred package manager:

npm install @easypdf/react
# or
yarn add @easypdf/react

2. Initialize EasyPdf in your app:

import { EasyPdfProvider, EasyPdf } from "@easypdf/react";

// Initialize EasyPdf
const easyPdf = EasyPdf.initialize();

function App() {
  return (
    <EasyPdfProvider instance={easyPdf}>
      <YourApp />
    </EasyPdfProvider>
  );
}

3. Use the useEasyPdf hook in your components:

import React from "react";
import { useEasyPdf } from "@easypdf/react";

const PDFGenerator = () => {
  const { pdfRef, downloadPDF, isDownloadingPDF } = useEasyPdf();

  const handleDownload = async () => {
    try {
      await downloadPDF(pdfRef, {
        filename: "example.pdf",
      });
    } catch (error) {
      console.error("Failed to generate PDF:", error);
    }
  };

  return (
    <div>
      <button onClick={handleDownload} disabled={isDownloadingPDF}>
        {isDownloadingPDF ? "Generating..." : "Download PDF"}
      </button>

      {/* Content container with pdfRef */}
      <div ref={pdfRef}>
        <h1>Hello, PDF!</h1>
        <p>This is a simple PDF document.</p>
      </div>
    </div>
  );
};

Next Steps

• Learn about Configuration Options
• See Examples