Creative JS Coder
Creative JS Coder
  • 253
  • 565 741
Mastering the JavaScript Fetch API: .then() vs. async/await
In this tutorial, you will learn how to use the JavaScript Fetch API for making HTTP requests, a powerful feature that allows you to interact with servers and retrieve data from web APIs. We will cover two popular methods for handling the asynchronous nature of Fetch API:
Using .then(): A conventional approach where we chain promise-based methods to handle asynchronous operations.
Using async/await: A more modern and cleaner way of writing asynchronous code that makes it look and behave more like synchronous code.
By the end of this tutorial, you'll understand both techniques and know when to use each one effectively. Whether you're a beginner or an intermediate developer, this tutorial will help you solidify your understanding of JavaScript's asynchronous handling in real-world applications.
TimesCode:-
0:00 - Intro
0:05 - Overview
1:20 - Conventional .then()
11:04 - async / await
Other Tutorials:-
1. Weather App using HTML CSS and JavaScript fetch API: th-cam.com/video/hyhhNQotZo4/w-d-xo.html
2. Showing All Countries Info inside Bootstrap5 DataTables using Bootstrap5 and JavaScript Fetch API: th-cam.com/video/6_0AFZcTRGw/w-d-xo.html
3. How to create autocomplete input dropdown list using HTML CSS and JavaScript: th-cam.com/video/5xrNMlLkfso/w-d-xo.html
4. Country Guide App | Autocomplete input dropdown | JavaScript API Project: th-cam.com/video/nyH0qsKydvE/w-d-xo.html
5. Dynamic Country State City Dependent Dropdown List using JavaScript Fetch API: th-cam.com/video/YX8AnjsjV5Q/w-d-xo.html
Keywords:-
how to fetch api in javascript,
javascript fetch api,
conventional method to fetch api,
async/await method to fetch api,
mastering the javascript fetch api,
javascript api projects
มุมมอง: 95

วีดีโอ

