Create a SaaS using Next.js, Kinde-Auth, Supabase, Prisma, Stripe, and Tailwind CSS.

Поділитися
Вставка
  • Опубліковано 26 гру 2024

КОМЕНТАРІ •

  • @etekumoses3320
    @etekumoses3320 4 місяці тому +14

    This guy has legit videos and made me build my saas product thanks a lot

    • @AlexanderMoyer-k3b
      @AlexanderMoyer-k3b 2 місяці тому

      how do u use shadcn with next rc?
      it simply doesnt work i used his install script for the radix components.

  • @amvillanuevap
    @amvillanuevap 3 місяці тому +2

    I followed the entire tutorial! Amazing work :) This is probably the best walkthrough and explanation I have found for this kind of tutorial.

    • @janmarshalcoding
      @janmarshalcoding  3 місяці тому

      🫶🏻

    • @AlexanderMoyer-k3b
      @AlexanderMoyer-k3b 2 місяці тому

      how do u use shadcn with next rc?
      it simply doesnt work i used his install script for the radix components.

  • @adityashukla9840
    @adityashukla9840 4 місяці тому +2

    Want to know A Cool Thing ....I Have completed your Digital Marketplace Couese Such an amazing Course and now i also got this...

  • @adeltahmid_
    @adeltahmid_ 2 місяці тому

    Excellent Project Jan! Love how you are giving values to the community!

    • @AlexanderMoyer-k3b
      @AlexanderMoyer-k3b 2 місяці тому

      how do u use shadcn with next rc?
      it simply doesnt work i used his install script for the radix components.

  • @mentifresh
    @mentifresh 27 днів тому

    Man, your content is pure fire 🔥🔥🔥

  • @manuelsanchezweb
    @manuelsanchezweb 3 місяці тому

    Ich war am überlegen, ob ich mir das Video anschauen wollte oder nicht, aber die Gerolsteiner Flasche hatte mich überzeugt!

  • @hebermanuelcamustrujillo7008
    @hebermanuelcamustrujillo7008 2 місяці тому

    I liked your video. Mostly, because you make see me the errors like an apprentice.

  • @cleverprogrammer7409
    @cleverprogrammer7409 4 місяці тому

    marshal you did something unbelievable keep things up

  • @Deus-lo-Vuilt
    @Deus-lo-Vuilt 3 місяці тому

    Thank you my friend, you are the best, the html editor and other stuff is perfect for me.

  • @samhe331
    @samhe331 3 місяці тому

    Thanks so much for the tutorial, it's so thorough and detailed. I even enjoy the repetitive --legacy-peer-deps and "that's because the server isn't running" haha!
    I run into one issue because of the conform versioning. the problem behavior is that:
    during working on the edit article component. I want to populate the form using the existing data from db. when I load or reload that page, the db value showed up for a split of a second then is quickly overwrite with the placeholder.
    I finally found the problem that it's due to conform's version. i think in your code your are using conform 1.1.5 and i'm using 1.2.1. with 1.2.1 conform always overwrite the value already populated by "value" attribute. downgrade the conform to 1.1.5 the value will show up from the db.

  • @WelmiApp
    @WelmiApp 4 місяці тому

    Amazin' content. Congrats!!!

  • @cristianomesquita2705
    @cristianomesquita2705 4 місяці тому

    You're just awesome man!

  • @lpalmeidabh
    @lpalmeidabh 4 місяці тому +1

    One of the most complete content I've seen! Congrats!
    I'm only on the two hours mark on the video but I can already say that.
    Just one question: About the user synchronization from Kinde with the database, wasn't better to use Kinde webhooks, to call an API route once a Kinde event (user.create / user.update etc) was triggered?

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому

      First of all thank you, glad you like it and it can help you!
      To answer your question, yes, Webhooks are a good idea and probably something I would encourage for a production build. The reason why I don't do that is that I started using kinde when webhooks weren't a thing, and that's why got used to doing things I do them...
      But it's very easy to achieve this if you want to learn it by yourself. Here are the docs: docs.kinde.com/integrate/webhooks/webhooks-nextjs/
      I will try to show this in my next video

  • @markus_dev_cwb
    @markus_dev_cwb 4 місяці тому

    Awesome project Jan.

  • @zeddastake3707
    @zeddastake3707 4 місяці тому

    Very cool thank you for that!

  • @AlanChennampally
    @AlanChennampally Місяць тому +1

    Thank you for the tutorial. Why don't you utilize webhooks with an API route handler for syncing the Kinde user to the Supabase database? Is there any reason you prefer using a server action with the auth-callback page? I'm a beginner but the Kinde documentation specifically had a user.created trigger so I figured that would be the standard way to go about it.

  • @rainkode8795
    @rainkode8795 4 місяці тому

    The king is back 👑

  • @genegade
    @genegade 3 місяці тому +20

    I wish just one of these tutorials would teach you how to roll your own EVERYTHING (auth, db, etc.) from scratch, so you aren't dependent on 10 different cloud providers just to have an app, and you actually learn. The one exception being Stripe, because payments suck.

    • @janmarshalcoding
      @janmarshalcoding  3 місяці тому +6

      Valid point. However, it's difficult to create something exactly like what you're asking for in a free video. If this were a paid video, I'd completely agree with you. But since it's free, I can't use services like Hetzner, which require a credit card. Many viewers of these videos need access to free tiers...

    • @patrikkisbalazs5973
      @patrikkisbalazs5973 3 місяці тому

      ​@@janmarshalcoding wdym bro, Vercel + AWS and you can do pretty much everything in the world

    • @janmarshalcoding
      @janmarshalcoding  3 місяці тому +2

      AWS requires a credit card

    • @genegade
      @genegade 3 місяці тому

      @@janmarshalcoding No, I'm saying don't use ANY cloud services, except for maybe the bare metal prod server (Ubuntu box). Want auth? Here's how to do full auth using psql. Want to use db? Great, here's how to get psql running locally and on prod.

    • @samhe331
      @samhe331 3 місяці тому +1

      from engineering learning stand point it would be good to learn the fundamental from scratch, but maybe good to break it down in multiple video. I actually enjoy all the external tools like supabase/kinde... I'm trying to build a startup product and recently realize that having these tools significantly help me reach the market quickly and if i find product market fit I will use the money to decouple some of these dependencies. if not, then it's free and quick solution and goes to trash or become a tool project anyways. just my own experience tho.

  • @broskisnajdy
    @broskisnajdy 3 місяці тому

    hey Jan, awesome video! I just finished your other SaaS project but will do this soon. Offtopic tho, please, is that mic a SHURE MV7? If yes, that awesome sound, you used some auto settings in the shure app, obs settings, or anything else? I am really curious about it cos I want to buy that mic :D Thanks!

    • @janmarshalcoding
      @janmarshalcoding  3 місяці тому

      Hey mate,
      Yes, this is a Shure MV7. I have the white edition, and I like it. I know there are newer versions like the MV7+ or something similar, but personally, I don’t see any reason to upgrade. It works perfectly for my use case. Initially, I wanted to buy the Shure SM7B, but the issue is that you need to purchase a Cloudlifter and other equipment, which I didn’t want to do since I travel with my mic. Plus, I didn’t really want to spend $600 on a mic setup.
      The only thing that annoys me about the Shure MV7 is that it uses a micro USB port, and it can be a bit fiddly. I’ve never had any problems with recording, but the cable can still be a bit annoying. I know the new version has USB-C, but I’m not sure if paying more just for a different cable and some RGB lighting is worth it.
      As for settings, I just use the default ones in the Shure app. I have it set to dark sound mode, and I like it. Inside OBS, I haven’t set up anything because, honestly, I don’t really know what to do in there 😂
      ahh and also I have added a pop filter from the shure SM7b (20 dollars on amazon). It helps with plosives a bit more.

  • @falasefemi3344
    @falasefemi3344 4 місяці тому

    Legged 🎉🎉

  • @muhammaddanielzuhad649
    @muhammaddanielzuhad649 4 місяці тому +1

    bro what are your extensions, ur vscode looks very good to see

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому +1

      Hey, I have a vid called: How to make VS Code 10x more productive
      There I show everything (layout, theme, extensions etc)

  • @Samkhan7t3
    @Samkhan7t3 4 місяці тому +2

    What extension you are using for time tracking in vs code??
    Love the video though ❤

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому +1

      Hey, I have a vid called: How to make VS Code 10x more productive
      There I show everything (layout, theme, extensions etc)

    • @Samkhan7t3
      @Samkhan7t3 4 місяці тому

      @@janmarshalcoding ok appreciate it

  • @chintanudani5631
    @chintanudani5631 2 місяці тому

    What icon theme is that on vs code, Icons are beautiful on your vs

  • @RasilMaharjan
    @RasilMaharjan 3 місяці тому

    Hey Jan. While editing the article, why are we not updating the image? Or is it covered somewhere later in the course? Just wanted to know.
    About the course though, it's great!

  • @CarlosTello-h5s
    @CarlosTello-h5s 4 місяці тому

    nice video, keep going

  • @Aditya_Vyas
    @Aditya_Vyas 4 місяці тому

    Thanks for mkaing this video.

  • @FahadKiani1
    @FahadKiani1 4 місяці тому

    bro decided to wake up and be a legend

  • @codewithanshul
    @codewithanshul 3 місяці тому

    what are things to be added in the env? please keep .env.example

  • @VNa-ov7mr
    @VNa-ov7mr 3 місяці тому

    Purtroppo arrivato al tempo 9:35 del video, inserendo al nuovo terminale: stripe login, mi da errore

  • @RakibAhmed-n4m
    @RakibAhmed-n4m 4 місяці тому

    which vs code theme did you use?

  • @AlexanderMoyer-k3b
    @AlexanderMoyer-k3b 2 місяці тому

    um -- > how do you get shadcn to work? i used ur install script for radix but it still doesnt work to put in a dropdown-menu >.

  • @doombeatsmusic
    @doombeatsmusic 3 місяці тому

    Hello, I needed clarification on why you use Prisma with Supabase? As I know, Supabase has its own syntax, which is even easier than Prisma's.

  • @allediting9180
    @allediting9180 3 місяці тому

    Are you using MacBook air m1?

  • @lyricon4043
    @lyricon4043 4 місяці тому

    Hey.. can you tell which extension you have installed for icons and folder? It's looking beautiful.

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому

      Hey, I have a vid called: How to make VS Code 10x more productive
      There I show everything (layout, theme, extensions etc)

  • @josealbusneto
    @josealbusneto 3 місяці тому

    Hey, can you share an empty .env only with the keys names?

  • @WebDevNiko
    @WebDevNiko 3 місяці тому

    Can you tell is Uploadthing file uploads better than supabase inherit file uploading like why we using Uploadthing instead supabase file storage?

  • @neilrowland1243
    @neilrowland1243 3 місяці тому

    Great tutorial - I like Conform for creating forms, but the documentation they provide is minimal. I would like to use a date picker within a form but I am struggling to see how to get it to work. If someone has done this could they point me in the right direction please?

  • @waleedsharif618
    @waleedsharif618 4 місяці тому

    Can you create one Saas product using MERN ? Reactjs and nodejs

  • @amt.7rambo670
    @amt.7rambo670 3 місяці тому

    bro what about the security are there any addons we might have to do if we build this professionaly in terms of security??

  • @eduardomoraesrigo4782
    @eduardomoraesrigo4782 3 місяці тому

    If i want to pass a toast message of "Article created" or "Article Edited", "Article Deleted", in which moment and component i do it?

  • @0xtz_
    @0xtz_ 4 місяці тому +13

    me stealing the hero section 👀👀

    • @st7171
      @st7171 4 місяці тому +4

      that makes two of us

    • @eea8888
      @eea8888 4 місяці тому +6

      Me stealing the whole project 💀

    • @techjavaid6177
      @techjavaid6177 4 місяці тому +2

      four of us 😂

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому +9

      Ahahahah. The GitHub Repo is open to take whatever you need. Remove my Spelling mistakes though 😂

    • @0xtz_
      @0xtz_ 4 місяці тому +2

      @@janmarshalcoding thanks man 🙏
      spelling? I didn't notice 😂

  • @arpitkumarsingh8398
    @arpitkumarsingh8398 4 місяці тому

    Prerequisite?

  • @Jishnu_Nath
    @Jishnu_Nath 3 місяці тому

    When or where did you design the sign-up page? When I click on buttons, I get this page doesn't exist

    • @Jishnu_Nath
      @Jishnu_Nath 3 місяці тому

      ok i found out that [kindaAuth] folder name is case sensitive, which is why my Kinde integration was not working. how unkind! LOL

  • @adityashukla9840
    @adityashukla9840 4 місяці тому

    Can you create an using GraphQL

  • @Nothing-cx4jt
    @Nothing-cx4jt 3 місяці тому

    The github repo does not redirect to github repo! Could you please fix this?

  • @allediting9180
    @allediting9180 3 місяці тому

    I am little confused. Should i buy m1 or m2 8gb ram

  • @humbleonyenma
    @humbleonyenma Місяць тому

    PLEASE CAN YOU BUILD AI SAAS FUNNEL BUILDER? LIKE CLICKFUNNEL OR FUNNEL X BUILDER

  • @nikako1889
    @nikako1889 2 місяці тому

    so you are using supabase only for database?

    • @janmarshalcoding
      @janmarshalcoding  2 місяці тому

      Yes. Not a fan of the rest provided by supabase.

  • @Arav.006
    @Arav.006 4 місяці тому

    Whats this font name

  • @chauquang55
    @chauquang55 4 місяці тому

    what is the function of this web

  • @JoKERIFreeStyleI
    @JoKERIFreeStyleI 4 місяці тому

    tell pls theme you used in vscode

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому

      Hey, I have a vid called: How to make VS Code 10x more productive
      There I show everything (layout, theme, extensions etc)

  • @AminGhasempoor
    @AminGhasempoor 3 місяці тому

    hi everyone
    I have a question , I want to see Members-only videos but i dont know how . can you help me ?

  • @uPhanBa
    @uPhanBa 4 місяці тому

    This is called server actions right?

  • @mayanksh219
    @mayanksh219 4 місяці тому

    Is there any breaking changes in Nextjs 14 and 15 ??

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому

      useFormState --> useActionState and instead of default caching, It's now not default cached.

    • @mayanksh219
      @mayanksh219 4 місяці тому

      @@janmarshalcoding Got it Jan. Thank you and Love from India

  • @aryanjangir1126
    @aryanjangir1126 3 місяці тому

    **BUG** hey Jan, great project. But there is a bug, when someone creates two articles of same slug then it shows error.

  • @NityamSuchak
    @NityamSuchak 3 місяці тому

    Hey,
    Jan I have a small question.
    Is this Web App Mobile Responsive?

  • @W4D199
    @W4D199 2 місяці тому

    As a beginner sometimes our Blogger/WordPress Blog doesn't satisfy google's policy and runs into issues leading to monetization approval. If developing fullstack saas deployed how & what setup we should follow to meet Google's policy approval for AdSense monetization 😮. Kindly Guide us😊.

  • @SirEdges_Adejo
    @SirEdges_Adejo 4 місяці тому

    Nice video, not a fan of third party commercial auth packages

  • @farhanzafar215
    @farhanzafar215 2 місяці тому

    Great, can we get source files/code?

  • @maduemeka6982
    @maduemeka6982 4 місяці тому

    ❤❤❤❤

  • @iceshoqer
    @iceshoqer 3 місяці тому +1

    Setup your blog in Minutes - 12 hour video.

  • @aryanjangir1126
    @aryanjangir1126 3 місяці тому

    Also, the left side menu of dashboard ( the links for site , dashboard, pricing) are not visible in smaller screen, guess he forgot to add the menu option.

  • @swarnabhamajumder9561
    @swarnabhamajumder9561 4 місяці тому

    If anyone read this comment just help me in one thing, can i use next js 14 instead of next js 15

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому

      100%. The code is the same. Only the name of one hook is different, but I talk about this in the video

    • @swarnabhamajumder9561
      @swarnabhamajumder9561 4 місяці тому

      @@janmarshalcoding Thank you so much Jan. I am building the project in my pace. Hopefully you bring the video quickly about the specific hook. By the way thanks for the video I have also made the ecommerce project and it gave me a lot of confidence. Thanks for always creating such content for free.

  • @dilshodziyodullayev18
    @dilshodziyodullayev18 4 місяці тому

    Hi bro your contents are amazing, please add a drizzle-orm to your next projects

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому

      Thank you! I plan to do so, but not 100% sure if the next video will feature drizzle-ORM

  • @VNa-ov7mr
    @VNa-ov7mr 3 місяці тому

    stripe: The term 'stripe' is not recognized as a name of a cmdlet, function, script file, or executable program.

  • @zatakzataks
    @zatakzataks 4 місяці тому

    can any one tell me vscode theme name

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому

      Hey, I have a vid called: How to make VS Code 10x more productive
      There I show everything (layout, theme, extensions etc)

  • @nested9301
    @nested9301 4 місяці тому

    Why kinde and not supabase Auth?

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому

      Copied from a different comment:
      First off, yes, Kinde is the sponsor of this video. However, even if they weren’t, I would still never use Supabase Auth.
      Reasons for that:
      1. I find the implementation to be more than just buggy. The SSR package needs to be rebuilt, in my opinion, because it works as expected only about half the time.
      2. Supabase Auth is very basic and doesn’t offer any user management features.
      3. You have to build the entire sign-in and registration forms yourself. You might think it’s easy, and it is at a basic level, but eventually, you’ll need to prevent your forms from being tampered with. At that point, it’s like starting from scratch again.
      At the end i create my projects with stuff that i have tested in production and can recommend. And Supabase auth just isn't there were i would like it to be.

  • @aringawande
    @aringawande 3 місяці тому

    Is this built for free?

  • @imraan_alam
    @imraan_alam 4 місяці тому

    subbed you

  • @AdrianFelismino
    @AdrianFelismino 4 місяці тому

    6:25

  • @zoltanmolnar6956
    @zoltanmolnar6956 2 місяці тому

    Excellent excellent courses, but I dont understand some steps. Protect server actions? Why? Server actions are not routes, cannot be called them via postman or directly. They are called from other components, so impossible call them directly. If that component which one calls server action is protected the server action also will be "protected", because for exmaple reach that particular component only authorized user can. So it is redundency.

    • @janmarshalcoding
      @janmarshalcoding  2 місяці тому +1

      Explaining would take to much time. Here is an twitter post on it. TLDR server actions are public endpoints and should be treated as ones x.com/asidorenko_/status/1838315424091644341?s=61&t=jVnmZo2Zc_o80Jws4K0qxA

    • @janmarshalcoding
      @janmarshalcoding  2 місяці тому

      Explaining would take to much time. Here is an twitter post on it. TLDR server actions are public endpoints and should be treated as ones x.com/asidorenko_/status/1838315424091644341?s=61&t=jVnmZo2Zc_o80Jws4K0qxA

  • @APerson-d5s
    @APerson-d5s 4 місяці тому

    Why are you using Prisma when you can just use supabase query?

    • @youneverknow7096
      @youneverknow7096 4 місяці тому

      Cus not everyone uses it

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому +1

      Valid question. I discussed this in detail in my video for channel members, but I’ll give you a brief TL;DR:
      1. Reliance on Supabase/Postgres → Migrating to another database is much harder and more time-consuming.
      2. Great for basic queries, but it becomes challenging when trying to run more complex ones (speaking from experience).
      3. I don’t quite like the idea of giving it my public keys.
      4. I’m not a fan of RLS (for various reasons...).

    • @APerson-d5s
      @APerson-d5s 4 місяці тому

      @@janmarshalcoding Gotca, so supabase has limitations on its querying functions compared to Drizzle or Prisma.

  • @funnythings1283
    @funnythings1283 Місяць тому

    this is not a comment it just for me. 6:42:42

  • @Sub0x-x40
    @Sub0x-x40 3 місяці тому

    balzing fast, so fast that some of the letters in become jumbled

  • @smartdriver2990
    @smartdriver2990 3 місяці тому

    D

  • @zainn7336
    @zainn7336 4 місяці тому +2

    next js + convex + clerk >>>> next js + supabase + kinde

  • @muhammaduseram9405
    @muhammaduseram9405 3 місяці тому

    8:34:31 What was that😂❤

  • @kshitijtakarkhede7833
    @kshitijtakarkhede7833 4 місяці тому +1

    How to be good at design to code🥲

  • @RakibAhmed-n4m
    @RakibAhmed-n4m 4 місяці тому

    which vs code theme did you use?

    • @janmarshalcoding
      @janmarshalcoding  4 місяці тому +1

      Hey, I have a vid called: How to make VS Code 10x more productive
      There I show everything (layout, theme, extensions etc)

    • @RakibAhmed-n4m
      @RakibAhmed-n4m 4 місяці тому

      @@janmarshalcoding thank you

  • @AdrianFelismino
    @AdrianFelismino 4 місяці тому

    6:25