Weather Glitz - Weather Glitz Web Application.

Table of contents

• Overview
  • Screenshot
  • Links
• My process
  • Built with
  • Continued development
  • Useful resources
• Author
• Acknowledgments

Overview

Weather Glitz...a web application that is used to get the current weather condition of any location around the world.

Screenshot

Links

• Solution URL: (https://github.com/Wizzy-05/Weather-Glitz)
• Live Site URL: (https://weatherglitz.netlify.app/)

My process

Built with

• CSS custom properties
• Flexbox
• CSS Grid
• Mobile-first workflow
• React js - JS library
• [Accu Weather Api]

Some Nice Stuffs

    const updateCity = async (city) => {

        const cityId = await handleFetchCityId(city);
        const cityWeather = await handleFetchCityWeather(cityId.Key);

        return {
            cityId:cityId,
            cityWeather:cityWeather
        }
    }

   .inner-first>.basic {
     width: 85%;
     display: flex;
     flex-direction: row;
     align-items: center;
     gap: 5%;
   }

     <div className="two">
         <div className="inner-two">
             {
                 Object.values(suggestions).map((location, index) => {
                     return (
                         <p key={index} onClick={() => handleSuggestion(location)}> {location} </p>
                     )
                 })
             }
         </div>
     </div>

Continued development

• Css Grid
• Sass functions
• React js
• Sass
• Node js
• Express js

Useful resources

• Accu Weather Api Docs: This helped me while working with Fetching data from an API. I'll Like to work with it in upcoming projects.

Author

• Github - @Wizzy-05
• Twitter - @ahuzi_wisdom

Acknowledgments

I really appreciate Harry @OpeAbidemi.