Skip to content

Build PDF Tools: Laravel 11, React, Tailwind, Inertia, Laravel Reverb

Notifications You must be signed in to change notification settings

nursandiid/pdf-tools

Repository files navigation

Overview

This PDF tools app offers an all-in-one solution for managing PDF files. Easily merge, split, and convert PDFs with just a few clicks. It supports JPG to PDF conversion, PDF page orientation adjustments, and file size reduction while maintaining quality. The app features a sleek UI design using Tailwind CSS, drag-and-drop uploads, and real-time file management with Zustand. Users can also view PDFs in real-time, generate thumbnails, and track all file activities—all within an intuitive and streamlined interface.

Features:

  • 📑 Combine multiple PDFs into one easily
  • ✂️ Break large PDFs into smaller files
  • 🖼️ Convert PDF pages to high-quality JPG images
  • 📷 Convert JPG images to PDF format
  • 🔄 Adjust the orientation of PDF pages
  • 📉 Reduce PDF file size while keeping quality
  • 📄 Convert Word and PowerPoint files to PDF
  • ✨ Sleek and intuitive UI design using Tailwind CSS
  • 📂 Easy file uploads with drag-and-drop
  • 🗂️ Efficiently manage files using Zustand
  • 🔍 View PDFs and other files in real-time
  • 🖼️ Generate quick visual thumbnails of PDFs
  • 📥 Seamlessly track file uploads
  • ⚡ Real-time PDF tasks with Laravel Reverb and Jobs
  • 🚨 Alerts for errors and statuses using toastr
  • ⬇️ Easy access to download processed files
  • 📊 Central hub to track all file activities and processes

Installation

For the installation you can clone this project to your local computer.

git clone https://github.com/nursandiid/pdf-tools

Navigate to the project folder.

cd pdf-tools

Install required packages.

composer install
npm install

Create a new .env file and edit the database credentials.

cp .env.example .env

Configuration

Application Settings

APP_NAME="Yoo PDF"
APP_TIMEZONE="Asia/Jakarta"
APP_URL="http://127.0.0.1:8000"

Database Connection

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=w2_pdf_tools
DB_USERNAME=root
DB_PASSWORD=

Filesystem Configuration

FILESYSTEM_DISK=public

Queue Connection

In this case, you can set the value to database.

QUEUE_CONNECTION=database

Laravel Reverb Connection

Run this command to generate our credentials:

php artisan reverb:install

It will automatically fill these variables:

BROADCAST_CONNECTION=reverb

REVERB_APP_ID=198038
REVERB_APP_KEY=obxrp97kzubmkwopetvi
REVERB_APP_SECRET=pp2ataxxaqncsg5p15ey
REVERB_HOST="localhost"
REVERB_PORT=8080
REVERB_SCHEME=http

VITE_REVERB_APP_KEY="${REVERB_APP_KEY}"
VITE_REVERB_HOST="${REVERB_HOST}"
VITE_REVERB_PORT="${REVERB_PORT}"
VITE_REVERB_SCHEME="${REVERB_SCHEME}"

Add this line, as we are using it on the client:

VITE_APP_NAME="${APP_NAME}"

Ilove API Connection

Since we utilize some advanced services that can’t be managed with PHP alone, I’ve opted to use the iLovePDF API as an alternative. Obtain your credentials from the dashboard and enter them here:

ILOVEPDF_PUBLIC_KEY=""
ILOVEPDF_SECRET_KEY=""

Run Commands

Generate new app key:

php artisan key:generate

Run migrations:

php artisan migrate

Run seeders:

php artisan db:seed

Generate a symlink to view files in storage:

php artisan storage:link

Start the web socket server:

php artisan reverb:start

Run the queue in development mode:

php artisan queue:listen

If you're using cron jobs, add this command to your crontab:

* * * * * cd /path-to-your-project && php artisan queue:listen >> /dev/null 2>&1

Build assets with NPM:

npm run build

Alternatively, run in development mode:

npm run dev

Run your app:

php artisan serve

That's it! Launch the main URL at http://127.0.0.1:8000

About

Build PDF Tools: Laravel 11, React, Tailwind, Inertia, Laravel Reverb

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published