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

Рет қаралды 32,495

Жыл бұрын

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

Пікірлер: 43

@AlleinArk 10 ай бұрын

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

@imAskja 8 ай бұрын

This is incredible!

@Sumi-ql3wj 3 ай бұрын

Thanks a lot brother this really help me.

@KJPrince 6 ай бұрын

Great work thanks for sharing

@bilegtsdf5776 Жыл бұрын

thanks bro love it ❤

@hassaantahir3861 Жыл бұрын

Great video brother.. ✨

@mohammadmalek5042 11 ай бұрын

Thanks ❤

@SimonEdmund Жыл бұрын

Brother, thanks a lot!

@shadmerhi Жыл бұрын

You're welcome!

@salmansheriff8243 Жыл бұрын

super useful

@shadmerhi Жыл бұрын

Glad you found it useful! Thanks for watching

@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.

@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

@sweattypalms_0183 2 ай бұрын

why use nextjs if everything is a client sided component?

@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

@harrykara4121 Жыл бұрын

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

@abdulrafay1951 Жыл бұрын

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

@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 8 ай бұрын

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. 4 ай бұрын

I came here to say the same

@psyferinc.3573 5 ай бұрын

merhi from where in lebanon ?

@shadmerhi 5 ай бұрын

My dad is from Mdoukha! Are you from there?

@psyferinc.3573 5 ай бұрын

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

@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

@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 :)

@maverick456-33 Жыл бұрын

github link has been broken

@shadmerhi Жыл бұрын

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

@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 } ); } } ~~~