chore: add README for example project

- add load button on example project to load PDFium manually

example/README.md

@@ -0,0 +1,14 @@
+# PDFium.js Example Project
+
+This is an example project that utilizes `PDFium.js`. This project is built using Vite.
+By defaukt, this project downloads and installs the latest `PDFium.js` from npm,
+but you can change the version if you need.
+
+## How to run
+
+You can simply run the following commands to run this project.
+
+```sh
+yarn install
+yarn dev
+```

example/src/App.tsx

@@ -1,34 +1,33 @@
-import { useEffect } from "react";
+import { useState } from "react";
 import { PDFium } from "pdfium.js";
 import "./App.css";
 
 const App = () => {
+  const [isReady, setReady] = useState(false);
+
   const handlePDFiumError = () => {
     console.log("[PDFium] An error occurred!");
   };
 
-  useEffect(() => {
-    PDFium({ wasmPath: "/", onError: handlePDFiumError })
+  const loadPDFium = () => {
+    PDFium({ onError: handlePDFiumError })
       .then((PDFiumModule) => {
+        setReady(true);
         console.log("PDFium WebAssembly loaded", PDFiumModule);
       })
       .catch((err) => {
         console.log("ERROR");
         console.error(err);
       });
 
-    PDFium()
-      .then((module) => {
-        console.log(module.HEAP16);
-      })
-      .catch((err) => console.error(err));
-  }, []);
+  };
 
   return (
     <>
       <h1>PDFium.js Example</h1>
+      <p>PDFium loaded: {isReady ? "Yes" : "No"}</p>
+      <button onClick={loadPDFium}>Load PDFium.js</button>
 
-      <p>You can test PDFium module in this page.</p>
     </>
   );
 };

example/src/index.css

@@ -17,7 +17,7 @@
 body {
   margin: 0;
   display: flex;
-  place-items: center;
+  justify-content: center;
   min-width: 320px;
   min-height: 100vh;
 }