'use client' import { useSearchParams } from 'next/navigation' export default function SearchBar() { const searchParams = useSearchParams() const search = searchParams.get('search') // URL -> `/dashboard?search=my-project` // `search` -> 'my-project' return <>Search: {search}</> }Consider the following page: pages/post/[pid].js: import { useRouter } from 'next/router' const Post = () => { const router = useRouter() const { pid } = router.query return <p>Post: {pid}</p> } export default Post https://stackoverflow.com/questions/43862600/how-can-i-get-query-string-parameters-from-the-url-in-next-jsimport { useRouter } from 'next/router' const Post = () => { const router = useRouter() const { pid } = router.query return <p>Post: {pid}</p> } export default Post// For example for URL: {__APP_URL__}/api/device/10001?q=hello // The API route pages/api/device/[device_id].js has the following code: export default function handler(req, res) { res.status(200).json(req.query) // {"q":"hello","device_id":"10001"} }