JWT Authentication for React and FastAPI (easy with code)

แชร์
ฝัง
  • เผยแพร่เมื่อ 4 พ.ย. 2024

ความคิดเห็น • 26

  • @yadavakash2609
    @yadavakash2609 6 หลายเดือนก่อน +6

    This is called the perfect timing, I was struggling to authenticate user in protected pages. Thanks to you and your precise explaination, I got the answer.

    • @codingwithroby
      @codingwithroby  6 หลายเดือนก่อน +1

      You're so welcome! Keep the grind going 🙂

  • @herozero777
    @herozero777 2 หลายเดือนก่อน

    Very perfect timing for me too. A while back I got into React and FastAPI combo watching your tutorial and now this step was missing. Thanks for this man! Much Appreciated.

    • @codingwithroby
      @codingwithroby  2 หลายเดือนก่อน

      Great to hear! Cheers!

  • @souzafelix
    @souzafelix 6 หลายเดือนก่อน +1

    Nice video! I had just created a fastapi+react authentication routes and your example gave me ideas to refactor some parts

    • @codingwithroby
      @codingwithroby  6 หลายเดือนก่อน

      That's great! Keep on coding 🙂

  • @fooktu
    @fooktu 6 หลายเดือนก่อน +3

    Overall great video!
    What is missing here is showing how to secure enpoints in the fastapi so that they are protected and how to make queries on the frontend to those enpoints (how to include token etc).

    • @codingwithroby
      @codingwithroby  6 หลายเดือนก่อน +2

      Great suggestion! What you want to do is use a UserDependency on the BE and add Authorization: Bearer as a header on the FE.

    • @theverbalremedy
      @theverbalremedy 3 หลายเดือนก่อน

      Hi ​@@codingwithroby..could you make a video on how to do this please as its such a common occurrence? Most FastAPI applications are not on localhost, they're often hosted (e.g. on EC2) where theyre exposed for anyone to access. Then a React app calls the endpoint. Can you show how you protect these FastAPI endpoints (eg with Tokens) and havr a React app call it?

  • @losdel21
    @losdel21 2 หลายเดือนก่อน

    CORS is not really for protecting the server, it is something implemented in the browser to avoid pages making cross-requests. You can download a plug-in for firefox to ignore CORS headers for example.

    • @codingwithroby
      @codingwithroby  2 หลายเดือนก่อน

      Thanks for the additional context that can help others!

  • @Andromeda26_
    @Andromeda26_ 5 หลายเดือนก่อน +1

    Great as always! It would be great too if you deploy them on Vercel or AWS.

    • @codingwithroby
      @codingwithroby  5 หลายเดือนก่อน

      I have a vercel video on here - I have a full AWS deployment course coming soon!

  • @1mrnewton
    @1mrnewton 6 หลายเดือนก่อน +1

    Nice video! Can you share which vscode theme you use?

    • @codingwithroby
      @codingwithroby  6 หลายเดือนก่อน +1

      One Dark Pro - it is an extension 🙂

  • @loupa6128
    @loupa6128 6 หลายเดือนก่อน +1

    Nice video. If I have a lot of pages that only an authenticated user can access, do I need to place the code of `useEffect` in each component?

    • @codingwithroby
      @codingwithroby  6 หลายเดือนก่อน

      Thanks! Yeah you do - another way is to have the component sit inside a parent and the parent redoes the useEffect each time

  • @aTr41n95
    @aTr41n95 6 หลายเดือนก่อน

    Thank you so much. This video was perfect. A+++++++

    • @codingwithroby
      @codingwithroby  6 หลายเดือนก่อน

      Glad you liked it! Woot !!

  • @Ziv-dw3mn
    @Ziv-dw3mn 6 หลายเดือนก่อน

    Great video, i would suggest stop using create react app and use vite instead (So much faster)

    • @codingwithroby
      @codingwithroby  6 หลายเดือนก่อน +1

      Thanks for the tip! I just started looking into vite for my future videos 🙂

  • @OpenDeepLearning
    @OpenDeepLearning 6 หลายเดือนก่อน +1

    God bless you!

    • @codingwithroby
      @codingwithroby  6 หลายเดือนก่อน +1

      I am glad you enjoy it 🙂

  • @Gelozo
    @Gelozo 4 หลายเดือนก่อน

    ty!