How to Upload Images in React / Next.js (File Uploads, Filestack)

Поділитися
Вставка
  • Опубліковано 1 чер 2024
  • Check out the sponsor Filestack and get 1GB in free bandwidth: tinyurl.com/ByteGradFilestack
    Hi, I'm Wesley. I'm a brand ambassador for Kinde (paid sponsorship). Check out Kinde for authentication: bit.ly/3QOe1Bh
    👉 NEW React & Next.js Course: bytegrad.com/courses/professi...
    👉 Professional JavaScript Course: bytegrad.com/courses/professi...
    👉 Professional CSS Course: bytegrad.com/courses/professi...
    👉 Discord: all my courses have a private Discord where I actively participate
    🔔 Email newsletter (React + Next.js course out soon!): email.bytegrad.com
    ⏱️ Timestamps:
    0:00 Image / File uploads
    0:57 Top 8 obstacles
    2:01 Pro solution: Filestack
    2:39 Demo intro
    3:10 Filestack upload & download
    11:07 Filestack transformations
    14:12 Webhooks
    14:47 Serverless functions
    20:53 Signed URLs
    33:58 Scalable, serverless uploads with Filestack
    #webdevelopment #programming #coding

КОМЕНТАРІ • 21

  • @ByteGrad
    @ByteGrad  7 місяців тому +1

    You can check out the sponsor Filestack and get 1GB in free bandwidth here: tinyurl.com/ByteGradFilestack

  • @ozgursar5386
    @ozgursar5386 7 місяців тому +3

    Thank you for the tutorial. It would be nice if you demonstrate how to do a similar functionality without using Filestack, but instead storing files at Supabase with a simpler UI.

  • @klaudiuszbiegacz3519
    @klaudiuszbiegacz3519 8 місяців тому +2

    Great content as always Wesley! Can't wait for October 30

  • @YalreadyKnowit
    @YalreadyKnowit 8 місяців тому

    React documentation for filestack is LIGHT so thanks for doing this video

  • @venicebeachsurfer
    @venicebeachsurfer 8 місяців тому +1

    In regards to "external" images and having to hard code height/width. What about responsive? How would you handle dynamic values here?

  • @dhirajavasthi6539
    @dhirajavasthi6539 6 місяців тому +1

    hey ByteGrad your content is very helpful can you please help me with the below problem using zod and next js 13 or 14
    problem : How to read content of uploaded json file on react / next.js 13 or 14 using zod

  • @pixyoutube538
    @pixyoutube538 8 місяців тому +1

    Thank you 😊

  • @fnandesrafael
    @fnandesrafael 8 місяців тому +1

    There's any way to customize the Picker UI?

  • @WilliamShrek
    @WilliamShrek 7 місяців тому +1

    This is cool!

  • @zunnoorainrafi5985
    @zunnoorainrafi5985 7 місяців тому

    filestack-react is not installing and giving errors in terminal , npm of filestack-react is last published in 2021.

  • @Ash-fc3lp
    @Ash-fc3lp 5 місяців тому

    This is a great example, but the images are not persistent and are removed on refresh - I thought the idea of FileStack is that they store the image and it is persistent in the website !!!

  • @williamcao5139
    @williamcao5139 8 місяців тому +1

    When do you release react course ?

    • @ByteGrad
      @ByteGrad  8 місяців тому +2

      Will be launched on October 30! :)

  • @buddy.abc123
    @buddy.abc123 8 місяців тому +3

    Man...Americans have so many options

  • @brajagopalmukherjee1588
    @brajagopalmukherjee1588 8 місяців тому +1

    Can we get neew react course on udemy?

    • @ByteGrad
      @ByteGrad  8 місяців тому +1

      Sorry, it will only be available on ByteGrad.com

    • @bukkeiedwin2125
      @bukkeiedwin2125 8 місяців тому

      @@ByteGrad Hello, I am looking to buy the CSS and Javascript course, I took a look on udemy and your website, do we also get a certificate on ByteGrad?

  • @FaizSultan430
    @FaizSultan430 8 місяців тому +1

    when your nextjs course coming

    • @ByteGrad
      @ByteGrad  8 місяців тому +2

      October 30. Make sure you’re on the email list ;)

  • @zlackbiro
    @zlackbiro 7 місяців тому +2

    Why nobody talks about how to build your own backend where you are the owner of your photos, not some third party service from where you dont have a control how to backup, reuse, or something else. Why cloud everything? Why teaching programmers to be a users, not a real programmers. The world will collapse one day and none of you wont be able to create your own custom shit! Learn real programming and how stuff works. Make your own god damn CDN! Where is the spirit?