Show HN: Beautiful, blazing-fast native Mac blogging app for @nextjs blogs

ShipFast Alternative – NextJS Boilerplate that's secure, and battle ready

Blog implemented using NextJS App router

Been working in a t3 monorepo and often times tiny ui changes result in having to touch 8-10 different files. Our trpc routes have grown exponentially and each dev is almost adding a new route for each specific feature. We have endpoints that return massive amounts of data fetched by hooks and modifying the prisma query often results in type errors in unrelated files.I have a strong feeling that something is wrong in our trpc &amp; react query hooks&#x27; structure or organization and its severely impacted the dev experience. Does anyone have experience scaling a trpc nextjs application? Are there any code structure or patterns that you use to do trpc the &quot;right&quot; way?I&#x27;m coming from a dotnet &#x2F; laravel stack and minor ui changes would never have spanned more than 2-3 files. It&#x27;s hard to find examples of companies using trpc in production and since its new there isn&#x27;t a lot of info about good practices around it.

Something is wrong w tRPC and NextJS dx

Declarative Streaming with NextJS and tRPC

Figma Style Visual UI Buiilder for NextJS Helps Save Development Time by 60%

Free visual UI builder for production ready NextJS websites(Shadcn,Framer)

A NextJS and Supabase app designed for office workers to kill some time playing games while looking like they&#x27;re on a spreadsheet.Backstory: A few months ago I built a Webapp and used CapacitorJS to have native iOS and Android apps. Having to test any UI changes on desktop web, mobile web, small iPhones, big iPhones, small Androids etc. really became tedious. I promised myself that the next app I built would be built just for a single platform so I could focus on features. I&#x27;m mostly on a laptop and like the web so that&#x27;s my preferred option. So, who spends hours in front of computers...office workers...myself included. I remembered back to a lady in our office who always used to play a little &quot;bubble pop&quot; game she had installed while on the phone to customers. The unwarranted perception was that she was unproductive and shirking. To her defense, the calls were pretty mundane and she still got her job done...if only us judgy colleagues didn&#x27;t know she was playing it. Hence this latest app. It&#x27;s a webapp that at first glance across an office should look like the user is working on a spreadsheet. Sticking to my guns, I haven&#x27;t even made it mobile responsive although I am tempted to do so. The irony - it&#x27;s blocked on my work network so i&#x27;m unable to test it while at work and see what colleagues think.General motivation: The games are free to play but I have added a leaderboard that I have locked behind a paywall. The leaderboard will track a users top weekly and all-time scores per game and rank these scores across all users. There is another leaderboard table that sums up the top scores across all games per user and ranks the users based on this. I had tried to add an AdSense banner ad to further motivate people to pay to remove these but Google declined my request suggesting the website was low content. I&#x27;m not sure how to get around that...but will figure it out at some stage.To do list:
&quot;Launch&quot; on Hacker News (been putting this off for weeks overthinking it), 
Check on copyright issues (just thought of this while writing this), 
Banner ad&#x27;s, 
Improve the wordle game and integration with leaderboard, 
Optimize the leaderboard queries as they take quite long, 
UI refinement and consistency, 
Mobile responsiveness?

Show HN: Classic games that look like a spreadsheet for office workers

Hey HN,The latest MCP spec (<a href="https:&#x2F;&#x2F;modelcontextprotocol.io&#x2F;specification&#x2F;2025-06-18&#x2F;basic&#x2F;authorization" rel="nofollow">https:&#x2F;&#x2F;modelcontextprotocol.io&#x2F;specification&#x2F;2025-06-18&#x2F;bas...</a>) requires MCP Servers implement OAuth for authenticating users and authorizing access to tools and resources. I spent way too long wiring up OAuth to build a ChatGPT connector and decided to wrap the pain into a library: @mcpauth&#x2F;auth.What it is:- Self-hosted OAuth server, built for Model-Context-Protocol- Single authenticateUser() hook, so you plug in whatever session logic you already have (NextAuth, Auth.js, plain cookies, JWT, you name it)- Adapters: Next.js and Express; stores: Drizzle or Prisma- ISC licensed, no calls homeQuick start is ~5 min: npm i @mcpauth&#x2F;auth, add two route handlers, set three env vars.Live demo: <a href="https:&#x2F;&#x2F;mcpauth-nextjs.vercel.app&#x2F;" rel="nofollow">https:&#x2F;&#x2F;mcpauth-nextjs.vercel.app&#x2F;</a>If you’re building an MCP server or any internal AI tool that needs proper OAuth, I’d love feedback — especially on edge cases or new functionality.Repo: <a href="https:&#x2F;&#x2F;github.com&#x2F;mcpauth&#x2F;mcpauth">https:&#x2F;&#x2F;github.com&#x2F;mcpauth&#x2F;mcpauth</a>

Show HN: Self-Hosted OAuth Authentication Library for MCP Servers

Hello, I am a current sophomore in uni. When I was a freshman, near the beginning of the school year, many clubs were having their introductory meetings.As I attended several meetings of the clubs; I noticed a prevalent issue, that clubs often had a poor, strung together system to keep track of attendance, coordinate scheduling, issue onboarding, and others. This gave me the idea to build a tool to meet the demand for some of these clubs.From talking to some current club leadership at my uni, I have garnered some positive validation for my idea as a business initiative, suggesting it could be viable.I believe a freemium SaaS would be the ideal business model, allowing an easy entrance for clubs, balancing wit premium features for clubs that have more users, larger files, more complex onboarding procedures, etc.Is anyone interesting in working with me on this project? I am a Computer Science major currently interning for the Summer, and I have experience with NextJS and Supabase as a frontend based developer. My ideal cofounder is one that is a bit older and more experienced, and sees a similar opportunity to develop this into a profitable business.My discord is happiers if you would like to get into contact with me there.:)

