Build a Search Bar with Next.js and Prisma (Search API endpoint)

In this video, we'll cover how to build full-stack search functionality into your Next.js application using Prisma. We'll look at how to add search query params to the URL, and use the search params to make a GET request to a /search API endpoint.
❤️ Tips & Donations Link: paypal.me/shadeemerhi?country...
( Thank you very much for your support!)
Code: github.com/shadeemerhi/nextjs... (please see the README for starter instructions)
Discord Server: / discord

[@ciscoramonsanchez5192]

I don't like to handle myself the encoding and decoding of query from url. Instead I use the native api **URLSearchParams** . It parse, encode, decode has a toString method that convert the value on it into search params encoded.

[@AlleinArk]

clean, good tutorial, and easy to implement
deserve like + subscribe!!

[@imAskja]

This is incredible!

[@hassaantahir3861]

Great video brother.. ✨

[@bilegtsdf5776]

thanks bro love it ❤

[@KJPrince]

Great work thanks for sharing

[@mackenandsouza3311]

Hi I've been watching your reddit tutorial and have encountered an issue with the useCreation with Email and password ,i tried joining the discord but it wasn't letting me in ,could u please help me

[@Sumi-ql3wj]

Thanks a lot brother this really help me.

[@SimonEdmund]

Brother, thanks a lot!

[@shadmerhi]

You're welcome!

[@salmansheriff8243]

super useful

[@shadmerhi]

Glad you found it useful! Thanks for watching

[@mohammadmalek5042]

Thanks ❤

[@sweattypalms_0183]

why use nextjs if everything is a client sided component?

[@harrykara4121]

Is it possible to use SQLite instead of PostgreSQL in this project?

[@abdulrafay1951]

Yes, you have to change provider = "sqlite" in prisma schema.

[@TomoDevelops]

I was doing the exact same thing before watching this vid but for some reason when I change the query and re-search the page doesn't re-render like yours....
My code looks exactly like yours and I can't seem to figure out what's wrong...

[@shadmerhi]

Hmmm that's interesting. If you're still stuck, feel free to join my Discord server and we can chat about it further there! discord.gg/kFVVYbcy7D

[@mediacreatif]

is it compatible with next@latest ? 13.4.4 ?

[@shadmerhi]

Yes, you would just create a route.ts file in your app router

[@vaquarshaikh9790]

can you make an integraion video of this in graphql ?

[@shadmerhi]

I will consider making a Next w/ GraphQL video! Thank you for the suggestion 😁

[@prashlovessamosa]

@@shadmerhi thanks i will wait for it.

[@MO-432]

SQ func: 10:13

[@Svish_]

Great video. Less great placement of your face, on top of the console 😛

[@shadmerhi]

Thanks for watching! Yeah haha I now know not to place my face there 🙈

[@crickey.]

I came here to say the same

[@nirbhayjain2186]

what's your theme name?

[@shadmerhi]

GitHub theme! It's a VSCode extension:
Name: GitHub Theme
VS Marketplace Link: marketplace.visualstudio.com/items?itemName=GitHub.github-vscode-theme

[@nirbhayjain2186]

@@shadmerhi thnxz

[@maverick456-33]

github link has been broken

[@shadmerhi]

My apologies, I just fixed it! Here it is: github.com/shadeemerhi/nextjs-fullstack-search

[@andretavares5602]

Camera is in front of the console, other than that great video 👍

[@shadmerhi]

Thank you for watching and for the feedback! Will keep this in mind for future videos :)

[@psyferinc.3573]

merhi from where in lebanon ?

[@shadmerhi]

My dad is from Mdoukha! Are you from there?

[@psyferinc.3573]

kabr chmoun my guy. mom is a merhi.@@shadmerhi

[@hassaantahir3861]

Bro can you build something (a website) on top of AI like using their API.
You can use any AI tool or you can combine multiple to build a new product.
Or can you make a video of 4-5 SaaS ideas build using Apis of multiple AI .. plzzz
Thanks in advance ✨

[@MJ46.91]

I just wanted to know what the endpoint might look like instead I watched a dude making a frontend tutorial, adding tons of complexity, this qualifies as a click bait, unccol

[@shadmerhi]

Lmao

[@personal1872]

i am trying to send fetch("/api/users/me") with access_token as header but when i console.log the logged in user is null
~~~
import { nextAuthOptions } from "@/app/api/auth/[...nextauth]/route";
import { NextRequest, NextResponse } from "next/server";
import { getServerSession } from "next-auth";
export async function GET(req: NextRequest) {
try {
const session = await getServerSession(nextAuthOptions);
console.log({ session: session });
return NextResponse.json(
{ status: 200, data: { user: "test" } },
{ status: 200 }
);
} catch (error: any) {
return NextResponse.json(
{ status: 500, error: error.message },
{ status: 500 }
);
}
}
~~~