HOME COMPONENTS (PART-2)

 WE ARE GOING TO USE BOOTSTRAP FOR OUR STYLING 

    <!-- BOOTSTRAP -->
    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7"
      crossorigin="anonymous"
    />

WE WILL USE FONT-AWESOME FOR ICONS,

   <!-- Font Awesome -->
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"
      integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg=="
      crossorigin="anonymous"
      referrerpolicy="no-referrer"
    />


BEFORE USING BOOTSTRAP

AFTER USING BOOTSTRAP


Comments

Post a Comment

Popular posts from this blog

*********UPDATING THE FRONTEND*********

Image
 WE WILL BEGIN WITH UPDATING THE FOOTER, IN FOOTER.JS import React from "react" ; function Footer () {   return (     <>       < div className = "footer" >         < div className = " f-brand " > &copy; TradeEasy Private Ltd </ div >         < div className = "f-info-socials  " >           < br />< br />< br />           < a href = "https://www.linkedin.com/in/abhishek-kumar5471/" >             < i class = "fa-brands fa-linkedin" ></ i >           </ a >           < a href = "https://github.com/abhishekkumar71" >             < i class = "fa-brands fa-github" ></ i >           </ a >         ...
Read more

**************** EXTRACTING DATA FROM API **************

Image
 TILL NOW WE USED DUMMY DATA FROM DATA.JS AS THE STOCK INFORMATION. NOW,WE WILL USE AN API THAT GIVES THE STOCK INFORMATION. WE WILL USE ALPHAVANTAGE FOR THE REQUIRED INFORMATION. SIGNUP IN ALPHAVANTAGE, YOU WILL RECEIVE AN API KEY  STORE IT IN .ENV FILE .ENV   API_KEY = AKJOQXMHFNU7**** IN ALPHAVANTAGE WE USE THE URL TO FETCH DATA , IN THE URL THERE ARE SOME FIXED PARAMETERS THAT SHOLUD BE INCLUDED IN THE URL. (READ API DOCUMENTATION OF ALPHA VANTAGE). THEY ARE API KEY, FUNCTION AND SYMBOL.   const rawSymbol = req . params . symbol . toUpperCase ();   const fetchStockData = async ( symbolVariant ) => {     const { data } = await axios . get ( "https://www.alphavantage.co/query" , {       params : {         function : "TIME_SERIES_DAILY" ,         symbol : symbolVariant ,         outputsize : "compact" ,         apikey : key ,   ...
Read more