JavaScript

 HTML <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < title > Activity </ title > </ head > < body >     < input placeholder = "Enter State Province" >     < button > Search </ button >     < ul id = "list" ></ ul >     < script src = "https://cdn.jsdelivr.net/npm/axios@1.6.7/dist/axios.min.js" ></ script >     < script src = "Activity2.js" ></ script > </ body > </ html > CSS let url = "http://universities.hipolabs.com/search?country=india&name=" ; let btn = document . querySelector ( "button" ); btn . addEventListener ( "click" , async () => {   let state = document . querySelector ( "input" ). value ;   l...

 HTML <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < title > Activity </ title > </ head > < body >     < input placeholder = "Enter Country" >     < button > Search </ button >     < ul id = "list" ></ ul >     < script src = "https://cdn.jsdelivr.net/npm/axios@1.6.7/dist/axios.min.js" ></ script >     < script src = "Activity.js" ></ script > </ body > </ html > CSS let url = "http://universities.hipolabs.com/search?name=" ; let btn = document . querySelector ( "button" ); btn . addEventListener ( "click" , async () => {   let country = document . querySelector ( "input" ). value ;   let colleges = await ...

  let url = "https://icanhazdadjoke.com/" ; async function getJoke () {   try {     const config = {       headers : {         Accept : "application/json"       },     };     let res = await axios . get ( url , config );     console . log ( res . data );     console . log ( res . data . joke );   } catch ( e ) {     console . log ( e );   } } getJoke ();

 HTML <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < title > Dog API </ title > </ head > < body >     < h1 > Show Random Dog images </ h1 >     < button > show image </ button >     < img id = "result" >     < script src = "https://cdn.jsdelivr.net/npm/axios@1.6.7/dist/axios.min.js" ></ script >     < script src = "DogAPI.js" ></ script > </ body > </ html > CSS let url = "https://dog.ceo/api/breeds/image/random" ;; let btn = document . querySelector ( "button" ); btn . addEventListener ( "click" , async () => {     let link = await getImg ();     console . log ( link );     let img = document . querySelector ( "#result" ...

 HTML <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < title > Axios </ title > </ head > < body >     < h1 > Get Random Facts </ h1 >     < button > Show Fact </ button >     < p id = "result" ></ p >     < script src = "https://cdn.jsdelivr.net/npm/axios@1.6.7/dist/axios.min.js" ></ script >     < script src = "Axios.js" ></ script > </ body > </ html > CSS let btn = document . querySelector ( "button" ); btn . addEventListener ( "click" , async () => {   let res = await getFact ();   console . log ( res );   let p = document . querySelector ( "#result" );   p . innerText = res ; }); let url = "https://catfact.ninj...

  let url = "https://catfact.ninja/fact" ; async function getFacts () {   try {     let res = await fetch ( url );     let data = await res . json ();     console . log ( data . fact );     let res2 = await fetch ( url );     let data2 = await res2 . json ();     console . log ( data2 . fact );   } catch ( e ) {     console . log ( e );   }   console . log ( "TQ" ); } console . log ( getFacts ());

  let url = "https://catfact.ninja/fact" ; fetch ( url ) . then (( res ) => {     console . log ( res ); return res . json (); }) . then (( data1 ) => {     console . log ( data1 . fact );     return fetch ( url ); }) . then (( res ) => {     return res . json (); }) . then (( data2 ) => {     console . log ( data2 . fact ); }) . catch (( err ) => { console . log ( err ); })

 

 ADDING INFORMAITON IN URL'S ADDING API ROUTE USING QUERY STRINGS

 HTTP verbs Status Codes: there are many status codes refer mdn

 

  let jsonRes = `{"fact":"According to a Gallup poll, most American pet owners obtain their cats by adopting strays.","length":90}` ; // JSON.parse() let validRes = JSON . parse ( jsonRes ); console . log ( validRes ); console . log ( validRes . fact ); // JSON.stringify() let student = {     name : "abhii" ,     marks : 98 }; console . log ( JSON . stringify ( student ));

  let h1 = document . querySelector ( "h1" ); function changeColor ( color , delay ) {   return new Promise (( resolve , reject ) => {     setTimeout (() => {       let num = Math . floor ( Math . random () * 10 ) + 1 ;       if ( num < 3 ) {         reject ( "Promise is rejected" );       }       h1 . style . color = color ;       resolve ( "color changed" );     }, delay );   }); } async function demo () {   await changeColor ( "red" , 1000 );   await changeColor ( "blue" , 1000 );   await changeColor ( "green" , 1000 );   await changeColor ( "yellow" , 1000 );   let a = 5 ;   console . log ( a );   console . log ( "new Number:" , a + 3 ); } console . log ( demo ()); HANDLING REJECTIONS let h1 = document . querySelector ( "h1" ); function changeColor ( color , delay ) {   retu...

    < h1 > Abhiii </ h1 >   let h1 = document . querySelector ( "h1" ); function changeColor ( color , delay ) {   return new Promise (( resolve , reject ) => {     setTimeout (() => {       h1 . style . color = color ;       console . log ( `color changed to ${ color } !` );       resolve ( "color changed" );     }, delay );   }); } async function demo () {   await changeColor ( "red" , 1000 );   await changeColor ( "orange" , 1000 );   await changeColor ( "green" , 1000 );   await changeColor ( "yellow" , 1000 );   changeColor ( "blue" , 1000 ); } console . log ( demo ());

  function getNum () {   return new Promise (( resolve , reject ) => {     setTimeout (() => {       let num = Math . floor ( Math . random () * 10 ) + 1 ;       console . log ( num );       resolve ();     }, 1000 );   }); } async function demo () {   await getNum ();   await getNum ();   await getNum ();   await getNum ();   getNum (); } console . log ( demo ());

  async function greet () {     return "Hello!" ; } console . log ( greet ()); async function greet () { abc . abc ();     return "Hello!" ; } console . log ( greet ()); async function greet () { throw "some random error" ;     return "Hello!" ; } console . log ( greet ()); async function greet () {     return "Hello!" ; } greet () . then (( result ) => {     console . log ( "Promise was successful" );         console . log ( "result:" , result );     }) . catch (( error ) => {     console . log ( "Promise was rejected" );     console . log ( "Error:" , error ); }) async function greet () {     throw "some random number" ;     return "Hello!" ; } greet () . then (( result ) => {     console . log ( "Promise was successful" );         console . log ( "result:" , result );     }) . catch (( error ) =...