Next.js Weekly Recap #2: App Router, Background Functions, YakGPT, Vercel KV
Tags: nextjs, webdev, react, javascript
Published: 2023-04-10 21:17:10

![Next.js App Router](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pvkkk2suxu7uzflw9xz6.png)
### 🎥 [Next.js App Router: Routing, Data Fetching, Caching](https://www.youtube.com/watch?v=gSSsZReIFRk&ab_channel=Vercel)

As the new app directory in Next.js nears full stability, it's essential to stay up-to-date with the latest concepts and foundations. Join Lee Robinson as he provides a comprehensive overview of how to leverage the power of the Next.js app router in your web development projects.


### 🐦 [5 benefits of using the App Router](https://twitter.com/rauchg/status/1642915079837585409)

Vercel’s CEO demonstrates why switching to the new App Router is a Win-Win for you and your customers


### [Long-running background functions on Vercel](https://www.inngest.com/blog/vercel-long-running-background-functions)

Learn how to run long-running background tasks on Vercel without hitting the 10-60s HTTP timeouts. Spoiler: This is done by breaking up the job into small individual steps and invoking each part in the correct order through Inngest.

---

## 📙 Tutorials, Articles & Opinion

### [An Introduction to Solana Pay and how to Integrate it into Your Next.js App](https://blog.avneesh.tech/what-is-solana-pay-and-how-to-use-it-in-your-nextjs-app)

Some content for Web3 fans. This guide covers the basics of using Solana Pay, including what it is, when to use it, and how to integrate it into a Next.js app to enable users to buy tokens by scanning a QR code.

### [Why your Not Found UI is not rendering on NextJS 13](https://codethenporrada.xyz/why-your-not-found-ui-is-not-rendering-on-nextjs-13)

Quick tip on how to correctly use the `notFound` function that comes with the new App Router

### [How to Deploy a Next.js Application using Docker on AWS](https://www.benoitpaul.com/blog/nextjs/nextjs-hosting-docker-aws/)

This guide covers the process of containerizing a Next.js application, pushing the Docker image to ECR, and deploying it on AWS.

### [🐦 Type Safe Routes in Next.js](https://twitter.com/shuding_/status/1641854009982976026)

Just a reminder that you can enable this experimental feature in Next.js to statically type links in the app directory and prevent typos or other errors when using `next/link`.

### [🐦 Automatic restarts when changing `next.config.js`](https://twitter.com/leeerob/status/1643847173019439104)

Currently only on the canary branch but will soon become stable

### [Instrumentation Hook in Next.js](https://nextjs.org/docs/advanced-features/instrumentation)

This one is also experimental 🧪. The instrumentation hook allows you to run code on each cold boot of your serverless function. Use it to initialize observability tools in your Next.js apps

---

## 📦 Packages / Tools / Repos

![npm-copilot](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5jbgvdo0q9x0kmd699c8.png)

### [npm-copilot](https://github.com/whoiskatrin/npm-copilot)

Imagine MS Clippy for Next.js inside the terminal. npm-copilot is basically that – a CLI tool that listens to your Next.js logs and suggests a fix in the terminal right after detection.

### [YakGPT](https://yakgpt.vercel.app/)

Can’t have a newsletter issue without at least one AI tool. But you’ve to try this! YakGPT is a fully open source, locally running ChatGPT UI build on top of Next.js + it has mic integration – so no more typing!

### [defineAppRouteHandler.ts](https://gist.github.com/NuroDev/a97966114e8771f903714c2e39a9ec46)

You can use this little helper function to define route handlers in your Next.js 13's app directory

### [Zodios](https://www.zodios.org/)

This is like tRPC but for REST APIs. Get an end-to-end typesafe developer experience in your Next.js apps

### [Update user session in NextAuth](https://next-auth.js.org/getting-started/client#updating-the-session)

NextAuth got a small feature drop, now you can update the session programmatically! 

---

## 🌈 Related


![Improved Node.js compatibility for Edge Middleware and Edge Functions](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t9iod36hu0gq9ooyerfm.png)



### [Improved Node.js compatibility for Edge Middleware and Edge Functions](https://vercel.com/changelog/improved-node-js-compatibility-for-edge-middleware-and-edge-functions)

Buffers, AsyncLocalStorage, EventEmitter and some other Node.js primitives can now be used in the Edge runtime. This is big news because a lot of existing libraries didn’t run on the Edge runtime without using less performat polyfill versions of these features.

### 🐦 [Vercel KV - Global low latency store with per request pricing](https://twitter.com/wongmjane/status/1643289044653330433)

Seems like Vercel is working on a fully integrated KV database solution based on Upstash Redis.

### [Learning React from two Angles in 2023](https://www.robinwieruch.de/learning-react/)

Robin compares the library and framework approach to learning React in 2023, with a focus on the new React documentation's recommendation to use Next.js as a fully integrated framework.

---

If you want to get these kind of news in your inbox every Thursday, subscribe to the newsletter:

📨 https://nextjsweekly.com/