How to vibe codeSaply.ai

Prerequisites

• Node.jsfree

  Required runtime for Next.js web application development and build tooling.

• GitHubfree

  Source code repository and CI/CD deployment pipeline integration.

• 

  OpenAI API Accountpay-as-you-go

  Provides GPT model access for structured CV parsing, gap analysis, and plain-language editing.

AI coding tools

• Cursor

  AI-native code editor ideal for iteratively building React components, Tailwind layouts, and API routes.

• Claude Code

  Terminal coding agent capable of executing multi-file scaffolding, database schemas, and complex parsing logic.

Build guide

1. 01Project Scaffolding & Database Schema

   Initialize the Next.js application with TypeScript, Tailwind CSS, and Turso database integration using better-auth.

   Create a new Next.js 16 project with Tailwind CSS, TypeScript, and App Router structure. Configure better-auth with email/password authentication backed by a Turso SQLite database. Set up Drizzle ORM or native libSQL client with tables for users, templates (storing JSON layout definitions), candidate_profiles (storing raw and structured JSON resume fields), and jobs (storing job descriptions and match criteria). Implement an authenticated dashboard layout using shadcn/ui components with a sidebar navigation for CV formatting, templates, and gap analysis.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

2. 02Resume Ingestion & Parsing Engine

   Implement file upload handling for PDF and DOCX documents with automated text extraction and structured JSON normalization using OpenAI.

   Build a robust document ingestion API route in Next.js that accepts PDF and DOCX uploads up to 8MB. Use 'pdf-parse' and 'mammoth' (for DOCX) to extract raw text strings from uploaded files. Pass the extracted text to the OpenAI API via Vercel AI SDK using structured JSON mode (Zod schema validation) to extract a standardized candidate profile object containing personal info, summary, work experience (with dates, titles, descriptions), education, and technical skills. Save the structured profile to the Turso database linked to the user account. Include error handling for unreadable scans or corrupted files.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

3. 03Template Engine & Document Re-injection

   Build a document formatting engine that injects structured candidate data into styled Word templates (.docx).

   Create a CV template management system where users can upload or define styled DOCX template files containing placeholder tags (e.g. {{candidate.name}}, {{experience.title}}). Implement a document generation service using the 'docx' npm library that takes a structured candidate profile JSON object and a selected template definition, merges the data into the template layout, and outputs a freshly styled downloadable .docx file or PDF. Ensure formatting rules preserve typography, margins, and section headings cleanly.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

4. 04Job Matching & Gap Analysis Engine

   Implement AI-driven candidate scoring, strength extraction, and risk area gap analysis against target job descriptions.

   Implement a job description matching view and backend action. Users can paste a job description or select a target role (such as an EU tender requirement like DIGIT-TM III). Send the structured candidate profile and job description to OpenAI using Vercel AI SDK to compute a match score (0-100%), extract explicit strengths, identify critical risk areas or missing skills (e.g. lack of specific certifications or years of experience), and generate tailored bullet points. Render these insights in a clean dashboard component with visual score badges and collapsible risk sections.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

5. 05Plain-Language AI Editor & Anonymisation

   Build an interactive AI editing chat interface for modifying CV sections and stripping PII for anonymisation.

   Build an interactive chat and prompt assistant side panel component for the web platform. Allow users to type plain-language instructions (e.g., 'Make the intro more focused on cloud experience', 'Translate work history to French', or 'Anonymise personal details while keeping company names'). Implement backend API routes that process these instructions against the candidate's structured JSON profile using an LLM, update the profile fields dynamically, and regenerate the preview and downloadable document instantly.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

6. 06Polish, Testing & Final Verification

   Perform end-to-end testing of the CV upload, parse, format, and match loop, fixing edge cases and polishing UI states.

   Review the entire Next.js application workflow from file upload to final document download. Add comprehensive loading skeletons, toast notifications for successful operations, drag-and-drop file upload zones, and responsive mobile-friendly adjustments across all dashboard pages. Verify that API error states, token limits, and database queries are fully robust and error-free.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

Cost vs paying for Saply.ai