Build An AI Resume Builder SaaS Application (Next.js 15, Stripe Checkout, Hook Form, TypeScript)

[@codinginflow]

If you don't have Vercel Postgres available pick "Neon" below instead.

[@AlexanderMoyer-k3b]

thanks! super fun project.

[@ResumeAIGenius]

wow nice project, nice teacher I have just finished building this project and i have add my other features on it, But one thing i need to ask >>> I need to add a free trial to paid features what do you think is the best way of doin it should i do this in stripe dashboard or i should do it in my code?. ones again your effort is appreciated.

[@codinginflow]

@@ResumeAIGenius Thank you for the compliment! I would probably do it in the Stripe dashboard.

[@ResumeAIGenius]

@@codinginflow Thank you for your consideration by replying to me, now at my approach in prisma schema i addded model UserSubscription { id String @id @default(cuid()) userId String @unique stripeCustomerId String @unique stripeSubscriptionId String @unique stripePriceId String stripeCurrentPeriodEnd DateTime stripeCancelAtPeriodEnd Boolean @default(false) trialStart DateTime? trialEnd DateTime? hasTrialExpired Boolean @default(false) createdAt DateTime @default(now()) updatedAt DateTime @updatedAt @@map("user_subscriptions") }

[@klhmia]

I'm half way through this monstrosity and just want to say how amazing your explanations are. It's VERY easy to follow despite being very long. Thank you for making such an in-depth and easy to follow project tutorial!

[@codinginflow]

I'm glad to hear that. Trying my best!

[@bobobo1673]

I've been following your entire project on Instagram to see how it was progressing. I've already started to notice all the work you've done by watching the video. Thank you very much.

[@codinginflow]

Thank you for following on Insta!

[@hemantbhonsle1087]

Coding in Flow you're one of the best channels ever for coding tutorials, huge respect to you man for keeping this content on KZbin for free, hope you're doing well mentally & physically. Your diet is also super awesome from what I see on Instagram. Kudos to you man 🙌

[@codinginflow]

Haha thank you for the kind words and for following my stories 😁

[@hemantbhonsle1087]

@codinginflow No worries man, excited for your School website video, you're working hard, keep it up 🙌

[@nik8688]

one of the best js teachers out there. explains everything in so much detail with such a great level of calmness

[@codinginflow]

Glad you like it my friend!

[@nikolar5847]

I am following your channel since 2019, when I started learning android development. Now I see you are doing modern web applications and I am very interested in it. I will surely watch this one, thanks :)

[@ead5590]

Was really looking forward to this! Thanks a lot for uploading this Florian! ✌🏻

[@codinginflow]

Hope you enjoy it!

[@Next-Js]

Very good project, keep it up, you are an inspiration, I am always looking forward to your projects, this one I will advance it calmly, but I wanted to comment you from the beginning, a hug.

[@codinginflow]

Thank you very much!

[@M.KamelHarchaoui]

Mein Dank und mein Respekt, du hast es mit dem legendären deutschen Handwerker-Gewissenhaft gemacht.

[@codinginflow]

Haha das ist eine gute Beschreibung 😆

[@xCarter93]

Once again, great work. You cover such a broad range of topics and provide clear explanations for everything. Out of curiosity, have you ever used Convex in any of your projects? I'd love to see a tutorial where you use Convex as a backend.

[@superhumandose]

Hahaha, your sense of humour is amazing, was laughing throughout the video😂

[@codinginflow]

God. I try to make it a bit more enjoyable by adding some humor.

[@sayankhutia6401]

Great work Florian! I'll start working on it soon. Thanks

[@tomaszstec5672]

When I saw the stack.. I just said... Wow man! Why U read in my mind!!!

[@codinginflow]

I read your browser history

[@DevIsrael]

@@codinginflow 😂

[@ustin91]

Your tutorials are great. Thank you.

[@mavery13ma]

Amazing! Just wow! I'm following your channel, thanks so much.

[@codinginflow]

Do you like it?

[@mehulparekh619]

Love your videos ! Would definitely like to see something with GraphQL and Nextjs :)

[@flan_02]

06:55:00 I'm very grateful using this tool I got hired as a toilet cleaner in Burger King !

[@codinginflow]

Good job 💪

[@hvwong2044]