Looking for people interested in working on a project together

2 years ago I learnt NextJS &amp; React. Then for two years I totally forgot about it. Went on to do other things in life. Then 2 months ago, I came back, won a hackathon, and realized the potential I had. This is my attempt at my very first SaaS Business.I created Paynic because invoicing shouldn&#x27;t be a hassle. It&#x27;s fast, intuitive, and keeps your finances in check effortlessly.What makes it unique? Simplicity meets power—you create easy and beautiful invoices, share them to your customers, and be in total financial control, all in one sleek app. Easily create, send, and track payments, keeping your finances organized and stress-free.What do you think? Want me to tweak anything? Any suggestions or features you want me to add I will add straight away!I am open to any feedback!

Show HN: I built a SaaS as a 13yr old

I built this app initially for myself to learn to type properly because most typing apps didn&#x27;t offer exactly what I was looking for: interesting short-form text content, visual hand guides, detailed stats, etc.Typing random words on platforms like keybr and monkey type didn&#x27;t appeal to me - I would get bored fairly quickly and this limited my practice timeHence, TypeQuicker was born.My speed went from averaging 30-40WPM to 80-120WPM using this appHow it differs from other existing apps: it uses engaging content (trivia, quotes, jokes, book snippets) instead of random words. The AI analyzes your typing patterns and generates exercises targeting your specific weak character sequences. It offers very detailed stats after each text - measuring time between every keystrokeFeatures include:- visual hand and keyboard guides for beginners- detailed analytics- daily typing tests with a global leader-board- custom racing rooms- 40+ themes (some community favourites like Gruvbox, Tokyo Night and Dracula)- multiple text topics to choose from- custom text: input whatever you want to type- drills mode: practice typing common character sequences- (Paid) AI personalization: see <a href="https:&#x2F;&#x2F;www.typequicker.com&#x2F;pricing" rel="nofollow">https:&#x2F;&#x2F;www.typequicker.com&#x2F;pricing</a> for more info on these features.Built with Go&#x2F;Redis&#x2F;Postgres backend and NextJS frontend.Still adding many more features - this is still very much an MVP so I would love feedback from the community.I&#x27;m hoping to make this a one-stop shop for everything typing related.Try it at: <a href="https:&#x2F;&#x2F;www.typequicker.com" rel="nofollow">https:&#x2F;&#x2F;www.typequicker.com</a>

Show HN: TypeQuicker – The AI Typing Application

Hey HN,After spending countless hours tweaking colors in side projects and manually trying to match screenshots to Tailwind CSS classes, I decided to build a tool to automate it.ColorSnap lets you upload an image and instantly extract the most dominant colors. It then maps those colors to the closest Tailwind CSS utility classes using LAB color comparison (ΔE). You get clean hex values and ready-to-use class names like bg-indigo-500 or text-pink-400.Built with Nextjs, Tailwind CSS, and a bit of canvas&#x2F;image processing. No external APIs — it runs entirely in the browser.Outcome: I’ve used it in my last 3 frontend projects to speed up color decisions and get consistent styling fast, especially for hero sections and themed UI blocks.

Show HN: I built ColorSnap to generate Tailwind color palettes from images

