Build a SaaS Markdown blog with Next.js 14, Stripe, Tailwind, Supabase, React

No video

Build a SaaS Markdown blog with Next.js 14, Stripe, Tailwind, Supabase, React | Full Tutorial 2023

Рет қаралды 48,309

Daily Web Coding

Күн бұрын

Пікірлер: 82

@DailyWebCoding 8 ай бұрын

In the demo, you will the see the page full reload when I toggled the switch form. Because It is from the old code and if you take a look at this 2:36:40. The page is not full reload. I fixed it already. You can find the code in the description.

@zatakzataks 8 ай бұрын

what is the font name of your vscode

@DailyWebCoding 8 ай бұрын

@@zatakzataks I am using Dank Mono.

@elonkiptoo1710 8 ай бұрын

@@DailyWebCodingokey

@joseeavr 7 ай бұрын

Ok but change font pls

@DailyWebCoding 8 ай бұрын

Thank you everyone for watching this video. Don't forget to like and subscribe to help making more content like this. 🙏

@philiphardy7311 8 ай бұрын

great in-depth tutorial! Quick tutorials for intermediate to advanced devs with less explanation are very popular and might help your channel grow. 20 or 30 mins maybe. Great work!

@DailyWebCoding 8 ай бұрын

Thank you for your suggestion

@bukki007 Ай бұрын

This is also great

@xczm225 4 ай бұрын

The video is damn awesome dont understand how you have learned supabase that good

@hauvert_ 7 ай бұрын

amazing tutorial and great showcase of supabase.

@romulosendoromulo 8 ай бұрын

Dude, this channel is awesome

@DailyWebCoding 8 ай бұрын

I appreciate that!

@narinderkmaurya 8 ай бұрын

Awesome 💯

@yusufmafif 7 ай бұрын

Thanks a lot.. i just finished this project

@prashlovessamosa 8 ай бұрын

Thanks for sharing.

@OnlyJavascript 8 ай бұрын

amazing one

@arnaudlelong2342 8 ай бұрын

Great job buddy, thank you.

@yanDev 7 ай бұрын

Good morning, I have since discovered your channel and I find your content of excellent quality, I loved this video which allows you to discover a lot of features and functionalities for Supabase that I have always wanted to use with Nextjs. So I thank you for this video and I encourage you to continue this type of content. For example, if you could show how to create an application that shows how to use a service like Resend with Next and Supabase that would be great! or simply why not take up this project and improve it by adding an email sending system to create a sort of Newsletter when new blogs are added! This is just an idea but in any case thank you!

@user-lu2zc5cs8v 8 ай бұрын

Nice Video

@rishiraj2548 8 ай бұрын

Thanks

@leanghourngphoeung2850 8 ай бұрын

Thanks you for sharing 。

@junsgk 8 ай бұрын

Best SNS(supabase, nextjs, shadcn) stack video on youtube!!! By the way, using zustand for handling session vs supabase server client, pros and cons??

@DailyWebCoding 8 ай бұрын

this is from my experience: first I used supabase server client to handle session and page protection. It is working well. But until I want the page to be static which we cant since we are using supabase server client the page will be dynamic, plus supabase is not cache the request. So It will call to get session everytime I navigate to that page. so the solution: I move page protection to middleware and if I want to use user session for later. I can do this github.com/Chensokheng/next-saas-blog/blob/master/components/SessisonProvider.tsx with zustand. Hopefully this answer to your quesiton.

@developerme 8 ай бұрын

As I did the PostreSQL command for Auth I started getting Error 404

@goncalosantos3604 8 ай бұрын

same here @Daily Web Coding

@samueloktavianus3871 8 ай бұрын

in your login component specify options: { redirectTo: `${location.origin}/auth/callback?next=${pathname}`, },

@dk2976 5 ай бұрын

Here is the translation of your text into English: "I experienced the same issue, but it was due to a missing default value of 'user' for the role column when creating the table, which caused the bug. I hope this helps."

@xczm225 4 ай бұрын

is this what you get? 500&error_description=Database+error+saving+new+user

@krisznitro5403 8 ай бұрын

This one is a gem! Thank you for the video! ✨ A question though: may I ask what theme and font you are using in vscode? Thanks in advance! :)

