How To Deploy a NextJS App To Vercel (EASY AND QUICK!!!)

  Рет қаралды 109,226

PedroTech

PedroTech

Күн бұрын

In this video I will be showing how to deploy a NextJS App to Vercel.
Link: vercel.com/das...
Join our Discord: / discord
🚀 Learn ReactJS By Building 6 Projects: codedamn.com/l...
🐙 GraphQL Course: codedamn.com/l...
Social
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Website: machadopedro.com
Linkedin: / machadop1407
Instagram: / pedro.fmachado_
Github: github.com/mac...
Business Email: pedro@pedrotech.co
🌟 Gear / Hardware I Use and Recommend 🌟
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
💻 amzn.to/42kqFuM 💻 Monitor
🖱️amzn.to/3C0ZhHb 🖱️ Mouse
📷 amzn.to/3OHJvbM 📷 My Camera
🎤 amzn.to/3oxSthj 🎤 My Microphone
⌨️ amzn.to/3oFPpj1 ⌨️ My Microphone
⚡ amzn.to/3MYMnzM ⚡ LED Lights In the Background
Tags:
- ReactJS Tutorial
- ReactJS and MySQL
- NodeJS Tutorial
- API Tutorial
#nextjs #vercel

Пікірлер: 115
@MEGANLEWIS-q2c
@MEGANLEWIS-q2c Ай бұрын
I love the fact that you included the use case of a bug in code/error to show how to deal with that.
@real23lions
@real23lions Жыл бұрын
Omg. I was gonna deploy my nextjs in a day or two. What a coincidence
@mojtabaadineh-y9v
@mojtabaadineh-y9v Жыл бұрын
thank you for showing the error , i just got an error while building and you saved me a lot!
@thalespica
@thalespica Жыл бұрын
Excelente vídeo Pedro parabéns 🎉
@spillttea3195
@spillttea3195 2 ай бұрын
Thank you very much, this was a very quick and concise video, very helpful and straight to the point. Thank you!
@k303k
@k303k Жыл бұрын
Thank you so much for the video Pedro!! Will you make a series on Nodejs when you have free times? Sorrry again if i requested so many times 😅 but your way of teaching is very great and i haven't learn learn Nodejs.That's why.Thankk you for all of your efforts for teaching us a lot Pedro!
@McElitsome
@McElitsome Жыл бұрын
I like this. I dont't know why I always come back to watching your videos though. Something about your presentation is just 👌. Your videos are informative too on the current state of JS techologies too and tips and tricks that make the DX better. Love your latest ' NEXTJS for beginners ' vieo by the way. Its amazing. Stay strong broh
@Fantino502
@Fantino502 6 ай бұрын
Off topic comment - Your hair is cool right now. It remind me Gustavo Kuerten's hair style, a 2000's Brazilian tennis player.
@sanketrajput_co
@sanketrajput_co 6 ай бұрын
Nice step by step explained
@PedroTechnologies
@PedroTechnologies 6 ай бұрын
Thank you so much 🙂
@dreamgoodgaming
@dreamgoodgaming 3 ай бұрын
What makes ls Vercel “not free”? Might need that next video to understand the custom URL 🎉
@Shazzy-dev
@Shazzy-dev Ай бұрын
I have a question : When we fetch data in local machine we use localhost:3000/api, but how can we deploy it on the vercel. It will cause a lot of error, how can we fix that. error: Server is not responding
@chukwuebukastanley9459
@chukwuebukastanley9459 20 күн бұрын
DId you find a solution to this ? I am having the same problem too, my pages are not being generated during build time on vercel
@roloep85
@roloep85 11 ай бұрын
Thanks dude! Feels like you saved my life, even if it was so easy. Not knowing is the worst thing!
@wesleymoraes1478
@wesleymoraes1478 9 ай бұрын
The "any" solution was perfect for me!!! Thank you very much!!!
@leeuwa1
@leeuwa1 Жыл бұрын
Thanks for this video, great. You are one of my favorite coding KZbinr. Is it possible to make a video about security? If you made an app, and there are some security issues with some package (for instance) that are used in that app, what to do to solve it? How to know if there are any security issues with packages for instance? Are there websites who publish such security issues?
@dog4ik
@dog4ik Жыл бұрын
That is insane how vercel f@cked whole community with RSC and everyone is okey with it. Not only RSC slower and will lead to higher bill but also they made self hosting really hard
@afaqahmad8918
@afaqahmad8918 Жыл бұрын
Welcome back ❤
@oluwabukolahezekiah4198
@oluwabukolahezekiah4198 Жыл бұрын
I’m getting Error 500: internal server error message when I deploy to vercel. I have like 8 environment variables like sanity, google auth, stripe, etc please help
@differentfromyou3056
@differentfromyou3056 2 ай бұрын
Thanks! I love you pedro
@centralbiz5974
@centralbiz5974 Жыл бұрын
Hi Pedro.. very helpful as always. Which site would you pick for hosting a node js API for free ? thanks in advance
@captain_finn
@captain_finn 3 ай бұрын
This was awesome! Thank you!!
@fredoliveira5069
@fredoliveira5069 Жыл бұрын
Very helpful Pedro, thanks a lot!
@TamilArasan-k6d
@TamilArasan-k6d 11 ай бұрын
Good Evening Pedro Tech,try to give an idea about ,how can we change branch in production with clear example
@RaviKumar-ko8pf
@RaviKumar-ko8pf 2 ай бұрын
i'm facing problem in interface of my nextjs website , when it is running in localhost it's coming properly but when i'm hosting it is coming differently it seems like css is not imported. pls help
@luizinhogm
@luizinhogm Жыл бұрын
Thanks for sharing this. Hey Pedro, can you share the name of that extension of auto-suggest yarn/npm at your terminal shell?
@SujitLopchan
@SujitLopchan 28 күн бұрын
i got this error: "No Next.js version could be detected in your project. Make sure `"next"` is installed in "dependencies" or "devDependencies" "
@yannry
@yannry Ай бұрын
Bro what about the website is already deployed and you want to make changes? Should I just do the following command: ◽git commit -m "fixed stuff" ◽git push and the deployed website will be updated too?
@yannry
@yannry Ай бұрын
@everyone
@yannry
@yannry Ай бұрын
I found a solution: Let's say you have already successfully deployed the application to Vercel through GitHub. After all the changes that you are satisfied in, open the terminal and prompt the below prompts: ◽git add . ◽git commit -m "updated" ◽git push origin main This works for me and I hope it works for you too. Do you have any better or proper approach for this? Please, let me know.
@sololevelingxx7090
@sololevelingxx7090 22 күн бұрын
Can anyone help. How to view return data on teh website. I have created sort of servey and I am not seeing the return data anywhere?
@AbdelkaderSoudani
@AbdelkaderSoudani 6 ай бұрын
Thank you so much brother!
@onayemi18
@onayemi18 Жыл бұрын
Hello Pedro I've been following you for long time, thank you for your knowledge impact on us. I have a request on how to deploy Nextjs on Cpanel shared hosting for both frontend and backend + prisma . Please.
@albertbravo7364
@albertbravo7364 6 ай бұрын
Awesome video. Thank you
@aydinjoshi
@aydinjoshi 8 ай бұрын
Great vid brother
@shivaramr7042
@shivaramr7042 7 ай бұрын
my module.css file is not reading hence styles are not applied
@jatinderchoudhary6061
@jatinderchoudhary6061 Жыл бұрын
Yes make a proper video how we can host a nextjs website live on internet with a proper domain.
@PedroTechnologies
@PedroTechnologies Жыл бұрын
I can include that in a course or something. But to add a domain you just have to buy and set it on vercel
@jatinderchoudhary6061
@jatinderchoudhary6061 Жыл бұрын
@@PedroTechnologies yes please
@Fantino502
@Fantino502 6 ай бұрын
Thank you for the video, by the way.
@0Ipsita0
@0Ipsita0 3 ай бұрын
Hi @Pedro how can we change the branch for deployment? Suppose I want to deploy my development branch instead main branch.
@tomasburian6550
@tomasburian6550 8 ай бұрын
Skipping the env variables was a mistake. If we don't know how to put them in properly, some features won't work, like auth etc.
@osamaayub405
@osamaayub405 10 күн бұрын
Application error: a client-side exception has occurred (see the browser console for more information). while deploying next js app on vercel I'm getting this error while deploying the next js app how to remove this error anyone
@DEBUGENTITY
@DEBUGENTITY 6 ай бұрын
can we deploy the next project without github means i want to manually deploy it on vercel.
@bribri-dy1te
@bribri-dy1te 4 ай бұрын
does it have a backend and database connected to it? or its just a frontend stuff? ty
@ekanotes
@ekanotes 6 ай бұрын
Getting an error while doing "Command "npm run build" exited with 1"......please if someone can help.
@Pressurehandler228
@Pressurehandler228 8 ай бұрын
when i done deploy it, why does it show the get started page, not the one that i made before?
@abdelkaderlounis6537
@abdelkaderlounis6537 Жыл бұрын
Instead of using external api url jsonplacelholder like you did, How to configure internal api call url before deploying
@codingtaptanh8674
@codingtaptanh8674 4 ай бұрын
really helpful
@sebastiannietor9724
@sebastiannietor9724 Жыл бұрын
Is there a way to know if there are mistakes in our typescript code without having open the file?And without executing the build. Because i use Flutter and there even if you close the file, vscode always is warning you if you have errors, but i would like to have the same in typescript
@sumitsahu8657
@sumitsahu8657 8 ай бұрын
Is there any way to deploy a selected/not default branch?
@c0dingwithchris
@c0dingwithchris 8 ай бұрын
I have a quick question. What if I don't want my site to be publicly accessible? I.E I want to keep it a private repo on github? Is there a way to do this or no?
@DEBUGENTITY
@DEBUGENTITY Жыл бұрын
it giving me error in reactservercomponents and its not deploying
@shenawy343
@shenawy343 11 ай бұрын
the project has been deployed but the images didn't appear and i don't know why
@genztechman
@genztechman 3 ай бұрын
Thank You
@norbufoldey3670
@norbufoldey3670 11 ай бұрын
How old are you and how Did you learn all these stuff
@KITOAfrica
@KITOAfrica Жыл бұрын
please how do i deploy my wordpress website to vercel app and post links on facebook ?
@eobodai
@eobodai 6 ай бұрын
Thanks
@Maifumei
@Maifumei Жыл бұрын
Hello sir, my nextjs has been deployed to Vercel, but I cannot open images in Romania, and my location in China or Singapore can open them. Is there any way to set the region?
@thenicholashernandez
@thenicholashernandez Жыл бұрын
what about baseurl you did not show it how
@abhishekparmar162
@abhishekparmar162 Жыл бұрын
Hindi subtitle❤
@Don_Verissimo
@Don_Verissimo Жыл бұрын
i get this error ;( Warning: Could not identify Next.js version, ensure it is defined as a project dependency. Error: No Next.js version could be detected in your project. Make sure `"next"` is installed in "dependencies" or "devDependencies"
@beardo_fit3160
@beardo_fit3160 Ай бұрын
thank youuuuuuuuuuuuuu
@MT4d616e
@MT4d616e Жыл бұрын
simple and easy
@codemelon2698
@codemelon2698 Жыл бұрын
I have a problem my app contains a lot of images it's still static but I can't use a cdn it's too late so how can I push 2.16 gb to github
@kunalss9314
@kunalss9314 Жыл бұрын
delete it
@iqrashahzadi1721
@iqrashahzadi1721 5 ай бұрын
helpful
@franklinmayoyo
@franklinmayoyo 7 ай бұрын
I thought you'll use the cli
@anthonygesora2517
@anthonygesora2517 Жыл бұрын
Woow🎉🎉
@ManulBandara
@ManulBandara 11 күн бұрын
🔥🔥
@ruizxzx
@ruizxzx Жыл бұрын
u look better without facial hairs!
@freedom6984
@freedom6984 Жыл бұрын
Who cares
@andregn4483
@andregn4483 6 ай бұрын
Your name suggests you are Brazilian. But your fluency suggests otherwise.
@PedroTechnologies
@PedroTechnologies 6 ай бұрын
Lol I am Brazilian :) I had the privilege of studying in a international school in Salvador, Bahia until I was 18.
@edubox9816
@edubox9816 4 ай бұрын
​@@PedroTechnologies Que daora mano!!!!!! Eu notei que seu nome era Brasileiro também, e o mais curioso é que vc tbm mora aqui em Vancouver!!! Que bacana encontrar vizinhos de nascença aqui na mesma cidade que eu!! Abraços Pedro, espero um dia te encontrar em algum evento de programação aqui em vancouver.
@hamzaking127
@hamzaking127 Жыл бұрын
in firebase
@Riflijones01
@Riflijones01 3 ай бұрын
Would have been even more helpful without yout head out of the way
@SakibSarker-op9sq
@SakibSarker-op9sq 3 ай бұрын
Imparsive 🤍🤍
@praiseabu591
@praiseabu591 10 ай бұрын
Thank you so much for this. It was extremely helpful. I pray you come to the knowledge of truth and Christ. God bless you!
@kiranoffice4445
@kiranoffice4445 5 ай бұрын
ThankYou
@KAMIL-jc8nn
@KAMIL-jc8nn 6 ай бұрын
You helped me soooo much already, thank you. Btw you didnt need to show the error example but you did it anyway. I just love you man🤣
@MuhammadAli-tw9ht
@MuhammadAli-tw9ht Жыл бұрын
Very helpful ! Appreciate your work always. 🙂 I think it would be great video if you share how you learn new stuff and whats your overall process of learning new technologies etc. Thanks
@MuhammadAmir-nv4yk
@MuhammadAmir-nv4yk Жыл бұрын
Amazing learning path for me...keep it up bro
@lukas.webdev
@lukas.webdev Жыл бұрын
Very helpful and straight to the point. Love it! 😉🔥
@alifhasanshahOfficial
@alifhasanshahOfficial Жыл бұрын
What if i don't want to deploy from github? How to deploy react app using vercel cli? .
@viniclunc8553
@viniclunc8553 Жыл бұрын
Easy and quick, as my job journeys 😢😔
@benoit4148
@benoit4148 4 ай бұрын
I have the problem ,the data are being fetched on vercel, even if I call the next js api endpoint on postman. i can send the data but i can not fetch unless i rebuild the app
@SomaSrivastava-wv3xi
@SomaSrivastava-wv3xi 5 ай бұрын
what if i already have a deployment and want to update the website? will i have to deply again and get a new link or is there some other process
@selimmondal5942
@selimmondal5942 2 ай бұрын
helpful vedio thanks.....bro
@sandiplayek
@sandiplayek 7 ай бұрын
I have two brunches developement for staging and production for production. How do I choose them please reply
@manankoyawala5337
@manankoyawala5337 10 ай бұрын
when i access that url from the postman it gives me authentication required even though i used authorization key also still can't access , plz give me the solution
@gadhager
@gadhager 10 ай бұрын
da mas problemas que netlify...
@socialguro
@socialguro 11 күн бұрын
thanks man really helped me❤❤
@scotly_emi
@scotly_emi Жыл бұрын
The video was helpful what about connect next js to MySQL database how will I go around that or please can you make a tutorial on that please thanks
@abhijaysaraswat2833
@abhijaysaraswat2833 7 ай бұрын
Where is it deploying do we have to manually specify a server etc and do we have to write the script for deployment or it creates the script on its own according to the application?
@jeevanalexen
@jeevanalexen Жыл бұрын
Hey, how will connect it with our django backend. What will be the process for that?
@AlineGrianti
@AlineGrianti 11 ай бұрын
Ola Pedro and thank you for your videos! when I try to deploy it goes out of memory because of too many static pages to generate.. you have some suggestion to fix this issue?
@100xDevPiyush
@100xDevPiyush 29 күн бұрын
Too many ads, i this video
@tanphatnguyen9047
@tanphatnguyen9047 7 ай бұрын
i cant sign up new account on Vercel
@joshiosimoe7459
@joshiosimoe7459 5 ай бұрын
WE LUV BOBAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
@omarfaruktotul1243
@omarfaruktotul1243 2 ай бұрын
Very Quick Help🤩
@ayeshaejaz1627
@ayeshaejaz1627 Ай бұрын
this was a really easy video to follow along. thank you !
@syedahafsadeveloper
@syedahafsadeveloper 7 ай бұрын
amaaaaaaaaaaaaaaaaaaaazing video i have no words
@whysumancode
@whysumancode 9 ай бұрын
Wow i enjoyed thanks myaan🚀🚀
@mr_phamtastic
@mr_phamtastic Жыл бұрын
Awesome tutorial! Nice and easy
@司马-x9x
@司马-x9x Жыл бұрын
thank you for sharing
@ashutosh__018
@ashutosh__018 9 ай бұрын
great video!
@chesterxp508
@chesterxp508 Жыл бұрын
GoodJob!
@traconisek
@traconisek 11 ай бұрын
Not helpful. Vercel is throwing random rrError: No Next.js version could be detected in your project. Make sure `"next"` is installed in "dependencies" or "devDependencies"
@PedroTechnologies
@PedroTechnologies 11 ай бұрын
Are you sure you are trying to deploy a nextjs project?
@mireyamarte7974
@mireyamarte7974 4 ай бұрын
10 common mistakes with the Next.js App Router
20:37
Vercel
Рет қаралды 215 М.
The BEST way to host Next.js websites
17:37
ByteGrad
Рет қаралды 47 М.
Amazing Parenting Hacks! 👶✨ #ParentingTips #LifeHacks
00:18
Snack Chat
Рет қаралды 22 МЛН
Миллионер | 1 - серия
34:31
Million Show
Рет қаралды 1,7 МЛН
These coding projects give you an unfair advantage
8:13
Jason Goodison
Рет қаралды 1 МЛН
How to deploy a NextJS app on Digital Ocean instead of Vercel
20:47
Coding with Robby
Рет қаралды 10 М.
Host GitHub Backend Project On  Vercel 🔥 | How to Host Backend App On  Production
6:48
𝕰𝖆𝖘𝖊𝕷𝖔𝖌𝖎𝖈
Рет қаралды 141
React Like a Pro: React Best Practices
9:55
PedroTech
Рет қаралды 12 М.
Deploy your Next.js app to a VPS (EASY!)
15:38
ByteGrad
Рет қаралды 35 М.
the most important Next.js features to learn (in 8 minutes)
8:26
Web Dev Cody
Рет қаралды 46 М.
State Managers Are Making Your Code Worse In React
13:33
Web Dev Simplified
Рет қаралды 186 М.
Vercel Product Walkthrough
21:41
Vercel
Рет қаралды 55 М.
Amazing Parenting Hacks! 👶✨ #ParentingTips #LifeHacks
00:18
Snack Chat
Рет қаралды 22 МЛН