Complete Responsive Personal Portfolio Website using HTML CSS & JavaScript #part1
มุมมอง 775วันที่ผ่านมา
Responsive Portfolio Website Tutorial | HTML, CSS & JavaScript: In this video, I’ll walk you through building a fully responsive portfolio website from scratch using HTML, CSS, and JavaScript. This tutorial is perfect for anyone looking to create a personal or professional portfolio to showcase their projects, skills, and achievements. Whether you’re a beginner or looking to improve your web de...
SVG Moving Border Animation in HTML and CSS
มุมมอง 13614 วันที่ผ่านมา
In this tutorial, I'm going to create a SVG Moving Border Animation using HTML and CSS only. Watching this tutorial, you can make this nice animation by yourself. I'm going to code step by step. So, this tutorial will be helpful for developers. If you like this project, subscribe my channel "Creative JS Coder" Source Code Link:- Github: github.com/Mohammed-Faysal/SVG-Moving-border-animation-htm...
Expandable Animated Flex Cards in HTML and CSS only | With Free Source Code
มุมมอง 33921 วันที่ผ่านมา
In this tutorial, I'm going to create a simple CSS project and that is Expandable Animated Cards using only HTML and CSS Flexbox. By doing this project, you will get a clear concept about CSS Flexbox. Hope this project will be helpful for the beginner web developers. If you like this, Subscribe My Channel "Creative JS Coder" Source Code Link:- Github: github.com/Mohammed-Faysal/Expandable-css-c...
Responsive CSS Flexbox Layout Design | Review Section in HTML & CSS | Responsive Design
มุมมอง 19621 วันที่ผ่านมา
In this tutorial, I'm going to create a Responsive Review Section and going to show you how to use CSS Flexbox effectively to create any responsive layout. By using CSS Flexbox you can design a layout very easily within very less time. Hope this tutorial will be helpful for the beginner developers to understand all about css flexbox. Source Code Link:- Codepen: github.com/Mohammed-Faysal/Respon...
How to Detect Any Key's Code of the Keyboard #javascriptprojects
มุมมอง 4121 วันที่ผ่านมา
In the tutorial, I'm going to create a simple JavaScript project and this is Keyboard key code Finder. Using this, you can Detect any key's code of the keyboard. It's going to be an awesome JavaScript project. If you like this, Subscribe my channel "Creative JS Coder" Other Projects: Multi level signin signup form: codepen.io/CreativeCoder111/pen/YzRVXVO Country Guide App using JavaScript fetch...
Multiple Typing Text Animation & Effect in HTML and CSS only | Auto Typing Text Effect
มุมมอง 246หลายเดือนก่อน
In this tutorial, I'm going to show you how to make an auto typing text effect using html and css only. Different text will get different color. You can easily use this text effect in your website. You don't need to use JavaScript for this simple thing. I'm going to code step by step and Slowly. Hope it will be helpful for the developers. If you like this, Subscribe my channel "Creative JS Code...
How to make Line Progress bar with Counter Up in HTML CSS & JavaScript | Skills Bar
มุมมอง 130หลายเดือนก่อน
In this tutorial, I'm going to create a Animated functional Line Progress bar of Skills bar with Dynamic Counter up functionality using HTML CSS and JavaScript. If you watch this tutorial without skipping, you will be able to understand the code. Because I will do the code in a very easy way. Hope this projects will be helpful for the beginners. If you like this, Subscribe my channel "Creative ...
Infinite Scroll using Only HTML and CSS
มุมมอง 268หลายเดือนก่อน
Infinite Scroll using Only HTML and CSS
Magic of CSS Flexbox | Responsive CSS Flexbox Layout | Learn CSS Flexbox
มุมมอง 126หลายเดือนก่อน
Magic of CSS Flexbox | Responsive CSS Flexbox Layout | Learn CSS Flexbox
Use of conic-gradient in CSS | Multicolor Border Design in CSS | CSS Gradient Color
มุมมอง 103หลายเดือนก่อน
Use of conic-gradient in CSS | Multicolor Border Design in CSS | CSS Gradient Color
Hamburger Menu Design in HTML & CSS only. | Creative JS Coder
มุมมอง 148หลายเดือนก่อน
Hamburger Menu Design in HTML & CSS only. | Creative JS Coder
Awesome Sign Up Form in HTML CSS and JavaScript | Form Validation in HTML CSS and JS
มุมมอง 220หลายเดือนก่อน
Awesome Sign Up Form in HTML CSS and JavaScript | Form Validation in HTML CSS and JS
Responsive Card Slider using HTML CSS and Swiper JS | With free source code
มุมมอง 248หลายเดือนก่อน
Responsive Card Slider using HTML CSS and Swiper JS | With free source code
Responsive Form Design in HTML and CSS only | With free source code | HTML Form | Creative JS Coder
มุมมอง 2322 หลายเดือนก่อน
Responsive Form Design in HTML and CSS only | With free source code | HTML Form | Creative JS Coder
Create a Sticky Responsive Navbar with Dropdown Menu | HTML CSS & JavaScript | With free source code
มุมมอง 1042 หลายเดือนก่อน
Create a Sticky Responsive Navbar with Dropdown Menu | HTML CSS & JavaScript | With free source code
Responsive Auto Play Movie suggestion Slider in HTML CSS & JavaScript | Swiper Js |Creative JS Coder
มุมมอง 7772 หลายเดือนก่อน
Responsive Auto Play Movie suggestion Slider in HTML CSS & JavaScript | Swiper Js |Creative JS Coder
Complete Tic Tac Toe Game with Timer in HTML CSS & JavaScript | Game in JavaScript.
มุมมอง 9692 หลายเดือนก่อน
Complete Tic Tac Toe Game with Timer in HTML CSS & JavaScript | Game in JavaScript.
Important JavaScript Local Storage Projects | HTML, CSS & JavaScript | #localstorage
มุมมอง 1152 หลายเดือนก่อน
Important JavaScript Local Storage Projects | HTML, CSS & JavaScript | #localstorage
Important JavaScript API Projects | JavaScript Fetch API | Country State City API #creativejscoder
มุมมอง 932 หลายเดือนก่อน
Important JavaScript API Projects | JavaScript Fetch API | Country State City API #creativejscoder
10 important JavaScript Projects with Free Source Code | Creative JS Coder
มุมมอง 3062 หลายเดือนก่อน
10 important JavaScript Projects with Free Source Code | Creative JS Coder
Customize jQuery Bootstrap5 Data Table | CRUD operation | HTML, CSS & JavaScript Local Storage
มุมมอง 3.2K2 หลายเดือนก่อน
Customize jQuery Bootstrap5 Data Table | CRUD operation | HTML, CSS & JavaScript Local Storage
Responsive Team Section using Owl Carousel Slider | HTML, CSS and JavaScript | Free Source Code
มุมมอง 6743 หลายเดือนก่อน
Responsive Team Section using Owl Carousel Slider | HTML, CSS and JavaScript | Free Source Code
Random Quote Generator using HTML, CSS and JavaScript with Free Source Code | API Project
มุมมอง 1543 หลายเดือนก่อน
Random Quote Generator using HTML, CSS and JavaScript with Free Source Code | API Project
Finix, A Business Website using HTML, CSS, Bootstrap5, JavaScript, jQuery | Fully Responsive. #Part1
มุมมอง 5773 หลายเดือนก่อน
Finix, A Business Website using HTML, CSS, Bootstrap5, JavaScript, jQuery | Fully Responsive. #Part1
Analog Clock with Sound Effect in HTML, CSS and JavaScript | Free source code.
มุมมอง 1.4K4 หลายเดือนก่อน
Analog Clock with Sound Effect in HTML, CSS and JavaScript | Free source code.
Responsive CSS Flexbox Layout design #cssflexbox
มุมมอง 2024 หลายเดือนก่อน
Responsive CSS Flexbox Layout design #cssflexbox
Team Section Inverted Border Radius Hover Effect in HTML and CSS only
มุมมอง 1624 หลายเดือนก่อน
Team Section Inverted Border Radius Hover Effect in HTML and CSS only
Responsive and Automatic Changeable Animated Image Slider using HTML, CSS & JavaScript | Carousel
มุมมอง 19K4 หลายเดือนก่อน
Responsive and Automatic Changeable Animated Image Slider using HTML, CSS & JavaScript | Carousel
Responsive Glassmorphism Login Form design using HTML & CSS only
มุมมอง 1.1K5 หลายเดือนก่อน
Responsive Glassmorphism Login Form design using HTML & CSS only

