<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: Raj Sharma</title>
    <description>The latest articles on Forem by Raj Sharma (@thefstack).</description>
    <link>https://forem.com/thefstack</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3814056%2F1b54d222-5bec-4ed8-af35-8f28d23fdf19.jpeg</url>
      <title>Forem: Raj Sharma</title>
      <link>https://forem.com/thefstack</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/thefstack"/>
    <language>en</language>
    <item>
      <title>How I Built an AI Resume Builder with Next.js + OpenAI (Solo, in a Few Weeks)</title>
      <dc:creator>Raj Sharma</dc:creator>
      <pubDate>Mon, 09 Mar 2026 06:47:56 +0000</pubDate>
      <link>https://forem.com/thefstack/how-i-built-an-ai-resume-builder-with-nextjs-openai-solo-in-a-few-weeks-1k2p</link>
      <guid>https://forem.com/thefstack/how-i-built-an-ai-resume-builder-with-nextjs-openai-solo-in-a-few-weeks-1k2p</guid>
      <description>&lt;p&gt;I've been working as a full stack developer and kept seeing the same problem — people spend hours tweaking resume formatting instead of focusing on content. Most resume tools are either expensive, locked behind subscriptions, or require you to create an account just to see a template.&lt;/p&gt;

&lt;p&gt;So I built &lt;strong&gt;CVForge&lt;/strong&gt; — an AI-powered resume builder where you upload your CV, GPT-4 rewrites it for ATS and recruiters, you pick a template, and download as PDF or Word. No account required.&lt;/p&gt;

&lt;h2&gt;
  
  
  The Stack
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Next.js 15&lt;/strong&gt; (App Router) — handles both frontend and API routes in one codebase&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;OpenAI API&lt;/strong&gt; (GPT-4o) — resume extraction and AI optimization&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Razorpay&lt;/strong&gt; — payments (UPI, cards, wallets for Indian users)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;MongoDB + Mongoose&lt;/strong&gt; — payment persistence and admin panel&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;pdf-lib + docx&lt;/strong&gt; — generating PDF and Word files server-side&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  How It Works
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;User uploads a PDF or Word resume&lt;/li&gt;
&lt;li&gt;OpenAI extracts all structured data (name, experience, skills, education)&lt;/li&gt;
&lt;li&gt;User picks from 4 professional templates and previews instantly&lt;/li&gt;
&lt;li&gt;Optionally pays ₹15 for AI optimization — GPT-4 rewrites bullet points to be ATS-friendly and keyword-rich&lt;/li&gt;
&lt;li&gt;Pays ₹5 to download as PDF or Word&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  The Hard Parts
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;File generation server-side&lt;/strong&gt; was trickier than expected. Generating pixel-perfect PDFs and DOCX files with proper formatting, tables, and 2-column layouts required a lot of trial and error with the &lt;code&gt;docx&lt;/code&gt; package. Font sizes are in half-points, colors can't have &lt;code&gt;#&lt;/code&gt; prefix — small things that cost hours.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;iOS Safari downloads&lt;/strong&gt; were a pain. Safari kills the user gesture activation after an async chain (like a Razorpay payment popup), so &lt;code&gt;window.open()&lt;/code&gt; gets blocked. Fix: open &lt;code&gt;window.open('about:blank', '_blank')&lt;/code&gt; synchronously before any &lt;code&gt;await&lt;/code&gt;, then navigate it after the fetch completes.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Open window synchronously before any await&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;iosWin&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;window&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;open&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;about:blank&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;_blank&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;

&lt;span class="c1"&gt;// ... do your async work ...&lt;/span&gt;

&lt;span class="c1"&gt;// Then navigate it after fetch completes&lt;/span&gt;
&lt;span class="nx"&gt;iosWin&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;location&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;href&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;url&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Razorpay on mobile&lt;/strong&gt; — on iOS specifically, skip auto-download after payment and show a toast asking the user to tap the download button again with a fresh gesture.&lt;/p&gt;

&lt;h2&gt;
  
  
  What I'd Do Differently
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Start with SSR in mind from day one. I had all my landing page content in a &lt;code&gt;'use client'&lt;/code&gt; component wrapped in &lt;code&gt;Suspense&lt;/code&gt; with &lt;code&gt;useSearchParams&lt;/code&gt; — which meant crawlers saw an empty page. Fixed it by passing &lt;code&gt;searchParams&lt;/code&gt; as props from the server component instead.&lt;/li&gt;
&lt;li&gt;Build the admin panel earlier. Flying blind without usage stats is frustrating.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Result
&lt;/h2&gt;

&lt;p&gt;Live at &lt;strong&gt;&lt;a href="https://cvforge.in" rel="noopener noreferrer"&gt;cvforge.in&lt;/a&gt;&lt;/strong&gt; — just launched on Product Hunt today.&lt;/p&gt;

&lt;p&gt;If you're building something similar or have feedback, drop a comment. Always happy to talk Next.js + AI integrations.&lt;/p&gt;

</description>
      <category>nextjs</category>
      <category>openai</category>
      <category>webdev</category>
      <category>buildinpublic</category>
    </item>
  </channel>
</rss>
