The latest articles on DEV Community by Habib Jutt (@habibjutt). https://dev.to/habibjutt 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%2F282846%2Fa1426df1-9336-4eb4-abbc-658a1d1904bc.jpeg https://dev.to/habibjutt en Habib Jutt Thu, 26 Mar 2026 06:14:01 +0000 https://dev.to/habibjutt/i-built-a-free-nextjs-saas-boilerplate-because-i-was-tired-of-rebuilding-auth-and-payments-from-4k6f https://dev.to/habibjutt/i-built-a-free-nextjs-saas-boilerplate-because-i-was-tired-of-rebuilding-auth-and-payments-from-4k6f <p>Every SaaS project I started had the same first two weeks: set up authentication, wire up Stripe, build an admin panel, configure emails, create a blog. By the third time around, I decided to just package everything into one starter and open-source it.</p> <h2> What this is </h2> <p>A production-ready Next.js boilerplate for SaaS applications. It ships with the boring-but-necessary stuff already done so you can focus on the thing that actually makes your product different.</p> <p><strong>GitHub:</strong> <a href="https://github.com/habibjutt/nextjs_boilerplate" rel="noopener noreferrer">github.com/habibjutt/nextjs_boilerplate</a><br> <strong>Live demo:</strong> <a href="https://nextjssaas.netlify.app/" rel="noopener noreferrer">nextjssaas.netlify.app</a></p> <h2> What's in the box </h2> <h3> Authentication </h3> <ul> <li>Email/password, Google, GitHub, and Apple sign-in</li> <li>Two-factor authentication (TOTP)</li> <li>Email verification (toggleable via env var)</li> <li>Password reset flow</li> <li>Session management</li> </ul> <p>All powered by <a href="https://www.better-auth.com/" rel="noopener noreferrer">Better Auth</a>, which I picked over NextAuth because it handles edge cases around session management more reliably in my experience.</p> <h3> Payments </h3> <ul> <li>Stripe integration with subscriptions and one-time payments</li> <li>Customer portal for managing billing</li> <li>Webhook handling for payment events</li> <li>Configurable pricing plans</li> </ul> <h3> Admin dashboard </h3> <ul> <li>User management (view, edit, delete, assign roles)</li> <li>Role-based access control with custom roles</li> <li>Analytics overview</li> <li>Activity logs</li> </ul> <h3> Blog CMS </h3> <ul> <li>MDX-powered content</li> <li>Categories and tags</li> <li>SEO metadata per post</li> </ul> <h3> Other stuff </h3> <ul> <li>50+ UI components (shadcn/ui)</li> <li>Dark mode</li> <li>Transactional emails via React Email + Resend</li> <li>Full SEO setup with structured data</li> <li>Responsive design, mobile-first</li> </ul> <h2> Tech stack </h2> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Layer</th> <th>Tech</th> </tr> </thead> <tbody> <tr> <td>Framework</td> <td>Next.js 16 (App Router)</td> </tr> <tr> <td>Language</td> <td>TypeScript</td> </tr> <tr> <td>Database</td> <td>PostgreSQL + Prisma ORM</td> </tr> <tr> <td>Styling</td> <td>Tailwind CSS</td> </tr> <tr> <td>UI</td> <td>shadcn/ui + Radix</td> </tr> <tr> <td>Auth</td> <td>Better Auth</td> </tr> <tr> <td>Payments</td> <td>Stripe</td> </tr> <tr> <td>Email</td> <td>React Email + Resend</td> </tr> </tbody> </table></div> <h2> Getting started </h2> <div class="highlight js-code-highlight"> <pre class="highlight shell"><code>git clone https://github.com/habibjutt/nextjs_boilerplate.git <span class="nb">cd </span>nextjs_boilerplate npm <span class="nb">install cp</span> .env.example .env <span class="c"># Fill in your env vars (Stripe keys, database URL, etc.)</span> npx prisma migrate dev npm run dev </code></pre> </div> <p>The <code>.env.example</code> file has comments explaining each variable. Most features can be toggled on or off through environment variables - for example, you can disable email verification or two-factor auth with a single flag.</p> <h2> Why I'm sharing this </h2> <p>I built this primarily for myself, but figured it might save other people some time too. It's MIT licensed with no premium tier or gated features.</p> <p>If you try it out, I'd appreciate feedback. And if you find it useful, a GitHub star helps with visibility.</p> <p>Contributions are welcome - whether it's bug fixes, new features, or just pointing out something that could be better.</p> <p><strong>Links:</strong></p> <ul> <li><a href="https://github.com/habibjutt/nextjs_boilerplate" rel="noopener noreferrer">GitHub Repository</a></li> <li><a href="https://nextjssaas.netlify.app/" rel="noopener noreferrer">Live Demo</a></li> </ul> opensource nextjs react typescript