ความคิดเห็น

  • @Vanced2Dua
    @Vanced2Dua 15 ชั่วโมงที่ผ่านมา

    Can you share CSS html and javascript file

  • @miroframe
    @miroframe 4 วันที่ผ่านมา

    Your project is exactly what I need for my website. Would it be possible to buy the source code from you? Thank you for your reply.

    • @creativejscoder
      @creativejscoder 2 วันที่ผ่านมา

      No need to buy. I will provide you soon.

    • @miroframe
      @miroframe 2 วันที่ผ่านมา

      ​@@creativejscoderThank you very much.

  • @siddiqk5619
    @siddiqk5619 5 วันที่ผ่านมา

    Cant we Do this without JS..??

  • @Serviciii
    @Serviciii 5 วันที่ผ่านมา

    thank you bro

  • @FutureEducation-f8q
    @FutureEducation-f8q 6 วันที่ผ่านมา

    thank you so much

  • @Rplabiezz
    @Rplabiezz 8 วันที่ผ่านมา

    i want to ask you. Approximately, what the size is each photo and can i use landscape photo before displaying them?

    • @creativejscoder
      @creativejscoder 8 วันที่ผ่านมา

      you can display for the whole screen. So, I will suggest you to maintain 1920px (width) and 1080px (height). And If you use Landscape photo before displaying, the animation will not be proper. And I think it's unnecessary.

  • @riyajmujawar007
    @riyajmujawar007 10 วันที่ผ่านมา

    For skills Do You Used Meter tag??

    • @creativejscoder
      @creativejscoder 10 วันที่ผ่านมา

      No.

    • @riyajmujawar007
      @riyajmujawar007 10 วันที่ผ่านมา

      @@creativejscoder which Tag is used for showing The Percentage of Skills??

    • @creativejscoder
      @creativejscoder 10 วันที่ผ่านมา

      @@riyajmujawar007 div/p many other tags you can use here. But I'm showing the percentage dynamically using JavaScript. In The part2 I will show this.

    • @riyajmujawar007
      @riyajmujawar007 10 วันที่ผ่านมา

      @@creativejscoder Ok bro🤍

  • @segarinojay-elparmis2776
    @segarinojay-elparmis2776 10 วันที่ผ่านมา

    Like your video

  • @zohaibfarooq8482
    @zohaibfarooq8482 11 วันที่ผ่านมา

    Can anybody copy the same code in his laptop by watching this video ?

    • @creativejscoder
      @creativejscoder 11 วันที่ผ่านมา

      Yes, you can. But you will not get any benefits by copying this code. Better try to understand.

    • @zohaibfarooq8482
      @zohaibfarooq8482 11 วันที่ผ่านมา

      @@creativejscoder Bro by copying I'll understand as well. For an instance I can't understand any coding if I don't. copy that. Can you share code with me ?

    • @creativejscoder
      @creativejscoder 11 วันที่ผ่านมา

      @@zohaibfarooq8482 Ok, I'm giving the source code in the description box.

    • @creativejscoder
      @creativejscoder 11 วันที่ผ่านมา

      th-cam.com/video/KtO7GspJlp0/w-d-xo.html In the description box, source code is available.

  • @orbejoanarosed.6507
    @orbejoanarosed.6507 14 วันที่ผ่านมา

    What is the solution why I don't have the buttons?

    • @orbejoanarosed.6507
      @orbejoanarosed.6507 14 วันที่ผ่านมา

      Please reply to my comment. Thanks in advance. 😢😊

    • @creativejscoder
      @creativejscoder 14 วันที่ผ่านมา

      Maybe for bootstrap version.

  • @MahiAbdallah-k8d
    @MahiAbdallah-k8d 15 วันที่ผ่านมา

    THIS IS ABSOLUTELY AMAZING. I may not use TH-cam, and I am in a country where I cannot give online donations, but I did subscribe in hopes that my subscription makes up for your kindness and making the code opensource. TRULY APRICIATE YOU BRU.

  • @dosenfauzi
    @dosenfauzi 15 วันที่ผ่านมา

    I see there is no js code, sir, please provide a solution.

    • @creativejscoder
      @creativejscoder 15 วันที่ผ่านมา

      I made this using only HTML and CSS. There is no need to use JavaScript.

    • @dosenfauzi
      @dosenfauzi 15 วันที่ผ่านมา

      Can it be applied to Google Apps script, sir?

    • @creativejscoder
      @creativejscoder 14 วันที่ผ่านมา

      @@dosenfauzi Google Apps Script does not directly support HTML and CSS in the same way a regular web application would.

    • @dosenfauzi
      @dosenfauzi 13 วันที่ผ่านมา

      @@creativejscoder okey thanks sir

  • @_azu7
    @_azu7 16 วันที่ผ่านมา

    Omg thanks, so much deserve more subs

  • @FMFT
    @FMFT 17 วันที่ผ่านมา

    Interesting. I created something a bit different. A Library Management System in 15 KB. You can import and export data into a CSV file. Just HTML5 and JavaScript. Have a look at my channel if you want to give It a try. Books 3.0 is available in 22 languages. Just 15 KB. Free. No installation. Code available.

  • @bhavikgoyal9927
    @bhavikgoyal9927 19 วันที่ผ่านมา

    Very Great and Helpful video

  • @sanaa4102
    @sanaa4102 20 วันที่ผ่านมา

    its just copy paste from Lun Dev th-cam.com/video/j7GG009J9uc/w-d-xo.html

  • @vnm8322
    @vnm8322 21 วันที่ผ่านมา

    Bro . I just used your source code . But the image should be little shake when the image zoom out. Tell me a way clear this error.

    • @creativejscoder
      @creativejscoder 15 วันที่ผ่านมา

      Zoom out means??? Can you clear the problem?

  • @امیرعباسویادگیری
    @امیرعباسویادگیری 23 วันที่ผ่านมา

    Thank you ❤

  • @marouasedoud7033
    @marouasedoud7033 23 วันที่ผ่านมา

    perfection 🤝

  • @FMFT
    @FMFT 27 วันที่ผ่านมา

    Interesting. I created something a bit different. A Library Management System in 15 KB. You can import and export data into a CSV file. Just HTML5 and JavaScript. Have a look at my channel if you want to give It a try. Books 3.0 is available in 23 languages. Just 15 KB. Free. No installation. Code available.

  • @امیرعباسویادگیری
    @امیرعباسویادگیری 27 วันที่ผ่านมา

    You are the best ❤ Other Channels copy your content But you continue❤ Thank U Please give us a donation crypto wallet for donate

    • @creativejscoder
      @creativejscoder 26 วันที่ผ่านมา

      Yes some other channels did this.

  • @winnerdacruz9625
    @winnerdacruz9625 27 วันที่ผ่านมา

    Muito bom 🎉

  • @newworldschangings7309
    @newworldschangings7309 28 วันที่ผ่านมา

    Thanks a lot ❤

  • @vindyadhariishadhara9952
    @vindyadhariishadhara9952 29 วันที่ผ่านมา

    ❤🧡💛💚💙💜🤎🤍

  • @YouInsta01
    @YouInsta01 29 วันที่ผ่านมา

    Thankyou so much bro, it helped a lot❤‍🩹

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

    it works 🔥🔥🔥

  • @ahmedjar-gv7de
    @ahmedjar-gv7de หลายเดือนก่อน

    Good job sir If you connected to a database it will perfect

  • @user-gj2qw2zv4z
    @user-gj2qw2zv4z หลายเดือนก่อน

    I saw this video in telegram

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

      May be someone copied this tutorial.

    • @user-gj2qw2zv4z
      @user-gj2qw2zv4z หลายเดือนก่อน

      @@creativejscoder ok bro, that's helpful Good tutorial it helps lots so much

  • @امیرعباسویادگیری
    @امیرعباسویادگیری หลายเดือนก่อน

    Nice. Like every time ❤❤❤🎉

  • @امیرعباسویادگیری
    @امیرعباسویادگیری หลายเดือนก่อน

    Very good🎉❤

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

    Easier. Biblioteca v1.1 Tiny and fast as a lightning.

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

      And free

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

    whats the size of the picture youve used?

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

      you can use 1920 x 1080px

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

      @@creativejscoder thanks mate

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

      @@creativejscoder is there a way to use higher res? i tried using higher res pic and the web is laggy

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

      @@ImJazquonte Download the high resolution pic. Then decrease the file size without destroying the resolution. Then you can use..

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

      @@creativejscoder aight, thanks

  • @امیرعباسویادگیری
    @امیرعباسویادگیری หลายเดือนก่อน

    Nice❤❤❤❤❤❤😅

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

    Source Code?

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

      Check the description box now. Already I provided the source code.

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

    can do same by touching image and move scrole multi image and click image to zoom and and and

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

      Yes. Nothing Impossible. Just have to think.

    • @abhaq50000
      @abhaq50000 22 วันที่ผ่านมา

      @@creativejscoder where is the lesson please

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

    why does it not show on the browser

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

      Is there displaying any error???

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

      @@creativejscoder I can see the transition happening but the content isn't coming along

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

      @@omkarchavan2852 Content means image?? Maybe you used the wrong path of the image.

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

    Nice bro

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

    Абалденно! Очень красиво!! Вы большой молодец!! Подписка + like

  • @JeetSamanta-op2jp
    @JeetSamanta-op2jp หลายเดือนก่อน

    thanks bro

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

    How do I make it responsive? And my pictures one of it is still sticking at the left side and I follow everything you did, I even went through your code here but still the same

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

      Watch This tutorial for responsive design: th-cam.com/video/gLK3Svsxx-Q/w-d-xo.html

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

      Do you know why one picture is still sticking at my left side?

  • @MdSayem-yb9dw
    @MdSayem-yb9dw หลายเดือนก่อน

    great job

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

    Amazing tutorial thx so much I made it :)

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

    ¿Cómo se corneta a una base de datos ?

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

    how to do this in react

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

      react tutorial is coming soon.

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

      @@creativejscoder kindly upload it soon

  • @Наталья-г6р5щ
    @Наталья-г6р5щ หลายเดือนก่อน

    Good

  • @harunurrashid-zi2ze
    @harunurrashid-zi2ze หลายเดือนก่อน

    Keep it up..😊

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

    18:46 personal

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

      I didn't get you

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

      @@creativejscoder i going to continue watching this video in mentioned timestamp

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

    Can you make it in react also 😅

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

    Keep it up.

  • @harunurrashid-zi2ze
    @harunurrashid-zi2ze หลายเดือนก่อน

    Nice😊