Surjith S M
Surjith's Blog


Surjith's Blog


Get URL Query Params in Next.js using getInitialProps()

Surjith S M's photo
Surjith S M
·Dec 1, 2020·

1 min read

As the title says, this is a simple code snippet to get URL Query params in Next.js using getInitialProps() method.

In Next.js, getInitialProps() have context property where URL query can be fetched using query. See example code below.

URL: http://localhost:3000/?title=Awesome&desc=Content

Page.getInitialProps = async (context) => {
  return { 
    title: context.query.title, 
    desc: context.query.desc 

Now we can get these values in our function like this:

export default function Page({ title, desc }) {
 return (
       Title: {title}
       Desc: {desc}
Share this