Great ! i just finished the project. thanks

[@codinginflow]

Legend ✋

[@nsgking441]

can u share ur repo i got some error

[@lakshyadubey9066]

amazing video bro , really loved your content probably the best easy to understand and quality content on youtube, here is a small feedback - if possible , please share a figma file also , it would help a lot . Love from india ❤❤❤❤

[@maorsaadia9806]

Great project, and fun tutorial thanks!

[@codinginflow]

Thank you for the kind words!

[@abdullah.alkheshen]

Congratulations 🥳 Thank you for the hard work ❤

[@codinginflow]

🥳

[@yuwownly8630]

This is freakin awesome project. I love it

[@codinginflow]

Yes it's amazing

[@mnhtada12]

Finally its here 😍❤❤ thank youuuuuuuu

[@klhmia]

Wouldn't you want to store user data after a user registers with clerk, to our own database? What if clerk just suddenly stops their service or does something? I would think we want our own database collection of users to be safe and also because having that data means more value for us.

[@egretfx]

you are a godsend!

[@southixaphilavong7691]

Just finished took me two months to finish this❤❤

[@not_a_human_being]

wow, pretty cool!

[@Ruan-y8f]

I'm happy with your tutorial videos, but when working on them I come across pages hosted in English, which doesn't make it feasible to implement them in my country. However, it's still a great help for building a portfolio and thus working as a freelancer.

[@smartdriver2990]

Great work, thanks for sharing

[@yantech.4249]

Amazing work and big thanks my friend

[@codinginflow]

Thank you too

[@UditNagar-of5su]

Thanks brother for your efforts...❤

[@codinginflow]

It's my pleasure

[@markus_dev_cwb]

OMG! Awesome project Man!

[@codinginflow]

I'm glad you like it

[@dreamsachiever212]

wowzers... great project

[@edavids06]

Very amazing project 👏🏻

[@codinginflow]

Thank you! 😊

[@BahaaAldein10]

That is a really great video tutorial ❤❤❤❤

[@ghalitsar2730]

Lets goooo

[@JustReactionsOnly]

Great Tutorial Florian. Really awesome. Followed all the way but kind of got stuck as cannot get subscription upgrading to save to the DB so have been stuck combing the issue for MANY hours.

[@CarlosTello-h5s]

nice project and UI

[@didholipyan8227]

great video, i'll try to follow this. but i have a questions, when you found a new third party library and want to implement thats to your project, how much time you spent to make it works ?

[@codinginflow]

1 hour and 23 minutes

[@yashdarji9593]

finally wait is over

[@abdullah.alkheshen]

One of it's kind on the internet

[@epatrickification]

Cool stuff Florian!

[@codinginflow]

Glad you like it!

[@Anonim-vi4er]

best tutorial 🎉

[@pongsathon88]

i love you man thank youuuuuuuu.

[@45turgut]

Great content!! Thanks for your efforts! I just wonder how to implement page split if the content is longer than 1 a4size and show the preview as in print?

[@mubashirhussain-p5q]

Hi Florian, I’ve been following your channel for over a year now, and I’ve learned a lot from your videos-thank you! I wanted to request a tutorial on building an **e-commerce website with Next.js 15** using server actions, Zustand, shadcn UI, React Hook Form, and NextAuth v5. It would be amazing to see your approach to this topic. Thanks for your great content! Best regards, Mobi

[@velanthevar2459]

Bro, I have built this entire project and add few customisation can I deploy it vercel not for making money just for showcasing my learnings. Do you have any issues with that?

[@MrPyramide]

Salut Florian ;) Dans un premier temps, un grand merci pour le tuto qui fût sympa à suivre ! A des moments, c'était dur de suivre, car étant français, la trad' google s'est arrêté à 3h du tutoriel. Aussi, sur la fin, je suis un peu déçu, car impossible de faire un déploiement sur Vercel... :/ Trop d'erreurs de typage qui s'enchaîne en série et malgré plusieurs tentatives de bugfix, j'ai laissé tombé le projet sans pouvoir le déployer... On règle une erreur, mais une autre s'ajoute en cascade... J'ai même tenter de reprendre certaines parties du code de la branche 20 du "final project", mais sans succès.. En tout cas, c'est cool de ta part d'avoir permis d'apprendre toutes ces technos ! :)

