Build a Buy me a Coffee Clone with Stripe, Airtable & Next.js
Вставка
- Опубліковано 3 лип 2024
- In this video we build & deploy a Buy me a Coffee clone with Next.js, Stripe, Airtable and Vercel.
Repository: github.com/TomDoesTech/buy-me...
Buy me a beer: buy-me-a-beer.vercel.app/
0:00 Intro
0:56 - Demo
2:21 - Bootstrap application
3:16 - Layout & Tailwind CSS
18:42 - Stripe checkout
30:18 - Stripe webhook
36:45 - Create Airtable record
43:07 - List Airtable records
50:39 - Deployment
53:47 - Outro
🌎 Follow me here:
Discord: / discord
Twitter: / tomdoes_tech
Facebook: / tomdoestech
Instagram: / tomdoestech
TikTok: / tomdoes_tech
☕ Buy me a coffee: www.buymeacoffee.com/tomn - Розваги
Good idea. I will build it on my own and come back to this to see your approach.
Such an underrated creator. This is really helped me a lot. thank you so much for this wonderful videos.
Good stuff!
Love these mini projects you do. I learn a lot
This is awesome, thanks for great tutorials as usual Tom!
What a nice project to code during lunch time. Great as always, Tom!
Big Tommy Tech bringing the goods as always
As a new TS lover I found you quite late dear Tom! Thank you for these TS dedicated tutorials.
This is great Daddy Tech
Thanks sir!
Great one!
This is awesome THANK YOU SO MUCH
Super awesome
learned a lot thanks 🥰🥰
i hope that you will create video with new nextjs in the future after relising him. Thank you for your tutorials
nice content
I think it would a good idea to remind people to change the routing in stripe from ngrok to the vercel's link :)
Fucking awesome ❤️❤️
4 the algo
Hey Tom, did you have another part of this tutorial that discusses how you build the part of BuyMeACoffee that creates a different landing page for each creator? The main part I'm trying to understand is how to create stripe payments for each creator.
I don't think I did another part
Great small project! Question, what keyboard are you using and what switches? 🤓
It's a ducky 2, not sure what switches tbh
@@TomDoesTech Thank you Tom 🙏☺️
Hi Tom, you've used this code at around 35:55
const metadata = (
event.data.object as {
metadata: { name: string, message: string }
}
).metadata;
However, the type casting here doesn't actually guarantee you that the object includes a 'metadata' attribute (with name and message attributes) right?
It got me kinda confused if my understanding of the code was correct or not.
Thanks for the video btw!
No type guarantee data exists, you need to validate for that.
This is telling TS, we know the data is this shape even if you don't think it is.
since you posted this video last week, i presume you used next13 ?
Yes sir
always gold videos Tom! but i have quastion please 🙏🙏! i want to do real application with strip but how we configure stripe to make real payment and recieve money in stripe account because i didnt find real video explain about it i was see just testing amount🙏🙏🙏🙏
Just switch the testing creds for real creds and it will work. People are only ever going to show with testing account because you'd need to use a real credit card otherwise
@@TomDoesTech thank you so much sir
Big Tommy Tech bringing the goods as always
haha that made me laugh, thank you