Discussion on "Next.js 13 Route Handlers with Typescript"

Mary Etokwudo · 2023-06-18T16:04:51.096Z

Next.js, the popular React framework, recently released Version 13 with several exciting features and improvements. One of the key changes in this version is how API routing is handled. For newcomers and developers transitioning from Version 12, this...

What if I want to use env variables, will I define it differently from the frontend?

Hi Grace! When you add the prefix NEXT_PUBLIC_ to your env variables, Next.js will make it available on the browser. For example:

NEXT_PUBLIC_GOOGLE_ANALYTICS_ID='your_google_analytics_id'

Note that it is not advisable to expose sensitive variables to the browser. Let me know if this works or not :)

Also if I install a dependency, how will next.js know that the dependency is just for the frontend and not the backend?

I think that by default, Next.js will try to make all the dependencies available on the frontend except those that need to run on a node environment. Check this Q&A on server-side dependencies as well.

What if I want to install dependencies and use them in side the route handler?

You can do that the way we used next/server in the first code snippet.

Thank you so much 💯. Exactly what I was looking for

You are welcome, Higenyi. Thanks for the comment.

Search Hashnode

Next.js 13 Route Handlers with Typescript

Responses4