🔴 Let’s build a DALL·E Image Generator with REACT.JS! (Chat GPT, Next.js 13.2, Microsoft Azure, TS)

Поделиться
HTML-код
  • Опубликовано: 20 ноя 2024

Комментарии • 90

  • @SonnySangha
    @SonnySangha  Год назад +4

    ❗ Sign up to get the Code for FREE here (Form must be submitted, not skipped!) 👉 aka.ms/Sonny

    • @JackpotTFT
      @JackpotTFT Год назад

      Could you make a tutorial on making an online live auction webite like ebay, theirs basically no good videos on youtube about it

  • @kelvintam2023
    @kelvintam2023 Год назад +2

    For those who are having issue with data not updating after refresh with the latest Next.js 13 version, add the following line on top of every class/file (EXCEPT those in the 'azure' folder) that has used 'fetched()':
    export const dynamic = 'force-dynamic';

  • @akhil5130
    @akhil5130 Год назад +2

    Your vibe and energy its just awesome when ever i start building your projects i can sit for hours without burnout .Your explanation to concepts is awesome.

  • @AleksandrLubovskiy
    @AleksandrLubovskiy Год назад +2

    I must say that I found this tutorial quite challenging compared to others on this channel. While I was able to complete other projects without any problems, I struggled to repeat the code provided in this tutorial, but can't handle even with repository.

    • @willowPAPA
      @willowPAPA Год назад

      I can't seem to fix a problem with getting a 200 error from the chatgpt suggestion, even when I copy code from the repo to find what i could've messed up

  • @nocopyrightgameplaystockvi231
    @nocopyrightgameplaystockvi231 Год назад +1

    That intro music just sets the environment a different vibe. Thank you for this.

  • @PattySpicy
    @PattySpicy Год назад +9

    OMG! Couldn't believe how amazing of this build ! Sonny x azure is incredible joint venture !
    the tutorial is fun ,Joyful and worth every minute to learn from. Only here we can find such meaningful learning material !!! #PAPAFAM !

  • @dalestewart
    @dalestewart Год назад +1

    Another thumbs up with respect to debugging Microsoft Azure blob storage👍👍

  • @ultimatemanshed
    @ultimatemanshed Год назад

    Thanks
    I am a very old fart who knows nothing about coding but Listening to you inspires me to learn how to turn the dam computer on by myself.. You rock
    Alan from Christchurch new Zealand

    • @SonnySangha
      @SonnySangha  Год назад

      That’s awesome thank you for sharing & supporting Alan!!

  • @dalestewart
    @dalestewart Год назад

    Thumbs up with respect to showing things visually.👍👍👍

  • @МаксимЕремин-з7с

    Sonny, hi, please turn on the subtitles, I'm from another country watching your cool videos, I'll be grateful

  • @kevinzebb
    @kevinzebb Год назад

    pretty cool, I'm having a better understanding of react, next.js and tailwindcss overall with these videos, much more personal than other videos which assume you already know a bunch of stuff.

  • @Deepsouthbro
    @Deepsouthbro Год назад

    I am a member of the PAPA-Github-Repo but don't see this on the site? Is this repo not available?

  • @tommywarren7491
    @tommywarren7491 Год назад

    Such notification many playfulness so fantastic

  • @arturolatorre371
    @arturolatorre371 Год назад +1

    We need more Microsoft stuff, Sonny! Great job as always!

  • @beingwhale
    @beingwhale Год назад +1

    You nailed it fam

  • @kaszapnagypeter
    @kaszapnagypeter Год назад

    Hi Sonny! Your videos are awesome! I started using typescript, and I remember that, you mentioned a trick how can you see the type of something in visual studio code, but I forgot the key combination. What was it?😀

  • @dalestewart
    @dalestewart Год назад

    Already thumbs up and I've only watched 21 minutes👍👍

  • @marcusbackendorf5360
    @marcusbackendorf5360 Год назад +1

    Wow, such a great tutorial. Just found your channel a couple of weeks ago and already did 2 tutorials, I am becoming a big fan of the #PAPAFAM. Sonny, just a question, the server JASONkeeper where you had some APIs seems to be down for a couple of weeks now. Could you upload the APIs for Airbnb 2.0 somewhere else? I was so close to finishing it when the server got offline. I am grateful for your ability to share knowledge! Keep up the great work. THANK YOU

    • @SonnySangha
      @SonnySangha  Год назад

      Thank you so much!!! Ill take a look at that when I get a chance dude! #PAPAFAM

  • @mariummagdy4359
    @mariummagdy4359 Год назад

    congrats you really deserve it

  • @JordanFemi-Bella
    @JordanFemi-Bella Год назад +1

    Amazing stream 😊😊

  • @6little6fang6
    @6little6fang6 Год назад

    sir, i have a queshtion sir 🤓 Where do we use the generateSASToken azure function endpoint? I cant recall.

  • @movietime5333
    @movietime5333 Год назад

    that part with generate image and download it does not work for me

  • @igo973
    @igo973 Год назад

    RESPECT FOR ALLL EXPLAANES!
    THANK YOU.

  • @mandarliev
    @mandarliev Год назад +7

    does someone else receive a fetch error when console.log(suggestion) on 1:37:44

    • @Guztawh
      @Guztawh Год назад

      yes i do.

    • @siddharthgautam6081
      @siddharthgautam6081 Год назад

      Did you resolve this issue??

    • @mandarliev
      @mandarliev Год назад

      @@siddharthgautam6081 No. I started the project all over again, but apparently when I try to access my local endpoint localhost:3000/api/suggestion it doesn't work at all even after restart

    • @siddharthgautam6081
      @siddharthgautam6081 Год назад

      @@mandarliev yeahh....but in sonny video I don't know how did the error is not popping...

    • @mandarliev
      @mandarliev Год назад

      @@siddharthgautam6081 At first it worked for me too and the site was accessible. However after sometime I couldn't reach it. I think it has something to do with api routes in nextjs 13.2

  • @6little6fang6
    @6little6fang6 Год назад

    mister, do more azure builds, pls mister 🥺

  • @vitaliy794
    @vitaliy794 Год назад +1

    Hello. I have been following your content for half a year now and developing with you. I want to join your community, but how can I pay for your subscription from Russia if our card does not work? Can you help with this?

    • @SonnySangha
      @SonnySangha  Год назад

      Hey! Email us at support@papareact.com and we'll help you out with that - we accept crypto too!

  • @jasonelechi9149
    @jasonelechi9149 Год назад

    Hey everyone, I’ve completed the Ai image generator build today and everything works fine on my local host - even after deploying azure functions. However, when I deploy to vercel - production, my site doesn’t seem to able to get new suggestions or images?? It’s literally stuck on the same suggestion and same set of images post deployment. Did anyone experience this? How did you solve it? Thanks

    • @AbhishekSharma-wq6eu
      @AbhishekSharma-wq6eu Год назад

      did you find the solution!?

    • @kelvintam2023
      @kelvintam2023 Год назад

      ​@@AbhishekSharma-wq6eu @jasonelechi9149 add this line on top of every class/file EXCEPT those in the 'azure' folder that calls the fetch() function:
      export const dynamic = 'force-dynamic';

    • @kelvintam2023
      @kelvintam2023 Год назад

      See my other comment

  • @ashusnapx
    @ashusnapx Год назад

    at 1:35:00 i'm getting the same error, ie. error 429, i've even tried changing my api key and organization, but still the same issue persists🙂

  • @kingsTech007
    @kingsTech007 Год назад

    Hi, how can I run
    this code?

  • @dizaas7918
    @dizaas7918 Год назад

    I got this error how to resolve
    ai-image-generotor-ms\azure> npm start
    > azure@1.0.0 start
    > func start
    'func' is not recognized as an internal or external command,
    operable program or batch file.

  • @nat0110tan
    @nat0110tan Год назад

    Thank you so much! I follow the video but I get stuck on the openai part(1:35:19). I got Error 429 and I tried all my 4 google accounts to get the openai key. I double checked each of them but it just didn't work. I'm sure my codes are the same as the github repo. Could you give me some suggestions? Thanks :)

    • @DeepKumar-sk1ns
      @DeepKumar-sk1ns Год назад

      Try a new email address with a new phone number attached to it. A different email id attached with a same phone number may not work. For example try your friends email or try a different email which is connected to a different phone number you have

  • @paydrostylin7167
    @paydrostylin7167 Год назад

    azure is being picky about the type of credit card/ debit card I'm using even though its a free account and not going to be charged anyway...🤦

  • @Zahid110-r7u
    @Zahid110-r7u Год назад

    Sonny I love your projects but actually thing is that I was making News app and I error has came out and I sticked my mean that plz give me news repo access like this project ❤❤❤

  • @smartdroidpraveen5275
    @smartdroidpraveen5275 Год назад

    use client not working can you help me

  • @sayanmanna2511
    @sayanmanna2511 Год назад

    Timestamps?

  • @mariacristinaarezzi
    @mariacristinaarezzi Год назад

    hello

  • @mariacristinaarezzi
    @mariacristinaarezzi Год назад

    hELLO

  • @chrisfox1032
    @chrisfox1032 Год назад

    Why did this gobble up my £200 free credit? Now I cant continue! I got so far as well. Very disappointed

    • @brayancuenca6925
      @brayancuenca6925 Год назад

      Often times it’s because your free credit tokens are expired. Just add a payment method and you’re good to go.

  • @michaeldonchima8364
    @michaeldonchima8364 Год назад

    35:20

  • @gpse-trackshippingltd2573
    @gpse-trackshippingltd2573 Год назад

    Repy

  • @SuperPompey77
    @SuperPompey77 Год назад

    Great project but i gave up because Microsoft is such a problem with signing in. I entered in my password correctly. I know I did because i use it for all other google cloud functions but Microsoft keeps telling me its a wrong password. Its NOT! They need to fix issues like this before i ever use Microsoft again. Back in the day i had the same problem with xbox live and so i canceled that and it looks like they have not learned from it.

    • @geraldmaale
      @geraldmaale Год назад

      If your password is wrong, it's wrong. Stop blaming Microsoft for your own doings.

  • @BinaryBytess
    @BinaryBytess Год назад

    Hey @SonnySangha
    so I followed the tutorial and everything works perfectly in local environment but when I pushed it using vercel --prod, the app gets deployed and Use Suggestion and Generate buttons seem to be working but New Suggestion, Refresh Images, and the fetching of new images is not working!! It's as if the images displayed only get run on deployment and not update after that! HELP !!

  • @amandekate1411
    @amandekate1411 Год назад +2

    Executed 'Functions.getChatGPTSuggestion' (Failed, Id=f16713f2-0df1-4090-b379-2f4bded07c5b, Duration=303ms)
    [2023-04-02T19:22:50.820Z] System.Private.CoreLib: Exception while executing function: Functions.getChatGPTSuggestion. System.Private.CoreLib: Result: Failure
    Exception: Request failed with status code 401
    Stack: Error: Request failed with status code 401
    at createError (G:\ai-image-generator
    ode_modules\axios\lib\core\createError.js:16:15)
    at settle (G:\ai-image-generator
    ode_modules\axios\lib\core\settle.js:17:12)
    at IncomingMessage.handleStreamEnd (G:\ai-image-generator
    ode_modules\axios\lib\adapters\http.js:322:11)
    at IncomingMessage.emit (node:events:525:35)
    at endReadableNT (node:internal/streams/readable:1359:12)
    at process.processTicksAndRejections (node:internal/process/task_queues:82:21).

    • @dizaas7918
      @dizaas7918 Год назад

      I also got this error. unable to find method to solve it

    • @factshubonly
      @factshubonly Год назад

      same error

    • @dizaas7918
      @dizaas7918 Год назад

      @@factshubonly did you solve

    • @dancrha5978
      @dancrha5978 Год назад

      have you found a solution?

  • @DeepKumar-sk1ns
    @DeepKumar-sk1ns Год назад +7

    Anyone getting this error while trying console.log(suggestion)
    error - TypeError: fetch failed
    at Object.fetch (node:internal/deps/undici/undici:11404:11)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
    cause: Error: connect ECONNREFUSED ::1:7071
    at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1494:16)
    at TCPConnectWrap.callbackTrampoline (node:internal/async_hooks:130:17) {
    errno: -4078,
    code: 'ECONNREFUSED',
    syscall: 'connect',
    address: '::1',
    port: 7071
    }
    }

    • @siddharthgautam6081
      @siddharthgautam6081 Год назад +1

      Yes, I almost spent my whole day searching for a solution but didn't get it...🙂 If anyone has overcome this error please reply...

    • @Guztawh
      @Guztawh Год назад

      Yes. spent the day trying to solve it. did u find a solution?

    • @robertodelgado1234
      @robertodelgado1234 Год назад +1

      Stuck here. I'm able to call the Azure endpoint just fine in the browser, but the fetch function gives the error - TypeError: fetch failed.

    • @robertodelgado1234
      @robertodelgado1234 Год назад +4

      UPDATE: For those still struggling with this. What I did was continue until Sonny deployed the functions to Azure. Once you replace the localhost:7071 endpoints with the deployed URL's for each function, the app should work. I also hid the deployed URLs by putting them in my .env.local file like so: `${process.env.IMG_GENERATE}` Hope this helps.

    • @Guztawh
      @Guztawh Год назад +1

      @@robertodelgado1234 i will try. Thank u so much for sharing

  • @mariacristinaarezzi
    @mariacristinaarezzi Год назад

    Hello