[@abelmarkos5753]

Very nice project

[@codinginflow]

Thank you

[@youneshenni5417]

excellent project

[@codinginflow]

Thank you!

[@nomxxn]

the webhook part of stripe, im using authjs as the auth, so how will my code be for that part?

[@ilan117]

Hi Florian, Endlich ♥️ Florian we all use so many services e.g. Supabase, Vercel, Clerk, Kinde, Neon.. and so. Yes, some does have free tier with is great but some are limited such as Supabase and Vercel. Could you maybe consult ... What would be the best choose for someone who wants to build up a portfolio of application in Next.js and React.js running? Which provider/s would you choose considering costs and services?

[@codinginflow]

The ones I use in my tutorials

[@vraudio.]

Thanks!

[@codinginflow]

Welcome!

[@sujoykrhaldar]

Will you add how to build a custom payment page and connect it with Stripe API instead of using Stripe UI redirection in your next project course on KZbin? also add multiple payment gate ways like adding stripe / Paypal / razerpay.

[@koendegroot4454]

Amazing tutorial!! Danke Danke Danke!! But i might have a use case in the app that could be a problem. Let's say for example you have 1 resume and get de pro monthly plan via the premium modal. Then you get 3 resumes and add the pro plus monthly , again via the premium modal. It seems that you then have 2 subscriptions, for pro and pro plus. It is clear to see when you manage the subscriptions via the billing portal. Is this a bug? Should you only have 1 subscription after upgrading from pro to pro plus via the premium modal?

[@codinginflow]

Are you sure it creates 2 subscriptions? Have you tried it?

[@OmarFaruk-bz4gw]

❤❤❤❤❤

[@ravi_sorathiya]

Hi Florian What's is your video setup gadgets Camera microphone pc spec Which software you use for video editing Please let me know i am also planning to make youtube tech videos

[@codinginflow]

Rode podcast mic $20 ring light from Amazon smartphone as webcam

[@ravi_sorathiya]

@@codinginflow what do use for adding moving face in the corners in the video?

[@brivadigital]

When adding clerk to the auth folder, am getting this error localhost redirected you too many times. What could be the issue?

[@mohammedhassan8942]

instead of using Chatgpt Ai what other options do we have here ?

[@dami3589]

CRACKED

[@Lieblingszuschauer]

Hi do you offer only the starting code on Github or the full code as well?

[@codinginflow]

both

[@Lieblingszuschauer]

@@codinginflow thanks for your response. finally I found it. As a lonely wolf I'm not so firm with git (hub). Liebe Grüße.

[@collinsk8754]

Really good project. Great job 🙌🙌

[@codinginflow]

Thank you!

[@WatsonCyrusAnikwai]

What does the database schema look like?

[@3sxmaxman]

perfect

[@Ruan-y8f]

When deleting a resume in Prisma I noticed that the ID in the URL was reused to create a new record, that is, the user can create any ID, this is not expected

[@codinginflow]

fix it

[@seringeti2009]

always get error on OpenAI key even I put the key in .env file Error: The OPENAI_API_KEY environment variable is missing or empty; either provide it, or instantiate the OpenAI client with an apiKey option, like new OpenAI({ apiKey: 'My API Key' }).

[@dario0511]

Hey, I am subscribing to your channel and learning a lot from your videos. I am curious about your flow from idea to starting coding/finished project. Can you write a post or make a video about it?

[@codinginflow]

What do you want to know?

[@dario0511]

@@codinginflow For example, when designing apps, do you take inspiration from any resources when preparing app views in figma or another tool? Before you start coding, do you have all the features already written out, or do you customize them while coding? In the video we already see clean coding, without fixing bugs, with well thought out functionalities while this also interesting work is at the very beginning off-camera.

[@GelaDzia20]

Hello, I don't have Postgres in options on vercel, what i can do?

[@codinginflow]

Use Neon like I show in the video

[@GelaDzia20]

@@codinginflow I already fixed it, it was just disappearing, and I managed to catch it. This is such an amazing video, you explain everything perfectly, and it will actually be really useful for me. Now I’m starting my job search, and I’ll easily create CVs whenever I need them. Thank you!

[@selimpy8105]

how did u catch it its dissapiar for me can you share the link

[@GelaDzia20]