Hi HN — I built Superexpert.AI, an open‑source platform that lets you spin up multi‑task AI agents in minutes without writing any code (and lets you extend everything later).What it does- Plug‑and‑play agents – Create agents from a web form. Each agent can contain multiple tasks, and each task can run a different AI model, use its own tools, and follow custom instructions.- First‑class extensibility – Register a TypeScript function with registerServerTool, registerClientTool, or registerContextTool to add new functionality. If you want to share it, publish it as an NPM package and Superexpert.AI will auto‑detect it when installed.- Built‑in RAG – Upload docs via the UI, or use a CLI that chunks 100 MB files, auto‑resumes after network errors, auto-resumes after network errors (e.g. uploading a 500-page PDF manual) and pipes the data into your agent.- Launch a full chat app in minutes – Everything is MIT‑licensed NextJS + TypeScript + Tailwind + Postgres. Deploy like any other NextJS project.Links- Walkthrough (no sign‑up): <a href="https:&#x2F;&#x2F;app.arcade.software&#x2F;share&#x2F;yGqgrj65xp6y4mkDbNnT" rel="nofollow">https:&#x2F;&#x2F;app.arcade.software&#x2F;share&#x2F;yGqgrj65xp6y4mkDbNnT</a>- Live demo (email sign‑up): <a href="https:&#x2F;&#x2F;demo.superexpert.ai&#x2F;" rel="nofollow">https:&#x2F;&#x2F;demo.superexpert.ai&#x2F;</a>- GitHub repo: <a href="https:&#x2F;&#x2F;github.com&#x2F;Superexpert&#x2F;superexpert-ai">https:&#x2F;&#x2F;github.com&#x2F;Superexpert&#x2F;superexpert-ai</a>- Quick‑start guide: <a href="https:&#x2F;&#x2F;superexpert.ai&#x2F;docs&#x2F;quick-start&#x2F;" rel="nofollow">https:&#x2F;&#x2F;superexpert.ai&#x2F;docs&#x2F;quick-start&#x2F;</a>- Full docs &amp; tutorials: <a href="https:&#x2F;&#x2F;superexpert.ai&#x2F;" rel="nofollow">https:&#x2F;&#x2F;superexpert.ai&#x2F;</a>Why I built itI kept hand‑coding LangGraph‑style workflows for clients and wanted a web‑first, stack‑agnostic way to launch agents fast and stay fully modifiable. Superexpert.AI lets you extend or swap every layer — from models to tools to UI themes — with TypeScript.Looking for feedback1. Agent use‑cases you still have to hand‑code today.2. Gaps in the RAG flow or model tooling that block production use.Discord for deeper chat: <a href="https:&#x2F;&#x2F;discord.gg&#x2F;wsrc3enWN3" rel="nofollow">https:&#x2F;&#x2F;discord.gg&#x2F;wsrc3enWN3</a>–– Stephen

Show HN: Superexpert.ai – Open-source, no-code platform for multi-task AI agents

I’m 36 now and longing for the late nights playing poker with the boys.We’re so busy with families&#x2F;careers that getting a game is never going to happen.So I had the idea of Turn-Based Poker, like Words With Friends but for Hold’em.Get a push notification when it’s your turn to act, so we can play on the train, between meetings, on the toilet, etc.It&#x27;s built entirely on Expo + React Native + Firebase with a NextJS backend.I wrote a custom animation engine on top of React Native to render the card animations.Hope you like it!

Show HN: AsyncPoker – Turn-Based Poker with Friends

Built this to show off the recently released Flux Kontext model which is great at making edits based on your description, while keeping everything else the same. Eg. &quot;make him wear a suit&quot;, &quot;change the background to the beach&quot;, etc. No mask, etc needed.I&#x27;ve used Nextjs 15, and this page is static and fully client side. I&#x27;m still torn between the value of RSC, and the downside of it not being served from a CDN.I use Supabase for Db and Auth. Happy with these general, but their auth needs some work. The official supabase auth docs still recommend logic in nextjs middleware which hits your DB for protected routes.My app gives you 3 free edits per day with no sign up required. There&#x27;s rudimentary vibe-coded logic to enforce this, please don&#x27;t bankrupt me, i have a wife and kids.There&#x27;s potential to expand on what the app can do with flux kontext also supporting multiple images as a prompt, for things like combining people into one photo.Open to feedback and ideas on the tech, product or pricing.

Show HN: I built a web app to edit photos with a prompt using Flux Kontext

Hey HN,I built Fotify, a tool to simplify the chaos around event photos and RSVPs.At most events, guests take amazing photos—but they stay on their phones, or get shared days later in fragmented WhatsApp groups or Google Drives. Invitations and RSVPs are often handled on completely separate tools.Fotify solves that with one simple QR code.
Guests scan it → upload photos → they appear live on a photo wall. Meanwhile, organizers manage digital invites and RSVPs from the same dashboard. No app installs, no logins.Some features:Live photo uploads and display during the eventAI moderation and full-quality downloadsDigital invitations with RSVP trackingOptional photographer tools for uploading and organizing large setsBuilt with NextJS, NestJS, Cloudflare R2&#x2F;Images&#x2F;WorkersWould love your feedback on the product, pricing, or anything you think could break.Try it at <a href="https:&#x2F;&#x2F;fotify.app" rel="nofollow">https:&#x2F;&#x2F;fotify.app</a>
 AMA – happy to answer technical, product, or growth questions.

