Vue JS 3: Hide your API Key with Node.js, Express & Dotenv

Поділитися
Вставка
  • Опубліковано 2 лют 2025

КОМЕНТАРІ •

  • @MakeAppswithDanny
    @MakeAppswithDanny  3 роки тому +1

    Please Like, Share, Subscribe & Comment - it all helps me create more content for you!
    👉 My Courses: dannys.link/courses
    👉 Download Fudget: www.fudget.com
    👉 My VSCode Setup: dannys.link/vscodesetup
    👉 DONT CLICK THIS: dannys.link/dontclick

  • @brandonsayring
    @brandonsayring 3 роки тому +2

    Very under appreciated channel.
    Thanks for all the tips, Danny.
    Also the best line: 17:10

  • @jensluck370
    @jensluck370 3 роки тому +2

    Wow, great topic for every Vue developer. Thank you Danny for another great video.

  • @RindiBudiaramdhan040490
    @RindiBudiaramdhan040490 3 роки тому +1

    its so easy to follow. thank you, Danny

  • @maskman4821
    @maskman4821 3 роки тому +1

    This is a terrific tutorial, I have learned a lot, now I know in order to hide api key from end users we have to put the key in backend route. fand I have successfully built this project with Nuxtjs which we can handle both frontend and backend in a single server. Anyway thank you for this awesome tutrial !!!

  • @AndreLarangeira
    @AndreLarangeira 3 роки тому +3

    Thank you Danny, this is exactly what I'm looking for!

  • @clcserra
    @clcserra Рік тому +1

    Very well done. Thanks for sharing

  • @dannarsavage2920
    @dannarsavage2920 3 роки тому +1

    This was a really good intro to Vue for me so thanks. But I had to chuckle when you hid your API key by making the call from your server but then set no bounds on its use with CORS headers. Now no one can KNOW your API key, but everyone can write applications to USE it (as long as all they want is to query that API by city name)! :)

  • @dekebaoe
    @dekebaoe 3 роки тому +2

    Thanks Danny. Great as usual!!

  • @rizwan.ahmad.qureshi
    @rizwan.ahmad.qureshi 2 роки тому +1

    That's great, Thankyou danny for this amazing video

  • @chantelpunt5698
    @chantelpunt5698 3 роки тому +1

    This was exactly what I was looking for. Thanks so much :)

  • @timelord404
    @timelord404 3 роки тому +2

    28:22 -> what gives people feelings of power? -> predicting a food taste < predicting the Weather < predictng a CORS error in an youtube tutorial

  • @cacup7
    @cacup7 3 роки тому +1

    Here goes my Vue hero. Great Video

  • @mitjasiska
    @mitjasiska 3 роки тому +1

    Thank you for great content! I like your clear and detailed explanations. 👏

  • @aldobangun223
    @aldobangun223 3 роки тому +1

    Very Useful thanks Sir 🤩🤩

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

    Amazing video. But, how do you protect your backend from someone trying to make requests directly to it instead of using your frontend page?

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

      Thanks. Good question. You might need to add some sort of authentication to the front end 👍

  • @shirounurimba6898
    @shirounurimba6898 3 роки тому +2

    Thanks for the video!

  • @rangabharath4253
    @rangabharath4253 3 роки тому +2

    awesome as always :-)

  • @ExequielGomez10
    @ExequielGomez10 Рік тому +1

    Love ur videos. Its this posible (hide some secrets properties) with a serverles app like the ones with Firebase?

    • @MakeAppswithDanny
      @MakeAppswithDanny  Рік тому

      Thanks Exequiel. I don't think so, because the api details need to be in the client in order for Firebase to work. This is why it's so important to have very solid security rules in Firebase. 👍

  • @enriquecarbo9096
    @enriquecarbo9096 3 роки тому +1

    Thank you sir

  • @mehmetilhan4306
    @mehmetilhan4306 3 роки тому +1

    Thanks for video

  • @kobadg
    @kobadg 2 роки тому +1

    Ok so..
    How do you handle this now? Because I get issues with requesting over non-ssl. Like... do I need to make the nodejs/express server publically accessible...or something?

  • @SmoothLife
    @SmoothLife 3 роки тому +1

    Hi Danny, thanks for this video. Now I'm wondering how and where to deploy the backend when the front-end is deployed in Netlify?

    • @MakeAppswithDanny
      @MakeAppswithDanny  3 роки тому

      Good question! There are tons of options. I've used Heroku in the past for demo apps 👍

  • @GeorgeVoulgaris7
    @GeorgeVoulgaris7 3 роки тому +1

    You Rock dude!

  • @phojie6868
    @phojie6868 3 роки тому +2

    thanks danny

  • @pakinnoisena2837
    @pakinnoisena2837 3 роки тому +1

    Hello Danny, great video, and this is what I am looking for. However, my req.query is empty, do you have any solution for that? Thank you

  • @buddhanag4987
    @buddhanag4987 3 роки тому +1

    Quality content

  • @Thomas-mm5fr
    @Thomas-mm5fr 2 роки тому +1

    This doesn't help much when you dont protect calls to the backend?

  • @RiazUddinMasum
    @RiazUddinMasum 3 роки тому +1

    this is awesome

  • @alphacentorus
    @alphacentorus 3 роки тому +1

    Nice video you could use Nextjs

  • @aissamelhouref1783
    @aissamelhouref1783 3 роки тому +1

    I was working like this in nuxt Js and really don't know can do it in vueJs.. thanks its helper

  • @AndrzejIgnatowicz
    @AndrzejIgnatowicz 3 роки тому +1

    Awsome! As always very informative and an excellent, fast and intelligent way of explaining things. The next question: how to to secure our REST endpoint/s from other praying eyes peeking into Developer Tools? Now it's more insecure than ever I suppose. I'm open for proposals/discussion. Thanks Danny!

    • @MakeAppswithDanny
      @MakeAppswithDanny  3 роки тому

      Thanks Andrzej! I'm not sure if that's possible. The browser will log all requests that the app makes, as far as I know.

  • @ignaciolabra1025
    @ignaciolabra1025 3 роки тому +1

    Hi Danny, won't you upload videos with Quasar and vue3 ?, next.quasar.dev/. Yesterday I installed it as a plugin in a vue3 project and it worked very well.

  • @mithudas6873
    @mithudas6873 3 роки тому

    Would you please make a tutorial about LinkedIn clone with vue js please!!!!
    From Bangladesh... ❤️

  • @KangJangkrik
    @KangJangkrik 3 роки тому +1

    The only way to perfectly hide API is by storing encrypted API key with its passkey somewhere at the source code

  • @one-anachronism
    @one-anachronism 3 роки тому +1

    It's still unsecure ... But with few extra steps :( ... Now the hackers will abuse my precious APIs more easily (without any key) through my proxy middle API (at backend)

    • @one-anachronism
      @one-anachronism 3 роки тому +1

      Only one endpoint although ... So that's the bright side :)

    • @MakeAppswithDanny
      @MakeAppswithDanny  3 роки тому

      😂 👍

    • @Jorgeee
      @Jorgeee 2 роки тому

      You can make your api work only with your website or ip address