Show HN: Env Validator (NextJS and SvelteKit)

For some reason, embedding a Jupyter notebook in a documentation site still means doing one of these: screenshot every cell, run nbconvert and clean up the HTML, copy-paste the code into fenced blocks (losing the output), or iframe in nbviewer. Every time you update the notebook, you redo the whole dance.notebook-mdx lets you just link the `.ipynb` file and it renders inline in your MDX. No export step, no cleanup, no re-pasting. Update the notebook, rebuild the docs, done.<pre><code> :::notebook{file=&quot;.&#x2F;analysis.ipynb&quot;}
 :::
</code></pre>
That&#x27;s the API just link the file. You get authentic Jupyter styling (In&#x2F;Out prompts, syntax highlighting, rich outputs including images and HTML), build-time rendering so there&#x27;s zero client-side JS, multi-language support (Python, R, JS, SQL). Works with Next.js, Docusaurus, Fumadocs, and any MDX framework.Example output:- Example 1: <a href="https:&#x2F;&#x2F;notebook-mdx.vercel.app&#x2F;docs&#x2F;examples&#x2F;notebook-demo" rel="nofollow">https:&#x2F;&#x2F;notebook-mdx.vercel.app&#x2F;docs&#x2F;examples&#x2F;notebook-demo</a>- Example 2: <a href="https:&#x2F;&#x2F;notebook-mdx.vercel.app&#x2F;docs&#x2F;examples&#x2F;directive-example" rel="nofollow">https:&#x2F;&#x2F;notebook-mdx.vercel.app&#x2F;docs&#x2F;examples&#x2F;directive-exam...</a>Repo: <a href="https:&#x2F;&#x2F;github.com&#x2F;abhay-ramesh&#x2F;notebook-mdx" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;abhay-ramesh&#x2F;notebook-mdx</a>Docs: <a href="https:&#x2F;&#x2F;notebook-mdx.vercel.app" rel="nofollow">https:&#x2F;&#x2F;notebook-mdx.vercel.app</a>

Show HN: Embed Jupyter Notebooks in NextJS/Docusaurus/Fumadocs Docs

Simple NextJS deployment engine built with Go

Hi all!I&#x27;ve built a small tool to visualize how inefficient `docker pull` is, in preparation for standing up a new Docker registry + transport. It&#x27;s bugged me for a while that updating one dependency with Docker drags along many other changes. It&#x27;s a huge problem with Docker+robotics. With dozens or hundreds of dependencies, there&#x27;s no &quot;right&quot; way to organize the layers that doesn&#x27;t end up invalidating a bunch of layers on a single dependency update - and this is ignoring things like compiled code, embedded ML weights, etc. Even worse, many robotics deployments are on terrible internet, either due to being out in the boonies or due to customer shenanagins. I&#x27;ve been up at 4AM before supporting a field tech who needs to pull 100MB of mostly unchanged Docker layers to 8 robots on a 1Mbps connnection. (and I don&#x27;t think that robotics is the only industry that runs into this, either - see the ollama example, that&#x27;s a painful pull)What if Docker were smarter and knew about the files were already on disk? How many copies of `python3.10` do I have floating around `&#x2F;var&#x2F;lib&#x2F;docker`. For that matter, how many copies of it does DockerHub have? A registry that could address and deduplicate at the file level rather than just the layer level is surely cheaper to run.This tool:- Given two docker images, one you have and one you are pulling, finds how much data docker pull would use, as well as how much data is _actually_ required to pull- Shows an estiimate for how much time you will save on various levels of cruddy internet- There&#x27;s a bunch of examples given of situations where more intelligent pulls would help, but the two image names are free text, feel free to write your own values there and try it out (one at a time though, there&#x27;s a work queue to analyze new image pairs)The one thing I wish it had but haven&#x27;t gotten around to fitting in the UI somehow is a visualization of the files that _didn&#x27;t_ change but are getting pulled anyhow.It was written entirely in Claude Code, which is a new experience for me. I don&#x27;t know nextjs at all, I don&#x27;t generally write frontends. I could have written the backend maybe a little slower than Claude, but the frontend would have taken me 4x as long and wouldn&#x27;t have been as pretty. It helped that I knew what I wanted on the backend, I think.The registry&#x2F;transport&#x2F;snapshotter(?) I&#x27;m building will allow both sharing files across docker layers on your local machine well as in the registry. There&#x27;s a bit of prior art with this, but only on the client side. The eStargz format allows splitting apart the metadata for a filesystem and the contents, while still remaining OCI compliant - but it does lazy pulls of the contents, and has no deduplication. I think it could easily compete with other image providers both on cost (due to using less storage and bandwidth...everywhere) as well as speed.If you&#x27;d be interested, please reach out.

Show HN: Docker pulls more than it needs to - and how we can fix it

I built Easemonitor to keep track of service uptime, response times, SEO, vulnerability scans, etc.
It&#x27;s 100 % open‑source (GPL‑3), runs in Docker on a cheap VPS and includes:NestJS API + worker with BullMQ queues
NextJS frontend with SSR caching &amp; image optimization
Prometheus metrics, Loki logs, Grafana dashboards, Jaeger tracing
JWT rotation, WAF rules, CSP&#x2F;HSTS, CVE audit scripts
Webhook DLQ, queue dashboard, healthchecks, maintenance mode
You can try it on my demo <a href="https:&#x2F;&#x2F;easemonitor.com" rel="nofollow">https:&#x2F;&#x2F;easemonitor.com</a>Would love feedback, contributions, or ideas for features.

Show HN: Easemonitor – self‑hosted uptime and performance monitoring

Hi HackerNews,Ruslan here.I once posted here a story how I got AWS $4k surprise bill for one day (<a href="https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=31907374">https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=31907374</a>), which is why I built DollarDeploy. I believe 95% of apps don&#x27;t need complicated AWS infrastructure and can be hosted using simple server from Hetzner, Digital Ocean, etc.Today I am launching an AI agent on DollarDeploy. The AI agent can automatically build and deploy your NextJS&#x2F;React, Go, Rust, or other types of apps to your own servers, running all commands via SSH on your server. You just type your commands or paste your GitHub repo link!DollarDeploy is similar to Dokploy expected there is no self-hosted version, because we want to offer a simple solution which you don&#x27;t configure and maintain - just add your GitHub repo and you are good to go.What makes DollarDeploy different is that we run apps as isolated Systemd processes on your server, and you can install Redis, Postgres, and other services to your host in a single click. Everything works locally, with low overhead as normal Linux processes, without the need of third party services.Try deploying your app — takes under 5 minutes. Looking for your feedback and opinion! Happy to answer any questions you have!FAQ: 1) To use DollarDeploy, you need to bring your own server or provision one directly through UI&#x2F;AI. 2) We have 14-day trial. 3) We are using OpenAI LLMs (probably will change soon) 4) You can use quick boilerplate to launch the app, or a template for open source software, including running GPT-OSS LLM model

Show HN: DollarDeploy AI, agent to deploy your web apps to production

Hi, I&#x27;m Andrew, a long-time hacker about to turn 50 in a few days. Today I&#x27;d like to tell you how taout.tv came into my life. It stands for &quot;talk it out&quot; and I&#x27;m told this is a &quot;portmanteau&quot; when you push two words together like brunch or smog. I met Greg at a Los Angeles tech networking group and he told me the idea.His pitch was &quot;I&#x27;ve literally heard Joe Rogan explain my product. Two people can&#x27;t agree on a subject, both think they are right. They should just talk it out.&quot; I agreed to a two-week trial as his CTO. He had been working on this for 2 years with an off-shore team. They picked nextjs for web frontend and backend, react native for ios and android, elasticsearch, redis, and postgres. Hosted on 8 digital ocean droplets and using 100ms.live for the live broadcast rooms.I was able to get the droplet count (and size) down to just 2, using only postgres (pgvector search), frontend web is just js react no nextjs. Backend is now all golang. And the two mobile apps are native swift and kotlin.There&#x27;s actually a lot to this platform. If you are familiar with orgs like bridgeusa.org or braverangels.org this idea of bridging people on two different sides is something a lot of people care about. You schedule a podcast with someone you already know, or you can just post your desire to talk about a subject with anyone. You and your co-host go live and the audience can watch and score each side in real time. You can upload evidence to support your side and all these scores are tracked and recorded.Would love some feedback from users with podcasting experience.<a href="https:&#x2F;&#x2F;www.taout.tv&#x2F;" rel="nofollow">https:&#x2F;&#x2F;www.taout.tv&#x2F;</a>Thanks!

Show HN: Bridging People Together via Podcasts

This was a fun project for an important use case - I hope this is valuable and can serve as a resource.Tech Stack: MapCN, NextJS, x API, AI SDK

Show HN: Situation Monitor

Hi HN,I am the developer behind I.T. Never Ends. It is a card-based resource management game (heavily inspired by Reigns) where you work IT support for a corporation taken over by eldritch horrors. You balance ticket resolution, budget, and entropy while dealing with printers that violate causality.I wanted to share a technical deep dive into how I built and packaged it, which I recently wrote about in a devlog: <a href="https:&#x2F;&#x2F;dadbodgames.itch.io&#x2F;it-never-ends&#x2F;devlog&#x2F;1388428&#x2F;building-a-system-for-the-absurd-why-it-never-ends-is-actually-a-website" rel="nofollow">https:&#x2F;&#x2F;dadbodgames.itch.io&#x2F;it-never-ends&#x2F;devlog&#x2F;1388428&#x2F;bui...</a>Here is a quick overview of the technical architecture and some lessons learned from the process:The Architecture:
The entire game is built in React and JavaScript. Under the hood, the game is essentially a giant state machine. While I have used engines like Godot for previous dynamic action titles, I am a full-stack developer by day (mostly NextJS). For a text-heavy, UI-driven game like this, I found the traditional object-oriented approach in standard engines required too much manual glue code to wire the game state to the UI. React&#x27;s declarative approach using state as truth allowed me to iterate incredibly quickly on the content itself, which makes up 90% of the gameplay.The Build Pipeline (Tauri vs. Electron):
Packaging a web application for Steam and the Steam Deck was the biggest hurdle. I ended up having to split my approach:Windows: I use Tauri. It is significantly lighter and creates a much smaller binary by hooking into the OS webview.Steam Deck &#x2F; Linux: I had to switch to Electron. SteamOS does not have a reliable pre-installed webview for Tauri to hook into out of the box. To handle robust save data persistence without relying on heavy Node.js filesystem modules, I wrote a small &quot;sidecar&quot; binary in Rust. The Electron frontend talks to this sidecar via JSON-RPC to handle atomic writes to the disk, which keeps the game running at a smooth 60fps on the Deck.The Data &amp; Community Pricing:
I have been fortunate to see over 10,000 plays on the Itch web build in the last two months, plus another 3,000 players on the Steam demo since February 1st.To gather player feedback efficiently at the edge, I built a custom system directly into the game client. The game has write-only access to a Supabase project. Players use an in-game, thematically fitting feedback form to submit friction points, purchase intent, and pricing data. This pipes directly into a Discord webhook via edge functions and is broadcasted live to our community. The idea is to let the community decide the final price of the game by popular vote (currently converging around the $12 to $13 mark).You can play the free web build on Itch here: <a href="https:&#x2F;&#x2F;dadbodgames.itch.io&#x2F;it-never-ends" rel="nofollow">https:&#x2F;&#x2F;dadbodgames.itch.io&#x2F;it-never-ends</a>
There is also a standalone Steam demo if you prefer: <a href="https:&#x2F;&#x2F;store.steampowered.com&#x2F;app&#x2F;4225400&#x2F;IT_Never_Ends&#x2F;" rel="nofollow">https:&#x2F;&#x2F;store.steampowered.com&#x2F;app&#x2F;4225400&#x2F;IT_Never_Ends&#x2F;</a>I would love to hear your thoughts and am happy to answer any questions about the React state management, the Rust sidecar, or the Steam Deck build pipeline!

Show HN: I built a card-based eldritch IT support game in React

i built this because i’ve been experimenting with MCP and felt there was a need lightweight version for ecosystem.most existing clients felt a bit too noisy and bundled into larger ecosystems, so i wanted simplest&#x2F; near plain version that just focuses on end-user chat experience.stack(main): NextJS(App Router) + Vercel AI SDKcapabilities:+ set single MCP endpoint and brand mode(bring your own brand asset) on ENV+ prepare local db or external endpoint(SQLite, PostgreSQL, MySQL)+ choose in-memory(default) or external&#x2F; local Redis endpoint+ built-in auth via Better Auth &amp; Resend(optional)+ support file upload with Cloudflare R2+ support location-sharing with LeafletJS and Browser Geolocation or Google Maps Platform+ automatic data cleanup with Trigger(free-tier trigger.dev is ENOUGH)+ auto-detect user location so they dont need to set timezone manually+ locale currently support 10 languages(EN, ID, KR, JP, ES, ZH, DE, NL, FR, IT)+ plain&#x2F;minimalist interface+ install with single interactive script(you will prompted to fill ENV) via command line+ ready to deploy manual(assume Docker), Dokku, Render, and Fly+ open-source with some restriction only for other hosting&#x2F; consulting business(personal&#x2F; org who charge people anything as exhange)im looking for feedback on the implementation and codebase, especially from anyone else building MCP, frontend developer, and security.checkout repo: <a href="https:&#x2F;&#x2F;github.com&#x2F;repaera&#x2F;chat" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;repaera&#x2F;chat</a>

Show HN: Chat – Another open-source chat UI for MCP Server

Montage is a fork of Remotion&#x27;s NextJS template, set up for coding agents to quickly produce motion graphics videos.In May 2025 I commissioned a team of motion designers to create a launch video. It cost us $2000 and 4-5 days of my full attention.I noticed the video was likely built using a set of animations and transitions that this motion design team reused for all their customers. My theory was that if I could recreate that set of animation primitives and put them in a format coding agents could understand, I&#x27;d be able to create launch videos end-to-end way faster and have full control over the final product.I spent 3 days setting up the repo and 4 hours building the motion video you see above. Those 3 days consisted of 1) building out the set of primitives and 2) building the iterative agent rendering loop so the agent could work autonomously.The primitives I built were:Text (word drag-in, flip-up, gradient fill, typing animation)
Motion (object pop in, fade right, fade left, swoop, float, etc.)
React components (logo, cursor, animated browser, animated terminal)
Background designs (radial gradient, corner gradient, color fade, etc.)The way I built these primitives was surprisingly simple. I leveraged Gemini&#x27;s ability to analyze videos (Claude and GPT don&#x27;t accept videos as a modality yet) by attaching the previous motion-designed video and giving it this prompt:&quot;Is it possible for you to thoroughly go throughout the video and, in detail, note all the different text transitions and what they look like, describing them in natural language so I can put them in my animation tool?&quot;It gave me a text file which I dumped into a coding agent (in my case Claude Code) to build animation primitives with. I repeated that for motion transitions and background designs, and modified existing React components to work with Remotion.For building the iterative agent rendering loop, I gave the agent the ability to test its sections end to end.Remotion can render individual frames via a bash command (npx remotion still {flags}) so I put in the AGENTS.md to heavily use that when designing sections. I also tried having the agent browser-use the Remotion editor spun up as a local dev server, but this was too confusing — it had to know how to scrub through frames in the UI, select the right sequence to check, etc. So I ended up sticking with the Bash command and found that coding agents could do a decent job testing animations by rendering frames 10-20 steps apart.I&#x27;d love for you to try this out and welcome any feedback. Montage has really helped me create high-quality motion videos (an example is in the repo).

Show HN: Montage – Quickly build product launch videos with coding agents

I built ReportBurster out of frustration with current BI stacks.Most tools live in two separate worlds:- Beautiful dashboards and analytics tools — great for charts, weak for reporting, and many push you towards their SaaS. 
- Powerful report generators — pixel-perfect PDFs, but no real analytics or exploration.Stitching 4–5 tools together with scripts, glue code, and workarounds became the norm.Plus, most modern tools are SaaS-first. If you want serious reporting, automation, portals, or embedding — self-hosted and open-source — options shrink fast.ReportBurster aims to handle the entire data-to-delivery pipeline in one platform, powered by the *AI Crew* — your council of AI oracles that learn your projects, preferences, and workflows:- Explore &amp; visualize data (aka Chat2DB using AI) 
- Generate pixel-perfect reports 
- Automate bursting and distribution 
- Build secure document portals 
- Build, deploy, or embed dashboards and OLAP analytics directly into your own appsBuilt with Angular, Java, and NextJS. Fully self-hosted and open-source — *no more SaaS lock-in*.GitHub: <a href="https:&#x2F;&#x2F;github.com&#x2F;yourusername&#x2F;reportburster" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;yourusername&#x2F;reportburster</a> 
Website: <a href="https:&#x2F;&#x2F;www.reportburster.com" rel="nofollow">https:&#x2F;&#x2F;www.reportburster.com</a>I’d love feedback on usability, feature ideas, or contributions!

Show HN: ReportBurster – Self-hosted all-in-one tool for analytics and reporting

I built this app as a hobby project to experiment with developing a full-stack product from scratch—handling everything from the core utility and vision to the actual implementation. It took me about three months to build, and it was a massive learning experience that has prepared me to tackle my next set of projects.What it does:
The app allows you to create documents, whiteboards, and databases integrated with reminders and nested, agentic AI chats.The &quot;Beta&quot; Reality:
To be completely honest, the app is still quite &quot;broken&quot; in several areas. You might run into loading issues, UX friction, or bugs that could interrupt your workflow. I wouldn&#x27;t recommend using this for mission-critical work yet; please treat it as a live demo or a functional prototype.About the Subscription:
You’ll see a payment option with certain limits. Honestly, I don&#x27;t recommend paying for it right now given the current state of the app. If you do choose to subscribe, please consider it a donation to support further development rather than a purchase for a polished service.Feedback &amp; Collaboration:
I have a lot of ideas for where to take this next and I plan on iterating quickly. I’d love to get your feedback on the concept, and if anyone is interested in collaborating or just chatting about the tech, I’m all ears.Link: www.listal.space
Tech Stack: NextJS, TailwindCSS, Typescript, Supabase(Auth and Database), Tavily(ai web search), Groq, R2 Cloudflare, Vercel(Hosting)Thanks for checking it out!

Show HN: A productivity app with reminders and nested AI chats

Hey HN,About 5 years ago, I built a weightlifting app for 5&#x2F;3&#x2F;1 that got me on the front page of HN [0]. After that, life happened. I had kids and so decided to get a job and put that project on ice. Eventually I grew too disappointed with my job, and decided to try building something again.The biggest feedback I kept getting from users was simple:
“Let me create my own programs.”That’s how Vis started.The initial idea was to create a B2B platform where gyms and trainers could build programs using formulas (e.g., percentages of 1RM) and reusable blocks instead of spreadsheets. I built what I still think is the best workout editor out there, but I quickly found out that B2B sales is hard (or maybe I just suck at it). It also just didn’t feel like a big enough sell for gyms.So I pivoted. I focused on the iOS app for a while [1], and now re-packaged the editor so individuals can use it directly.With Vis Pro, you can:- Define programs using formulas (e.g., 0.85 * SQUAT_1RM, or even better: RPE(8, SET_REPS) * SQUAT_1RM)- Build workouts by re-using pre-defined or even custom blocks- Share your programs and workouts with othersThe core idea is that programs are parametric instead of static. Change your 1RM and the entire program recalculates automatically.You can try it out without an account at <a href="https:&#x2F;&#x2F;vis.fitness&#x2F;pro&#x2F;try&#x2F;create-program" rel="nofollow">https:&#x2F;&#x2F;vis.fitness&#x2F;pro&#x2F;try&#x2F;create-program</a>The whole thing is built with NextJS, using Chevrotain (surprisingly solid) for the formula engine.It&#x27;s been super interesting using Codex since late Dec. It&#x27;s been a huge force multiplier, enabling me to ship really cool features like formula autocomplete and syntax highlighting in a couple of hours. I&#x27;m used to reviewing a lot of code from my time at Google, so that hasn&#x27;t been a problem, but it&#x27;s interesting to feel that the review speed is now the limiting factor. Though the codebase would become unmaintainable real quick without that.The next step is building an MCP server to allow users to create programs using LLMs and have them show up directly in the editor (and your phone).Would love feedback, whether you even lift or not![0] <a href="https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=31508009">https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=31508009</a>[1] <a href="https:&#x2F;&#x2F;apps.apple.com&#x2F;us&#x2F;app&#x2F;vis-next-generation-workouts&#x2F;id6743175121">https:&#x2F;&#x2F;apps.apple.com&#x2F;us&#x2F;app&#x2F;vis-next-generation-workouts&#x2F;i...</a>

Show HN: Vis Pro – A Formula-Based Workout Program Editor

Yes, the main thing is that we&#x27;re trying to see if AI can have an easier time using one framework vs. another, and how important it is.All Rails-like frameworks (Django, Laravel, or Wasp in this case) claim its helpful to use something opinionated and structured, which makes sense (the tradeoff is the flexibility, of course).We&#x27;ve run some early tests[1] but plan to do a more substantial benchmark next.[1] <a href="https:&#x2F;&#x2F;wasp.sh&#x2F;blog&#x2F;2026&#x2F;03&#x2F;26&#x2F;nextjs-vs-wasp-40-percent-less-tokens-same-app" rel="nofollow">https:&#x2F;&#x2F;wasp.sh&#x2F;blog&#x2F;2026&#x2F;03&#x2F;26&#x2F;nextjs-vs-wasp-40-percent-le...</a>

Building a full-stack app with Wasp, an agent-friendly web framework

Can you elaborate as to why your linked article would suggest nextjs to be a &quot;circus&quot;? If anything, DHH (founder of RoR) and his Looney-Tunes opinions are much closer to a circus sideshow than anything I&#x27;ve seen come out of Vercel.

Vercel April 2026 security incident

I think that&#x27;s more of a NextJs thing than an LLM thing.

Scoring Show HN submissions for AI design patterns

Yea, I mean we&#x27;ve had so many phases.. Bootstrap, Web 2.0, Tailwind, &quot;Material&quot; UI, etc.. with random frameworks, from Rails to NextJS..There&#x27;s always a trend and everyone follows them in Software. Now it&#x27;s AI.. let&#x27;s not pretend cutting corners is anything new in our industry.I guess you can always gloat about your artisan code but people who use Software for business never cared about that to begin with.Plus, wasn&#x27;t the entire philosophy of CS was that &quot;everyone can code&quot; ? Opposing licensing requirements, etc ? Well.. there you have it, code is a commodity now and the barrier to entry is next to none.

Show HN submissions tripled and now mostly share the same vibe-coded look

Vercel did a great job with NextJS and supports quite some OS projects.But even before AI they had some serious struggles according to long time users.With the introduction of the deployment platform NextJS appeared to be having advantages being deployed there.What I can say is that Next has some weird things going on under the hood most senior coders know as “it works, no one knows why, don’t touch these 1.000 LoC here”Build and runtime settings are a mess. Pre building a docker image on a local machine and deploying it on another turned out to be its Achilles Heel. Weird settings prioritize not as documented, different settings in one area lead to changes in default settings somewhere else. ReactJS server components played a role.In other words: I sense that while being incredibly useful there might more to come.It ain’t easy for them, V16 was a rewrite which was API stable. I am not sure about that.

The Vercel breach: OAuth attack exposes risk in platform environment variables

I am a primarily frontend learning fullstack guy. I&#x27;ve been working in this space for about 10 years.I used jQuery, Angular, Angular 2, React. I did JavaScript then TypeScript. I configured freakin Gulp, Grunt, Brunch, Webpack 1 to 5, and now Vite, idk maybe in the future Eggpancake or something. I even had the unfortunate stint on working on configuring Bazel to a frontend monorepo.So I get it, I get the pain. As someone who lives and breathes JS&#x2F;TS, even I myself feel the pain.I can&#x27;t tell how many times I looked at other languages like Go, Ruby, Python, or even newer ones like Elixir, to see if I can just simplify this whole madness with HTMX, Datastar, etc.To be honest. I still haven&#x27;t found one that&#x27;s even incrementally better than the current SPA stack (and no, I don&#x27;t use NextJS or React Server Components). A bunch of the technologies above simply just mix and match with a lot of impedance mismatch.It all boils down to this fact. Modern web application is essentially 2 apps (frontend and backend) that lives in 2 different environment. Each with its own constraints.I accept this fact as the ground zero truth, and just surrender to the current way of building things. That is, you have to build 2 things: SPA frontend client and API backend server. Yes, you have to validate and secure both. Yes, you have to test for both.The end result is much more robust, in error handling, in user experience, in performance (yes), in malleability, in maintenance and extensibility, compared to the server rendered stack with bolt on jQuery&#x2F;HTMX&#x2F;etc.

Modern Front end Complexity: essential or accidental?

# 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