@emsaik8202 8 ай бұрын

Hey! Thanks for your videos they are super useful! I was wondering, could you point me to any blog post or information on how to correctly handle multi tenancy? I need to have multiple supabase projects but I need to share the auth for them, thanks again for your videos!

@junsgk 8 ай бұрын

1:05:08 button has type atttibute. Inside of form element, it turns into "submit" by default. If you set type to "button" the default behavior wont work.😅

@jake_fish 7 ай бұрын

thanks so much @dailywebcoding! might you be able to export, screenshot, or somehow share your supabase config (tables, functions, triggers, etc.) as well?

@parthshady5981 8 ай бұрын

Will using markdown have any negative effect on SEO?

@maverick456-33 8 ай бұрын

I'm curious why you don't use Prisma :) Good job btw !

@DailyWebCoding 8 ай бұрын

Prisma is just an ORM to work with database. Supabase already has sdk to interact with database plus if you use prisma you have to implement RSL on your own.

@yashsolanki069 8 ай бұрын

@@DailyWebCodingRLS ?

@DailyWebCoding 8 ай бұрын

@@yashsolanki069 row security level, I missed spell

@yashsolanki069 8 ай бұрын

@@DailyWebCoding i didn't even knew about this lmao, thanks for considering this as well. Here supabase is being directed as db or specifically postgres is being used for db ?

@DanThemes 8 ай бұрын

I don't understand why so many people use that horrible font, it's so unreadable.

@Rafaelprog 8 ай бұрын

Yeah, It's terrible

@xtianhondo 5 ай бұрын

eye-straining font

@davidlintin 5 ай бұрын

Same. The line height too

@panicbox4609 8 ай бұрын

Darn wish you would have implemented supabase storage for photos...

@jannickpedersen4620 4 ай бұрын

I am at 4:10 - i did the login stripe cli and did the listener and the listener is active in the stripe under webhooks - but my user does not get updated with subscription id and status, its still false

@jannickpedersen4620 4 ай бұрын

my function was wrong, i had written: subscription_statusfrom, LOL, needed to seperate the from xD

@SALML 8 ай бұрын

Next about Storage please b

@hauvert_ 7 ай бұрын

pace is definitely for a little bit more passed begginer but not quite jr yet.

@xczm225 4 ай бұрын

does this trigger and data function of supabase works with google auth?

@user-es2ri7lb7h 7 ай бұрын

Does this project support SSR? I quickly looked through it, and I think it's made up of only Client Components. Right?

@zebruh. 7 ай бұрын

can you please help me why i keep getting like "Refresh Token Not Found status : 400/429" in my terminal because of that i cant see my progress in localhost:3000, it is an honor to get answer from you

@naylord5 8 ай бұрын

Amazing project! Thank you so much for sharing! I have one question, is there a way to prevent the full refresh of the page when toggle the premium selector? I mean, can we update just the affected row instead of the entire content?

@DailyWebCoding 8 ай бұрын

You can take a look at this 2:36:40 the switch form will not trigger page full reload. Actually in the demo, it is from the old code and I fixed it already

@naylord5 8 ай бұрын

That's perfect! Thank you so much for pointing that out master@@DailyWebCoding

@hyakimaru8614 8 ай бұрын

Can you make Next.js 14 Fundamental ?

@DailyWebCoding 8 ай бұрын

Yep yep for sure I will do it

@sai9692 7 ай бұрын

Why you aren't using any ORM such as Prisma or Drizzile?

@erracode 7 ай бұрын

Dunno if someone can help me here, am doing the auth but doing it with password and email way, the thing is that the provider effect doesnt run again after a logout and login again, i have a router.refresh() that "refreshes" the page but it has the old values from the previous session ie another user

@DailyWebCoding 7 ай бұрын

How do you implement authentication? Is it in server action?

@user-cw2fv2ur1j 7 ай бұрын

hello sir.. im follow your tutorial and finished for 5 days.. everything gonna be ok until deploy as your video shown.. but on last section, i got error after change site_url to prod_url, on timestamp 4:57:15.. i watch your video again and again, but not work.. can you help me sir please..:) note: this my failed... > Build error occurred Error: Failed to collect page data for /blog/[id] at D:\MKAIDEV PROJECT ONLINE\mkaiblog ode_modules ext\dist\build\utils.js:1220:15 { type: 'Error' } Collecting page data .

