ASMR Programming - ChatGPT Bot Coding! - No Talking
HTML-код
- Опубликовано: 25 июл 2024
- Hello Everyone ✨I am starting a new series following the challenge of 100 days of code. i will create random apps, web apps, and all things that you need to know about javascript 😎
Become a Javascript Developer now with our 100 Days of Code javascript Development Bootcamp course!✅
day 31 - 100 days javascript coding ⚜️
Join the full "100 Days Of JavaScript Code - Web Development Bootcamp" course :
• 100 Days of JavaScript...
In this tutorial, I am gonna showing to you how to use chatgpt api to code a chatgpt bot with javascript. we create a project that you can ask anything from chatgpt with javascript❗️
Also we use Rapidapi in this bot too! we use official chatgpt api.
Day 31 - Source Code : github.com/AsmrProg-YT/100-da...
source of all projects also will upload in AsmrProg github page :
github.com/AsmrProg-YT
with this coding bootcamp you will learn how to be an javascript developer✅
Follow my 100 days of javascript playlist i will upload video's of javascript projects in it for easier access and video's in this playlist sorted by day 1 to day 100 😉
100 days of javascript Playlist : • 100 Days of JavaScript...
Every week i will update this playlist ✅
Video Contents :
00:00 - Intro (day 31)
01:03 - Warming hands
01:11 - Main codes
01:36 - Adding font and icons
02:28 - Html coding
04:12 - Main styles
04:39 - Header styles
05:19 - Container styles
06:10 - Info styles
07:04 - Input styles
08:32 - Button styles
09:44 - Main js codes
10:23 - EventListener
11:00 - sendMessage()
14:55 - Adding Api
19:25 - Response
21:07 - appendMessage()
24:27 - First tests
25:19 - Chat styles
27:55 - Final Result
Asmr Game Coding Playlist : • ASMR Game Coding
Other Video's :
Coding a Snake Game : • ASMR Programming - Cod...
Movie Guide App Coding : • ASMR Programming - Mov...
Coding IOS (IPhone) Dynamic Music : • ASMR Programming - Cod...
Subscribe → bit.ly/3Lf1K4A ✅
Subscriptions, good comments and likes are great support for me 😍
Don't re-upload or edit the videos on your channel.
All copyrights by AsmrProg.
About AsmrProg Channel :
Here I upload ASMR programming tutorials related to HTML, CSS, Sass, JavaScript, React, PHP, Frameworks such as Bootstrap and more along with creative UI/UX Designs.
AsmrProg is a community for web developers from all levels to learn and grow their skills in front-end and back-end web development.
AsmrProg
Asmr Prog
ASMR Programming
ASMR Coding
ASMR keyboard typing
ASMR web design
ASMR coding html
ASMR coding website
No Talking ASMR
No Talking Coding
No Talking Programming
in this video we use free chatgpt api key to code ChatGPT Clone Bot with backend 😉 Please LIKE video to support my channel 🙏❤
The app didn't work for me
Hey, is it normal that chat gpt is not answering, and the thing is, it even didn't saying Check ur api key! I thought that it is beaause, my bot is not trained well. Am i true? Please answer ! if someone else had the same problem, can u say please how to fix that?
You need to get your own api key and click on test endpoint to check it’s ok or no!
Hi, check your api key with test endpoint button on api site, then tell me answer 🙏
Create chat history.
i actually learn more about coding in these asmr videos then everywhere else on the internet lol just from seeing you actually code it
Thanks, support us with likes 🙏❤️
I never thought I'd be able to enjoy ASMR programming videos so much!
great job dude❤
Thanks bro, we need subscribers support, please like video’s 🙏❤️
You are doing an amazing job with your videos!😍✌ Thank you for putting in the time and effort to create such a valuable resource.
Thanks so much bro ❤️🙏
I really appreciate your work Prog😉
Thanks a lot, please LIKE video to support my channel 🙏❤️
really really nice idea of a video and well done as well! hope you have a nice day:)
Thanks, support with your likes 🙏❤️
css just makes everything look sooo clean
Yes 😁❤️
I might be new at coding, but watching this make me feel like heaven
Thanks 🙏❤️
super nice as always!!! Please!! can you teach us how to build a Beautiful Responsive Navbar with a toggle in asmr!!
Hi, yes we will have it in web design coding bootcamp playlist 🙏
masterpiece ... for this im waiting for and also for amazon or google clone too
Thanks, please like and share video to support us 🙏❤️
Good video (not seen yet but it's going to be amazing)! I liked the video.
Thanks 🙏❤️
@@AsmrProgYou're welcome
These videos make my day❤
Thanks, support with your likes 🙏❤️
Great Video, keep it up! 😉🔥
Thanks 🙏❤️
relaxing, learning, comfortable = AsmrProg ❤
Thanks a lot, support us with likes 🙏❤️😉
@@AsmrProg i put it before I entering the video
Thanks so much 🙏
Good job bro keep going❤❤❤👏🏻👏🏻
Thanks 🙏 support us with likes 😁
You're so kind bro, thanks
🙏❤️
This is a very good video, i really like it
Thanks 🙏❤️
Hello dude, nice chatgpt!👍 I have an idea for one episode, you can do a gps. Anyways that is my idea!!
Thanks so much 🙏❤️
@@AsmrProg No problem my friend!
🙏❤️
liked and subbed, so goodd
Thanks, python and js are two different categories! You need to know what you want to do!
@@AsmrProg ohh i see that explains a lot 😭😭 gotta do programming for school but i have no idea where to begin LOL ur vids helped me get a good idea of what it is though!!
@r6ri thanks a lot 🙏❤️
THANKS!
🙏❤️
How to make the page to autoscroll down and focus the returned bot message? At the moment I have to scroll down manually with a mouse. How to make it so the new bot message is in focus? Basically autoscrolls in my view.
For this option we need add event listeners for scrolling and for focus we can add box shadow to returned message 🙏
@@AsmrProg Would you mind making a community post, showing how it can be done? 🤞🕊
Maybe we will have it, need to check tips about it
This is great
Thanks a lot 🙏❤️
Bro it is showing error: check your api key how to solve?
what extension you use to have live server that auto updates when you type
Hi, live server extension 🙏
coucou vraiment merci pour tes videos mais stp comment trouver la clé API de cette video ( de ce code) si tu peut faire une vidéo complète dessus pour bien expliquer sa serrai formidable. cordiallement
Hi, watch video! I’m showing it !!
Tech Relaxation!
Thanks 🙏❤️
amazing 👏👏👏
Thanks 🙏❤️
Can you tell me the name of your cursor please
hi, can I have the complete set thx, love ur videos btw
Hi, set of what you want? Extensions or keyboard?!
amazing content
Thanks 🙏❤️
stupid question but how do you get the browser to automatically update like this, instead of always hitting the save button and refreshing the screen. your videos are amazing and love how you do most things with javascript and react, for what i can tell.
Hi, it’s live server extension 🙏
@@AsmrProg amazing! Thanks
🙏❤️
Hi bro, the cursor looks very good, what software do you use to make it looks like this?
Hi bro, it’s screen recorder effects!
@@AsmrProg really? I could assure you that it was an independent software to the screen recorder. so what screen recorder do u use?
It’s zd soft screen recorder
@@AsmrProg thank you so much brother
🙏❤️
are the API's removed? neither of them I can find
Hi, coding with different api is same as that i showed in video 😉
Awesome work dude❤❤....how many years you learn coding? And how 😢
Hi, more than ~7 years, with experience!
It's all about experience!
Yes!
nice video! can you share the color theme?
Hi, please check my GitHub, there is a repository about all of my vscode settings 🙏
Excuse me, I had a question, I wanted to know what device you use to film your keyboard, I mean that your camera support is T-shaped ?
Hi, it’s iphone 13 promax!
@@AsmrProg god , By the way, can you please tell me what program you use to record the desktop screen, thank you bro
Zd soft screen recorder
@@AsmrProg thank you so mach bro 🙏
🙏❤️
I just wondering what theme do you use?
Hi, please check my github, there is a repository about all of my vscode settings 🙏
I like your videos 😊
Thanks a lot 🙏❤️
What font do you have in your code editor?
Hi, Cascadia Code
@@AsmrProg Thank you for your quick response
🙏❤️😉
Hi bro, what's the background img, you have, being called? or can you give a link to it?
Hi, it’s colorful bg
@@AsmrProg umm, something more specific? bc there are many imgs with that name😅
Send message i will send it to you in telegram, link on channel about page 😉🙏
I am always getting "error: check your api key".
I have tried multiple api keys and also changed the host everytime , but still the same problem .
Hi, click on test endpoint in rest site and check its correct or no, then tell me!
Yes , I have checked . In the result, it says success.
So you sent request in wrong way!
i li
sten this video for keyboard sound🖤
🙏❤️
Hi can you make a drawing website the next video? im sure its going to be great to watch and useful!!!!!✨✨✨✨
Hi, what type of drawing?!
@@AsmrProg like painting website where you can draw with different colors
Oh ok, we will check it 🙏😉
@@AsmrProg thanks!
🙏❤️
bro when i paste my api code, it still didnt work. it says, chek my api key
Hi, in rapid api click on check endpoint and send me error!
I tested after i change my new api key it still say Error : Check Your Api Key!.
I use another API host but i also did change it too.
Anyway Very Great Job
If you change api key to another api host, you need to change post data!
after 5 days api key was not working what i can do it show your api key was not working???
Hi, this api keys are for test and have limits, if you want you need to buy it!
In which did you design this?
Hi, it’s 0 to 100 video, from design to js part!
I'm unable to find the api, pls share the link.
Hi, bro link available in video!
Hello sir, everything worked except the API thing, as you see I used a different ChatGPT API because the one that you use seems to be unavailable. So I changed the API key to the current one I'm using and the same to the API host. I also changed the fetch URL link. So I wonder if you could help me solve this problem, thanks :)
Hi, did you put new api settings and headers in your code?
@@AsmrProg Yea I did, all I did was copy and paste the API key, host, and content type into my code
hello Reza , my api through (400) error as bad request what is issue ? here plz me ?
Hi, did you replace your own api key?
@@AsmrProg nope i exactly copy and paste my API key and method from rapidapi through sign in official website !
asmr prog can u help me api key error i cant fix it
edit: chatgpt is not available in my country. Does this have anything to do with it?
It’s with another official api! Watch video and do it 😉
"Hello, my friend! I really appreciate your videos and I am truly fascinated by them. 😂 How did you manage to improve yourself in software development? I would be very happy if you could share a video explaining that."
Hi, thanks 🙏 just experience and experience!! Always watch tutorials to improve yourself 😉
@@AsmrProg Thank you 🙏, I am struggling a lot while trying to establish a new algorithm. Has this happened to you as well?
Yes, but with more experience you will be ok 😉
@@AsmrProg i believe that , thank you so much 🙏😊😊
Keep going on 😉🙏
I did do the code, but it's showing 'Error : Check Your Api Key!' , How I can solve that?
Please Reply
Hi, we revoked api key after video, you need to create your own api key!
same i already got me own api from RapidApi
Get a new api key with a new account and check it!
Hello, the api youve used in the video seems to not exist anymore. Is there another one that I can use?
Hi, you can use same api, in video i showed how!
@@AsmrProg Hi! I've entered the link and nothing appeared for both of the apis. Do you know why?
@hxmbt2 api links changed, maybe i will record a new video for it 😉
@AsmrProg okay thank you!
@hxmbt2 🙏❤️
its catching api error i did copy api correctly what do i do?
Hi, check api with test endpoint, if it doesn’t work your api have problem!
I'm getting a "bad request" error along with a return of the following object: {error: "missing_required_parameters"} But I am copying the exact code that is in RapidApi, along with my key
Which api you use? Official?!
@@AsmrProg no, the chatGPT53
Can you send source to me? Telegram link on channel about page
Hello sir,
I watch all your 100 days of JavaScript videos.
I want to learn game development by you.
Can you teach me to make 3d games
Hi, 3d games will upload in a new playlist soon in the future 😉🙏
I'm so excited 😆
🙏❤️
im so confuse does not work for me
What’s problem?!
Please keep the video up-to-date PLEASEEEEEEEEEE!!!
Hi, yes we will update it soon 😉🙏
what kind of background???
Glassit extension 🙏
Mine didn't work, I don't know why.
I even copied every single code to make sure but still didn't.
Can any one help me or have the same problem?
Edit:
It worked just with chatGPT "X-RapidAPI-Key" but not with OpenAI😢
Hi, you need create your own api key from rapidapi site
I did, and copied it to my Key but it shows me an error when I write something to the bot!
What’s error!?
It says: check your Api Key!
Also that the code (Api Key) doesn't work for me.
Can you make a video about php
In the future, when we start wordpress template coding 😉
what is font?
Hi, Cascadia Code font
You're cool!
Thanks 🙏❤️
Hey brother can you please make asmr videos using other programming language, not js, html, css😅😅 🥺
Hi, no! Because this channel is about web development!
Nah bro just got roasted in just one sentence💀💀 that crazy
@HammondCoder 🙏❤️
so i cant find the chatgpt you used to subscribe, so i used another one in that , still it reverts an error "check your api key" but it is correct.
Why! If you want to use another you need to change fetch headers!
That's also done, still doesn't work
@A_Aadit click on test endpoint in rapidapi, check it’s showing success or no!?
@@AsmrProg it's a success
So problem is from your coding!
I am copy this hehe
Great! 🙏
@@AsmrProg Hi mr Reza, I am from Indonesia, still a high school student, I dont have a card to buy an API, can I find a free chatgptAPI? hehe
Free ones are limited, you can use that api im used in video 🙏
@@AsmrProg okey thank you Mr Reza 😇
@NiqueeDev 🙏❤️
What Vscode theme ?
Hi, in this video firefly pro
@@AsmrProg how can i change my background like urs?
It’s glassit extension
And make a download button, I need That!
Hi, download button on this source or another video?!
@@AsmrProg Another video, please?
We don’t will have just a button video! But we will have it in our complete sites tutorials!
I have a suggestion for everyone: use model for not even the official api, it will only work then.
With official works too, check my GitHub to know how!
@@AsmrProg official api is unavailable as of now
Both tutorials available in this video!
@@AsmrProg my point is: you said we need to add model for official api, I am saying we need to add model for even the unofficial API to make it work,
Maybe they updated api!
Hey! i am having troubles with that api can you please help me?
Hi, what’s problem?!
@@AsmrProg check the api error
@ShubhamLeo did you checked my source?!
@@AsmrProg which source?
@ShubhamLeo link on description
api key is true but i got error its succes endpoint?
Did you checked my source code?!
@@AsmrProg yes i copied it and same error
Click on test endpoint in rapidapi, still error?
@@AsmrProg yes!
So problem is from your api!
The best thing ive seen today, Thank you 🫡
🙏❤️
kaybord🥰, mouse💀
🙏❤️
Hi guys I want to learn code but I don't have money to buy courses so if you know of any sites where I can learn for free help me😅😅
W3school site and youtube channels + solo learn application 😉
@@AsmrProg thanks you are the best
🙏❤️
Free bootcamp ☝️
Maybe yes!
I have the api key but the bot tells me no
Check api key working in rapidapi site 🙏
how do I do that
In rapidapi click on test, available in video
my apo key was not official, that may be why it doesn't work for me
Api*
First commentttt
Thanks, please LIKE video 😉🙏❤️
😐
🙄🙄
@@AsmrProg sarcasm
Maybe I'm a little toxic or I don't understand something, well, ok, without negativity😉
Comment contacter vous stp!!
Sorry!?
Bro try something unique, i am bored of this things, do using js, not css design😅😅 hope fully you do
Hi, we have js in it, it’s not only css design!
@@AsmrProg I am not mean of css design, i mean that building chatgpt and other stuff is doing every one so make some unique
Oh ok 🙏
Is that pythone?
bruh, how's that python you can clearly see that's JavaScript
The app didn't work for me
Hi, did you created your own api key?
@@AsmrProg I didn't know how to explain you excellent my friend but I didn't know how to remove it
Remove what!? Check my source code link on description
@@AsmrProg The problem still exists
Send message to me on telegram to fix it, link on channel about page 😉
the future is artificial intelligence
Maybe!
Create website online shopping
Hi, complete sites tutorials soon 😉
Okay thanks 😊
🙏❤️
bro why did you delete my comment?
I didn’t deleted anyones comment, youtube doing it ☹️
ur junior dev? :)
Maybe 🙄
@@AsmrProg I noticed you don't type too fast haha, sorry I didn't mean to offend you.
🙏❤️
System.out.println(“ASMR”);
😉🙏❤️