Fox HR: Smart Onboarding

Fox HR automates employee onboarding by instantly generating, merging, and securing professional HR documents using Foxit APIs. Streamline your workflow with smart, automated document packs

Comment

Inspiration

HR departments are often buried in repetitive paperwork—manually editing templates, merging PDFs, and password-protecting documents for every new hire. We were inspired to solve this bottleneck by building a "one-click" onboarding engine. We wanted to see how far we could push the boundaries of automated document creation using high-performance APIs, resulting in Fox HR: a platform where the software does the "paperwork" so people can focus on the people.

What it does

Fox HR is a specialized document automation suite designed for modern HR workflows:

  1. Instant Generation: Transforms employee data into professional Offer Letters, NDAs, and Appointment Letters via the Foxit Document Generation API.
  2. The Onboarding Pipeline: Orchestrates a complex sequence of Foxit PDF Services to merge individual documents into a single bundle, compress it for email delivery, add confidential watermarks, and auto-generate page numbers.
  3. Smart Security: Automatically secures sensitive PDFs with passwords derived from employee metadata (like Date of Birth), ensuring PII (Personally Identifiable Information) is protected during transit.
  4. Bulk Automation: Supports CSV uploads to trigger document generation for entire cohorts of new hires simultaneously.
  5. Privacy-First Design: Operates as a local-first application, ensuring sensitive employee data lives in the browser's storage and only travels through secure, encrypted API tunnels for processing.

How we built it

  1. Frontend: Built with Next.js 14 and TypeScript for a rock-solid, type-safe architecture.
  2. UI System: Leveraged Mantine UI to create a premium, dark-themed dashboard with "glassmorphism" effects and smooth transitions.
  3. API Integration: A. Foxit Document Generation API: Used to handle the high-fidelity injection of JSON data into professional .docx templates. B. Foxit PDF Services API: Implemented a backend pipeline that handles multi-part cloud uploads, merging logic, and cryptographic protection.
  4. Branding: Designed a custom geometric fox mascot and an orange-accented brand identity (#F76707) to give the project a "Foxit-native" and premium feel.

Challenges we ran into

  1. Pipeline Orchestration: Coordinating multiple sequential API calls (Generate → Upload → Merge → Protect → Download) while maintaining a responsive frontend required careful async state management.
  2. Local-First Database: Building a relational-style management tool inside localStorage (handling IDs, employees, and document links) without a traditional SQL backend was a unique architectural challenge.
  3. Dynamic Previews: Implementing a high-performance in-browser PDF preview system that handles base64-encoded strings across different device sizes was key to the user experience.

Accomplishments that we're proud of

  1. The "Magic" Moment: Watching the progress bar move as Foxit's APIs turn a simple form into a 5-page, password-protected, watermarked onboarding pack in real-time.
  2. Premium Aesthetic: We avoided the generic "enterprise software" look, creating a minimalist, dark-mode experience that feels more like a modern fintech application.
  3. Functional Bulk Upload: Successfully implementing a CSV parser that can trigger mass document generation for dozens of employees at once.

What we learned

  1. Offloading Complexity: We learned that intensive PDF operations (merging, watermarking, protecting) are best offloaded to specialized infrastructure like Foxit's PDF Services, which significantly boosted our app's performance.
  2. API-First Design: Designing the "Onboarding Pack" wizard taught us how to build a user-friendly abstraction over complex backend API pipelines.

What's next for Untitled

  1. e-Sign Integration: Expanding the pipeline to include Foxit eSign directly after document generation for a truly paperless signature flow.
  2. Custom Template UI: Allowing HR admins to upload their own .docx templates and map fields visually within the app.
  3. AI Welcome Notes: Using LLMs to automatically generate personalized, warm "Welcome Letters" based on an employee’s role and department.

Built With

  • dayj
  • docx.js
  • foxit-document-generation-api
  • foxit-pdf-services-api
  • mantine-ui
  • next.js-14
  • react
  • tabler-icons
  • typescript
  • vercel
Share this project:

Updates