​@@selimpy8105 I Switched to slow internet in network tab.and clicked it before it disappeared.

[@codinginflow]

It seems that Vercel removed the Postgres option in favor of Neon. You can click on "Neon" and everything else should work the same.

[@130panuwatponsa7]

Hi, Guy can I use Gemini instead of ChatGPT?

[@codinginflow]

Sure!

[@OmarFaruk-bz4gw]

Game change this course

[@codinginflow]

💚

[@user-ys1wh8jn1e]

Could you do one for custom pdf template creator ui with api?

[@VineethThungani]

Can we use the gemini api instead of openai

[@codinginflow]

sure

[@nazakatejazz7467]

Bro I have cloned your repo using git clone, repo was clone, I ran npm i with peer deps flag, everything went well: but I have faced two issues: 1) there was an error related to clerk (related to apikey) 2) I was unable to find .env file. As a result now I am redoing intial steps, i.e create new next project

[@codinginflow]

You need to use the starting code

[@uditnagar7905]

I am not able to clone the starting code, It is showing npm error

[@codinginflow]

npm i --legacy-peer-deps

[@uditnagar7905]

@codinginflow Yupp I debug it just like this

[@nikolar5847]

Whats the shortcut for prisma auto align?

[@codinginflow]

The same formatting shortcut as in other files but you need the extension installed

[@nikolar5847]

@codinginflow I havent caught that in tutorial, must missed something. Can you please share with me that shortcut? Thanks!

[@codinginflow]

@@nikolar5847 It's different on different computers

[@alham4u]

Bro, I am waiting for a SaaS School Management system where we can onboard schools to facilitate them with class routine preparation to online exam results. Please consider it as your next project

[@codinginflow]

What does that mean? What features do you need exactly?

[@alham4u]

@codinginflow a full School management app as your next project

[@codinginflow]

I have no idea what that means: "onboard schools to facilitate them with class routine preparation to online exam" You have to be more specific.

[@alham4u]

@codinginflow I meant to say that, in the SaaS app different schools around the world can join as customers where they will have the functionality to manage students, teachers, tuition fees, attendance, exam result sheets, class routine, notice board and what may require to manage a school. Based on number of students in the school, the app will have different packages.

[@codinginflow]

@@alham4u Do you have an example of such a site?

[@mylearningyt-x5v]

the site does not work anymore in vercel

[@codinginflow]

I don't keep them online

[@mylearningyt-x5v]

@@codinginflow why not?

[@alexdin1565]

please can you make video about payloadcms?

[@hendoitechnologies]

can you post more saas project videos like this regularly.

[@codinginflow]

Yes

[@nabeeliftikhar208]

Is the source code available on GitHub?

[@codinginflow]

yes, link in description

[@souptiknath4668]

Why are you still using windows 10

[@abwebmaster3]

The idea behind this is 🔥. I want to add up to the idea. What if there is functionality to share the link of the resume? Then the employer will be redirected to the resume page and take a look at the resume instead of just hard copy. Thank you man

[@codinginflow]

Yea that's a great idea and not very difficult to build

[@ni_kabiu_john]

From 🇰🇪 I say danke danke danke.. I have been wondering how I could layout this

[@codinginflow]

You’re welcome 😊

[@ni_kabiu_john]

@@codinginflow Currently working on Veterinary clinic management system and i want to employ AI. am definitely joining your classes.

[@hk254lyt8]

Mboka lazima ijipe 😂

[@nwebpro]

Live link not working

[@codinginflow]

I don't keep these projects online. It's just for the video.

[@nwebpro]

​@@codinginflow Thanks for your response. Now I want to download my resume after clicking on the download button, how can I do this?

[@afaqahmad-ef4ky]

I think ChatGPT apis are not free

[@SONAL.K.G22UCSV166]

you nonsense i do not understand the code then how i do my project i am from india

[@klhmia]

I was getting a fkey (foreign key) erorr on the resume deletion portion of this tutorial. I narrowed it down to the education items having something to do with it which was weird considering I don't think the work items were ever an issue. The ultimate fix for me was prisma.workExperience and prisma.educations.deleteMany where resumeId: id. to make sure those were deleted before the actual resume. I'm not sure how great this fix is and it seems there should be an easier way so I wanted to share. Thanks again!