Тёмный

Full Stack Ecommerce Store With Admin Dashboard From Scratch - Next.js, Prisma, Stripe, Tailwind 

Web Dev Simplified
Подписаться 1,6 млн
Просмотров 225 тыс.
50% 1

Опубликовано:

 

27 сен 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 363   
@WebDevSimplified
@WebDevSimplified 6 месяцев назад
Join the Slack Developer Program for exclusive access to beta features, sandboxes, resources, and more: api.slack.com/developer-program?AMER_US_EN_Q1_SLKAW_Developer_Program_Web_Dev_Simplified&
@oiqowioqqoiqoiqoiqoioiq
@oiqowioqqoiqoiqoiqoioiq 5 месяцев назад
its free?
@Slackhq
@Slackhq 5 месяцев назад
@@oiqowioqqoiqoiqoiqoioiq It sure is!
@wall-v
@wall-v Месяц назад
How come, when you are styling the menus and they are already styled in dashboard page? I am trying to style the nav component here and i am still stuck with the style. Thanks for replying...
@violinsheetmusicblog
@violinsheetmusicblog 5 месяцев назад
This video omits a lot of details for those just starting out, but it's great for those who already have worked with most of these tools in the past. Thanks!
@bencipherx
@bencipherx 3 месяца назад
Thank you for your feedback which I find useful. Please can you highlight what he omitted so I can review them or suggest an alternative prerequisite video. I have never seen or used next before but i learnt its like Django which I am very used to. I also have experience with ExprezsJS and React
@DaniTochi
@DaniTochi 3 месяца назад
Hi! What do you recommend? This is the first time I'm doing the project. Thanks 😅
@anhqui19822011
@anhqui19822011 6 месяцев назад
I've been looking for this project for a long time. Thank Kyle for awesome project!
@ahmedyasser5058
@ahmedyasser5058 6 месяцев назад
We've been waiting for something like this so long bro thanks for everything you do on the channel ♥
@lenaggar
@lenaggar 6 месяцев назад
I really admire your speed from thought to implementation and iteratively moving forward while not spending too much time considering different options in each crossroads you hit I usually get stuck on these mini decisions along the way while working. Perfectionism harms my velocity quite a lot! Maybe you can talk about how you manage the need for perfectionism! (if you do face it of course 😅)
@themks8452
@themks8452 6 месяцев назад
this is going to be the best video on this channel
@anand_dudi
@anand_dudi 5 месяцев назад
This is most useful tutorial on nextjs i have ever seen as senior react node developer
@Jaco_codeeza
@Jaco_codeeza 4 месяца назад
Thank you Kyle. Much Appreciated. I'm an hour into the tutorial and i must say, "I'm learning some real full stack here".
@EcomCarl
@EcomCarl 5 месяцев назад
Incredible tutorial on building an efficient eCommerce site with minimal code! Leveraging tools like Next.js and Prisma not only streamlines development but also enhances scalability and maintenance 👍.
@shadrackodielo
@shadrackodielo 3 месяца назад
ai
@haikchalian
@haikchalian Месяц назад
Thanks Kyle, you covered everything need for a full site. You even covered sending emails. I can build on everything learned here. Much appreciated.
@the__jive
@the__jive 6 месяцев назад
Thank you very much Kyle! I learned a lot from this video, ❤.
@WebDevSimplified
@WebDevSimplified 6 месяцев назад
I'm glad I could help!
@AliRaza-gr8to
@AliRaza-gr8to 3 месяца назад
Wow, wow wow excellect. Mater of Everything, Next, React, Typescript, Tailwind, Css, Sass, ..... and with such a Speed. God Bless You. Very Informative..
@madanmalhotra
@madanmalhotra 4 дня назад
learn a lot, this guy is just next level coder.
@whitewalker19
@whitewalker19 6 месяцев назад
man mad respect..this is what I was searching for
@Aerotk
@Aerotk 2 месяца назад
Took few days to complete it but worth trying it. tysm ♥
@7doors847
@7doors847 6 месяцев назад
This looks like a fun project. Looking forward to it. Thanks!
@anirudhnomula2942
@anirudhnomula2942 5 месяцев назад
wow that was so fast for me , guess im a noob afterall , right now studied and coded almos till 43 min , will take this forward tomorrow , thanks for this video , wanted to start my own ecom site
@anirudhnomula2942
@anirudhnomula2942 5 месяцев назад
checking in again today , completed till 51:33 , was trying to load till 1:20:00 but it was way too much for me so instead tried coding and ended till 51 min , thank you so much for packing a lot of stuff , i have a newfound respect for u
@anirudhnomula2942
@anirudhnomula2942 5 месяцев назад
i tried a lot to complete this in one go from 51 min but ending giving up at 2hr:15min~:, atleast this i coded till that point , alot of things seem more clear when we code it out , thanks again for all ur effort , u really made it simple, true to ur word , gn
@anirudhnomula2942
@anirudhnomula2942 4 месяца назад
Ok today its finally done , i gave up to code along when u started web hooks 🙃 but scanned fro there till the end as it was mostly react email and a bit of same which was done with admin products page but finally i completed this whole video feels so nice to be able to check this of the list
@anirudhnomula2942
@anirudhnomula2942 4 месяца назад
So it took me 10 days to actually complete it 😂 and u did it in 4~5 hrs 😮 glad i found this video learnt a lot from this video , really appreciate it from bottom of my heart
@Habesha_Today
@Habesha_Today 5 месяцев назад
Dev please do more videos on Next-js and TypeScript especially on Ecommerce-Site and other complex projects
@NinoVid.
@NinoVid. 2 месяца назад
Bro, you are BEAST !
@joelmason6818
@joelmason6818 6 месяцев назад
Something I would greatly appreciate is that you create another version of this for solid items shipped with a popular shipping calculator included. Thus would be cool and would help plenty of people selling actual items vs. digital downloads. Thx in advance!
@thabosiphiwemngoma1859
@thabosiphiwemngoma1859 6 месяцев назад
About time. Thank you for this. Now you should try other backends like python. Your breakdowns are amazing
@AlexanderBelov-y8o
@AlexanderBelov-y8o 6 месяцев назад
You are one of the best on RU-vid
@pablom8854
@pablom8854 6 месяцев назад
Some relevant timestamps for me 5:15 price in cents 9:17 restrict 9:40 download verification 12:30 shad config
@Developer-KamranIqbal
@Developer-KamranIqbal 21 день назад
Great course, Learned a lot from this course.
@crazydevil3090
@crazydevil3090 20 дней назад
did u finish the project?
@Developer-KamranIqbal
@Developer-KamranIqbal 20 дней назад
@@crazydevil3090 yes
@Developer-KamranIqbal
@Developer-KamranIqbal 15 дней назад
@@crazydevil3090 yes
@sigmaepsilon4711
@sigmaepsilon4711 Месяц назад
most amazing thing, thank you Web Dev Simplified. You deserve that good hair !
@AlexMarcoDAngelo
@AlexMarcoDAngelo 3 месяца назад
EXCELLENT! 👍 I wish there was a shopping cart so customers can purchase multiple products, but of course, you intended this to be basic! 😊
@justinhoward6384
@justinhoward6384 6 месяцев назад
Kyle drops another hit
@andrewtcoder
@andrewtcoder 6 месяцев назад
Amazing video!!! Thank you so much! You're the best teacher!!!!
@MrCuteguylol
@MrCuteguylol 6 месяцев назад
Thank GOD. I have a Next JS project in my job and your video came up. Damn.
@artemonstrick
@artemonstrick 6 месяцев назад
WOW ALMOST 4 HOURS OF MY FAVORITE WOBBLY HEAD TALKING! WOHOOOOOOOO!1111
@RavindraSingh-lp9pl
@RavindraSingh-lp9pl 2 месяца назад
We absolutely love this Kyle
@codingwithteedeb
@codingwithteedeb 6 месяцев назад
You might think Kyle is ELISA with his robotic head movement and fast-pace speech
@oiqowioqqoiqoiqoiqoioiq
@oiqowioqqoiqoiqoiqoioiq 5 месяцев назад
finished this. You should extend this sample with user login, purchases and cart. PEACE
@jrom_ai
@jrom_ai 5 месяцев назад
AMAZING tutorial!!!
@nasa-eemadadam2213
@nasa-eemadadam2213 5 месяцев назад
Awesome tutorial 😁 need more nextjs project 😊😊😊
@gachecem_yt
@gachecem_yt Месяц назад
Would be really good if the my orders would be on a login, so the person could have their information such as addresses, see what he previous bought and his orders which are on the way home, etc.
@mega_play1237
@mega_play1237 2 месяца назад
i have problems to deploy the project to vercel
@hoanghailethe1734
@hoanghailethe1734 19 дней назад
thank you so much, learned a ton
@ryanhotrod5416
@ryanhotrod5416 Месяц назад
Awesome 👍😎 really insightful
@adyreacts5976
@adyreacts5976 4 месяца назад
Appreciate your granularity, you did not even skip a damn skeleton. Thanks Kyle. A host of topics covered
@lostinthenarrativve
@lostinthenarrativve 6 месяцев назад
Fuuuuck me this is what we've all been waiting for in years
@YT-su2sq
@YT-su2sq 6 месяцев назад
I would love to.
@alecdorasandler6690
@alecdorasandler6690 5 месяцев назад
Email service bookmark 2:57:00
@savindupasintha
@savindupasintha 5 месяцев назад
Brother I need to know some thing. I am currently in singapore and no time to do self learning things. 1. can you tell use to your daily life how going ? 2. How you manage your time , also you doing job ?
@christophermarshall3702
@christophermarshall3702 4 месяца назад
For anyone attempting this from today onwards there seems to be an issue wen referring to the File in the _actions/product file. If you get an error saying File not defined simply change the zod.instanceof(File to zod.instanceof(Blob anf everythign will start working
@henriknasmark
@henriknasmark 2 месяца назад
To bad there wasn't a cart and multiple products to orders. Nice work anyway :-)
@suntienda5749
@suntienda5749 4 месяца назад
I need to do a project for school, and it's important to complete it because the teacher got a real client. The client wants a sales page, but nobody knows how to program a web page.
@telur_ramen
@telur_ramen 5 месяцев назад
thank you so much for this amazing course!
@404-not-found-service
@404-not-found-service 6 месяцев назад
Thank you very much for the video, this type of content is appreciated.
@wall-v
@wall-v Месяц назад
WebDevSimplified How come, when you are styling the menus and they are already styled in dashboard page? I am trying to style the menu here and i am still stuck with the style. Thanks for replying...
@NoIngNames
@NoIngNames 5 месяцев назад
So, am I missing something or upon successful purchase no record is made in Order table of the database?
@jmgutierrez962
@jmgutierrez962 6 месяцев назад
Thank You sir..This is really really helpful..
@henriknasmark
@henriknasmark Месяц назад
There is a problem trying to deploy the stripe-success page on Vercel because we can't it takes in dynamic data and need to be created at request time. Also, seems to be a problem with stripe when you deploy it to production as well.
@asyncrohan
@asyncrohan 6 месяцев назад
Hey kyle thanks for this one , can you guide us how to improve our css as a full stack dev because we focus on logic more than ui
@PartneredAdmin
@PartneredAdmin Месяц назад
Hi Can you create this same content with data fetching from external APIs? Thank would be awesome. Thanks!
@raphauy
@raphauy 5 месяцев назад
Awesome!!! Thank you very much!!!
@MaxPython-x6w
@MaxPython-x6w Месяц назад
Can you make a this video with paypal payment gateway or any other method except stripe because stripe doesn't work on all country 😢
@timmunkhtur219
@timmunkhtur219 22 дня назад
Can't deploy to vercel because admin/products/download/route.ts has an invalid export. "Promise" is not a valid GET return type: Expected "void | Response | Promise", got "Promise". Expected "Promise", got "Promise". Expected "void | Response", got "NextResponse | { status: number; }". Expected "void | Response", got "{ status: number; }".
@thiagosullivan
@thiagosullivan 6 месяцев назад
That white Jackson is awesome 🥰
@adam.erweeYT
@adam.erweeYT 2 месяца назад
Great work! Thank you. Question: Where would you suggest we host our db?
@audriuskurgonas3296
@audriuskurgonas3296 Месяц назад
I hosted mine with Supabase, works great
@MrGunshippilot
@MrGunshippilot 6 месяцев назад
Great content! Thank you very much for doing this. How would you perform client-side validation, e.g. similar to react-hook-form?
@ahmedusama152
@ahmedusama152 2 месяца назад
Can you please upload video for PHP, please ❤❤❤
@AnisKhan-pq1iq
@AnisKhan-pq1iq 11 дней назад
I saw you, but I don't remember in which movie I saw you.
@SelvanayakiRagavan
@SelvanayakiRagavan Месяц назад
what plugin is that? to refactor tag attributes to line by line
@andrewhan6021
@andrewhan6021 6 месяцев назад
54:01 Has anyone encountered an "Unhandled Runtime Error: File is not defined - "const fileSchema = z.instanceof(File, { message: "Required" });""? I fixed it in the file app/admin/_actions/products.ts by changing the fileSchema definition to "const fileSchema = z.any();". =)
@horikaze0
@horikaze0 6 месяцев назад
or add import { File } from "buffer";
@TurtlemanDC
@TurtlemanDC 6 месяцев назад
You need at least v20 of node
@andrewhan6021
@andrewhan6021 6 месяцев назад
​@@TurtlemanDC Sweet! It worked when I switched to 20.12.0 with NVM. I was on v18 before. Thanks!
@andrewhan6021
@andrewhan6021 6 месяцев назад
@@horikaze0 That's great, it works with this solution as well. Thanks!
@chadleyantonels9889
@chadleyantonels9889 5 месяцев назад
y'all saved my hair fallout
@Mohammadassubaiyal
@Mohammadassubaiyal Месяц назад
Are we deploying this ptoject?
@M1a2n3o43
@M1a2n3o43 6 месяцев назад
hey man while you were making the add new product form, i tried to it my own way using the form component by shadcn just as it says in the docs and it was imposible.i even posted a question in stackoverflow and people had a hard time finding the issue. could you maybe make a video about the proper way to make forms with shadcn with form and react hook form? Would be a gem of a video. thanks anyway great tutorial.
@grigoriymilushev4929
@grigoriymilushev4929 5 дней назад
Is this project with good SEO?
@dodzz.h
@dodzz.h 4 месяца назад
it would be better if you added categories
@floriangogea9712
@floriangogea9712 5 месяцев назад
Thanks a lot! You're so kind...
@احمدجلاب-ش8خ
@احمدجلاب-ش8خ 3 месяца назад
@WebDevSimplified I have a question for if this project can be deployed in AWS Amplify????? Thank you for the awesome project! 💯❤
@InekMarcinek
@InekMarcinek 3 месяца назад
How did you update purchased products in admin page after successful webhook event? How can I do it automatically without user having to refresh the page?
@PranasRokinskas
@PranasRokinskas 6 месяцев назад
Hi, thanks for this. Stupid question - any particular reason why you aren't using arrow functions for components, i.e. ?
@husseinsalim2398
@husseinsalim2398 6 месяцев назад
Sounds great
@Trisha-ol2yl
@Trisha-ol2yl 4 месяца назад
The redirect function at 1:00:16 is not working.. did anyone encounter the same issue?
@ichchhitdevkota
@ichchhitdevkota 3 месяца назад
Yes, did you fix it? and if yes, what did you do?
@joshnguyen8531
@joshnguyen8531 3 месяца назад
it's not working for me too, did you find a solution
@ichchhitdevkota
@ichchhitdevkota 3 месяца назад
@@joshnguyen8531 still looking for the solution, please post here if you do.
@ichchhitdevkota
@ichchhitdevkota 3 месяца назад
@@joshnguyen8531 use Get method to extract individual individual fields from formData
@PetyrC90
@PetyrC90 3 месяца назад
same
@everythingeveryone-t7k
@everythingeveryone-t7k 6 месяцев назад
well done, can i re-design and deploy for business use ??
@oiqowioqqoiqoiqoiqoioiq
@oiqowioqqoiqoiqoiqoioiq 5 месяцев назад
no
@everythingeveryone-t7k
@everythingeveryone-t7k 5 месяцев назад
@@oiqowioqqoiqoiqoiqoioiq why not ??? so how do i get it business ready ??
@evalaviniabucur1789
@evalaviniabucur1789 2 месяца назад
@@everythingeveryone-t7k of course you can.
@alijalloul122
@alijalloul122 5 месяцев назад
when caching the calls to the db, why not use memo as a simpler way to cache the fetched data till the user either exists the website or manually reloads?
@cant_sleeeep
@cant_sleeeep Месяц назад
what is your keyboard?
@yourlinuxguy
@yourlinuxguy 3 месяца назад
I was thinking of doing this then I thought, It's not for me. I'm doing a Certificate Building project right now.
@P.R.RacerX-Studio
@P.R.RacerX-Studio 5 месяцев назад
Is processing possible to upload a video playlist?
@mansnotprot1544
@mansnotprot1544 Месяц назад
How do you deploy this?
@1armenn
@1armenn 4 месяца назад
Hi Kyle or anyone, do you guys know how to get the billing address to show up with PaymentElement? I have added an AddressElement and it does add the cehckbox that says 'Billing is same as shipping information' but it only gives country and ZIP code. do we not need also the billing address?
@JBUDDTV
@JBUDDTV 4 месяца назад
how do you santize the data before putting into the database ?
@jaasielantunes7320
@jaasielantunes7320 4 месяца назад
The npm run email command is not working in my terminal. Do I need to install any CLI?
@allusio
@allusio 6 месяцев назад
Why you use react caching and next unstable_cache. It is looks like they do the same thing.
@ShadowsPowerFy
@ShadowsPowerFy 5 месяцев назад
Thanks a lot!
@vert-vh2wh
@vert-vh2wh 4 месяца назад
@webdev with the picture uploaded is it possible that I can use api that give me the product image if I type product name or sku
@nathanbrews9951
@nathanbrews9951 4 месяца назад
How do I store images Images [ url ]... sizes, colour, quantity etc ...
@christenw.1726
@christenw.1726 6 месяцев назад
Thank you ❤
@user-hm1ld3bg3g
@user-hm1ld3bg3g 5 месяцев назад
How page loading function works well? It seems that there is no particular code that implements this function but it works well without any states
@abdulkerimyalcn3911
@abdulkerimyalcn3911 4 месяца назад
i agree you. How does loading.tsx work we didin't import it anywhere
@samking618
@samking618 14 дней назад
its a nextjs feature, nextjs takes care of it
@rajeshkannan748
@rajeshkannan748 6 месяцев назад
text-muted-forehand is tailwind classes ? I couldn't find that in tailwind css doc
@algaldia
@algaldia 5 месяцев назад
Didn't find either.
@kyriakosbekas
@kyriakosbekas 5 месяцев назад
They are classes that are generated due to the tailwind config file. When you setup shadcn/ui, some variables for colors, animation, etc. are added there and therefore you have access to these generated classes
@algaldia
@algaldia 5 месяцев назад
@@kyriakosbekas Thank you!!
@kamanipaul5972
@kamanipaul5972 4 месяца назад
❤ love you Kyle
@KevinThomasLampe-dp2ct
@KevinThomasLampe-dp2ct 3 месяца назад
Are you really talking so fast or did you speed up the video :'D if yes, than cool!
@bryandelacruz9066
@bryandelacruz9066 5 месяцев назад
Hi, may i know what database used in this project? thank you
@romanmed9035
@romanmed9035 6 месяцев назад
state manager is not have? ex redux.
@ashenafibordea4087
@ashenafibordea4087 Месяц назад
You haven't shown us how to implement the webhook. I'm stuck.
@ashenafibordea4087
@ashenafibordea4087 Месяц назад
I got it it is setting the address localhost:3000/webhook/stripe
@ashenafibordea4087
@ashenafibordea4087 Месяц назад
I get a response for the payment intent event but no user and order is created
@Uziiberg
@Uziiberg Месяц назад
@@ashenafibordea4087 Hi I am facing a similar issue, not getting any emails to send either and Resend has no activity in my logs. Were you able to figure this out?
@Uziiberg
@Uziiberg Месяц назад
@@ashenafibordea4087 I don't think my app/webhook/route.tsx is being hit at all actually
@Uziiberg
@Uziiberg Месяц назад
okay... so for me, I did not realize stripe listen needed to stay up in a separate terminal.... imho that was very easy to miss since he cuts away the terminal after running stripe
@yukiritosurada8392
@yukiritosurada8392 5 месяцев назад
Please create infinitely nested comments using Next.js and MongoDB. Thank you🙏🙏
@unclesame
@unclesame 2 месяца назад
Isn't server side rendering a bad idea? It puts load on the server for heavy applications?
@cant_sleeeep
@cant_sleeeep Месяц назад
no. from what i learned, next js deduplicates requests so its not as heavy
@7th.convict
@7th.convict 5 месяцев назад
Navlink text wont even show for me.
@matthiasnienhaus7735
@matthiasnienhaus7735 6 месяцев назад
20:18 How do you split the string into multiple lines within the cn() function? I get an unterminated string literal error 1002 when I try that.
@jamesb1664
@jamesb1664 5 месяцев назад
If you notice it happen when he saves the changes - he has prettier extension enabled to ‘format on save’
@Reacts441
@Reacts441 5 месяцев назад
Is this project available in GitHub please?
Далее
Every Developer Needs To Know How To Do This
10:02
Просмотров 58 тыс.
Node.js Doesn’t Suck Anymore
16:59
Просмотров 112 тыс.
pumpkins #shorts
00:39
Просмотров 6 млн
NextJS Tutorial - All 12 Concepts You Need to Know
44:38
Next.js Server Actions...  5 awesome things you can do
7:51
Are we going back to PHP with fullstack JavaScript?
9:57
Learn Prisma In 60 Minutes
59:25
Просмотров 411 тыс.