@user-cw2fv2ur1j 7 ай бұрын

and this on log error vercel deploy... TypeError: Failed to parse URL from undefined/api/blog?id=** at Object.fetch (node:internal/deps/undici/undici:11372:11) { [cause]: TypeError [ERR_INVALID_URL]: Invalid URL at new NodeError (node:internal/errors:405:5) at new URL (node:internal/url:637:13) at new _Request (node:internal/deps/undici/undici:5055:25) at fetch2 (node:internal/deps/undici/undici:9195:25) at Object.fetch (node:internal/deps/undici/undici:11370:18) at fetch (node:internal/process/pre_execution:242:25) at i (/vercel/path0/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:174256) at U (/vercel/path0/.next/server/chunks/638.js:1:39496) at /vercel/path0/.next/server/chunks/638.js:1:41609 { input: 'undefined/api/blog?id=**', code: 'ERR_INVALID_URL' } } > Build error occurred Error: Failed to collect page data for /blog/[id] at /vercel/path0/node_modules/next/dist/build/utils.js:1220:15 { type: 'Error' } Error: Command "npm run build" exited with 1

@DailyWebCoding 7 ай бұрын

undefined/api/blog?id look like you forgot to set env for SITE_URL as you can see it's undefine.

@user-cw2fv2ur1j 7 ай бұрын

this error on vercel deploy.. im already set env for SITE_URL, may i add set env PROD_URL after code you change on last video?@@DailyWebCoding

@DailyWebCoding 7 ай бұрын

after that try to redeploy again without cache

@user-cw2fv2ur1j 7 ай бұрын

done bro.. everithing is fine after i add env PROD_URL on vercel.. ty for your respond, i very like your tutorial and already subscripe.. hope you can show more project next time.. @@DailyWebCoding

@amt.7rambo670 8 ай бұрын

Bro a doubt. Here we are using our stripe key but will users who post blogs will they receive money in their account if someone purchases their blog or will we get the money?? Pls clarify

@DailyWebCoding 8 ай бұрын

actually this is like a personal blog where only you or your team who can write blog and get paid.

@amt.7rambo670 8 ай бұрын

@@DailyWebCoding bro only one help can u make a quick tutorial on the above question i asked i am creating a saas. But i am stuck in this part. The website should be ours but the sellers who use our website must get their respective money if any buyer buys from them using online payment on our websiite . We shouldnt have a comnection in their online transaction from our website. I am not able to find any tutrial related to this on youtube or internet

@DailyWebCoding 8 ай бұрын

@@amt.7rambo670 sure I will take a look at this and try to do it

@amt.7rambo670 8 ай бұрын

@@DailyWebCoding thanks bro ur the best 👌

@AmineZyad 8 ай бұрын

The video looks good. I just can't focus with that font, it looks unreadable and hard to follow with

@ashutosh_tiwari 7 ай бұрын

Please change the font!

@frogfox9577 8 ай бұрын

Someone know if we could put different "stripe" account for different post ?

@wilonweb 8 ай бұрын

Do you use content layer ?

@DailyWebCoding 8 ай бұрын

No I don't use it. It is interesting I will check it out.

@din2 8 ай бұрын

Bro, how do we display a page view integrated with a database?

@DailyWebCoding 8 ай бұрын

I am not sure I understand your question.

@chuhuynh270 7 ай бұрын

I want to copy the sql code in your demo blog but it's locked :(

@gabriel06123 8 ай бұрын

Damn.. I was so happy about this video until you used zustand. Why would you use this extra library when you can achieve the same thing with just supabase?

@DailyWebCoding 8 ай бұрын

I think the reason that I used it because supabase doesn’t cache the request and I want to share user session in multiple client components. I don’t want to use react context as well that’s why I go with zustand it is less boilerplate and easy

@gabriel06123 8 ай бұрын

@@DailyWebCoding I understand, thanks for that extra info.. I will try it then 👍 Btw.. great content, love your videos!