A Next.js snippet and you should check out this tool šŸ”„

Welcome to the Frontend Snacks Newsletter. šŸŽ‰

Today, we will discuss our favourite topic: Next.js 13 and review a snippet about fetching static data.

With Next.js 13's experimental changes, how we fetch data will change significantly. Today's snippet shows you how you can fetch data statically in Next.js 13. In Next.js 12, we can bring data using getStaticProps if you can pre-build the page and your page is entirely static.

But with Next.js 13, we no longer need to use `getStaticProps` to fetch data statically. We can directly do that using `fetch.`

Fetch API now takes a property called { cache: 'no store' } as a 2nd parameter to the fetch function, allowing you to do this.

In the above snippet, we are fetching data from the Pokemon API, and since `fetch` returns a promise, we are calling `await` so we can wait for the promise to resolve. You don't need to provide this property explicitly, as it's there by default for us.

React team also released `use` so you don't have to use await anymore. You can take a look at the RFC here.ā€‹

Latest Frontend Gossip/News šŸ¤«

ICYMI, Remix is bought by Shopify now. You can check out the news here. This is exciting for the Remix team.

Remix vs Next

Remix is similar to Next.js, allowing you to do what Next.js does. You should check out this great article to compare Remix and Next.js.

We have a new Router library now

At Jamstack Conf, Tanner Linsley (creator of React Query) released a new router called "TanStack."

We all know that not many are a big fan of Next.js file-based router, so this router is fully type-safe, framework agnostic (except Next.js), and you can create routes by using the `createRoute` function and its children using `createRoute({ path: '/blog' }).createChildren((createRoute)`. Well, more on this next week!

Snack for Thought šŸæ

We are building so many different frameworks to make our site faster and moving the responsibility from the client to the server, but if you think about it, isn't that precisely what ASP.net was for? šŸ™ƒ We are going back to where we started.

Frontend Developers Toolbox šŸ§°

That's all for today!

A Frontend Newsletter that you'll love! šŸ’–