Show HN: Fotify – Real-time event photo sharing and RSVPs via QR (no app needed)

This is my attempt to do something fun with generative AI. I&#x27;ve tested this with some family members and their kids seems to love it. It&#x27;s a bit pricey to make the stories and I&#x27;ve gone back and forth a bit on pricing models. I&#x27;ve settled on free for now and if it gets traction I can solve that problem later.I would love to get your feedback on the site!For the technical details - this was built with NextJS, hosted on Vercel, and coded with Cursor + Claude Code. We&#x27;re not allowed to use Cursor or Claude Code at work, so this has been quite eye opening to see how good this stuff actually is. I work with React professionally but it&#x27;s internal tooling so we don&#x27;t use SSR. It was nice to get hands on with it.

Show HN: AI Illustrated Stories for Stuffed Animals

Would you use a visual builder if it saved you hours building UIs from scratch? without compromising on code quality or design? The builder generates clean, exportable Next.js code and includes production-ready design components.If this sounds like something you&#x27;d be open to trying, I&#x27;m happy to share the link. I&#x27;d really appreciate any insights or feedback you have even if it&#x27;s critical. It would help a lot in making the product genuinely more useful for the Nextjs users.Thank you so much!!

Next.js devs and founders-thoughts on visual UI builders with full code control?

I built an open-source email prioritization system that automatically organizes Gmail emails using AI classification.The problem: I was getting 200+ emails daily and missing important business opportunities buried in newsletters and spam. Manually sorting took hours.The solution: A NextJS application that:
- Connects to Gmail via IMAP
- Uses NVIDIA&#x27;s Llama-3.1-nemotron-ultra model for classification
- Automatically creates and organizes emails into &quot;AI-Priority&#x2F;Needs Reply&quot; and &quot;AI-Priority&#x2F;Business&quot; folders
- Processes emails in batches with timeout protection
- Runs every 15 minutes via cron jobsTechnical details:
- Built with NextJS, TypeScript, and Tailwind
- NVIDIA LLM API for intelligent email analysis
- Gmail IMAP integration with proper error handling
- Vercel deployment with environment variable security
- Comprehensive logging and monitoringPerformance:
- Processes 25 emails in 33 seconds
- 99% classification accuracy
- Handles 200+ emails daily
- Saves 2+ hours of manual sortingThe classification logic identifies:
- Needs Reply: Direct questions, meeting invites, customer inquiries, personal messages
- Business: Job offers, partnerships, investment opportunities, sales leadsEverything is open source with comprehensive documentation, free Vercel deployment, use of free NVidia NIM LLM API, free plan for Val Town, and customizable AI prompts.GitHub: <a href="https:&#x2F;&#x2F;github.com&#x2F;anandvc&#x2F;email-prioritizer">https:&#x2F;&#x2F;github.com&#x2F;anandvc&#x2F;email-prioritizer</a>What email automation challenges do you face? Would love feedback on the classification logic!

Show HN: AI Email Prioritizer – Auto-Organize Gmail with Nvidia LLM

# This is a NextJS
NextJS is a **framework for ReactJS**.

Wait a second ... a "framework" for React? Isn't React itself already a framework for JavaScript?

Well ... first of all, React is a "library" for JavaScript. That seems to be important for some people.

Not for me, but still, there is a valid point: React already is a framework / library for JavaScript. So it's already an extra layer on top of JS.

## Getting Started

Create Next App:

```bash
npx create-next-app
# or
yarn create next-app
```

First, run the development server:

```bash
npm run dev
# or
yarn dev
```

Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.

You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.

[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`.

The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.

## Why would we then need NextJS?

Because NextJS makes building React apps easier - especially React apps that should have server-side rendering (though it does way more than just take care of that).

In this article, we'll dive into the core concepts and features NextJS has to offer:

- File-based Routing
- Built-in Page Pre-rendering
- Rich Data Fetching Capabilities
- Image Optimization
- Much More

## File-based Routing

![Create routes via your file + folder structure](nextjs-file-based-routing.png)

# File-based Routing In Action

![Create routes via your file + folder structure](nextjs-file-based-routing-in-action.png)

## Learn More

To learn more about Next.js, take a look at the following resources:

- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.

You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!

## Deploy on Vercel

The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.

Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.

... More content comming soon ...

NextJs News

News From: hn.algolia.com