Microverse JS Project #4

JS - Weather App v1.1

This is a javascript Weather app project. It fetchs live weather data from Weather API. The project also makes use of Unsplash API to change the background image based on the weather condition. The page is dynamically rendered by using JavaScript DOM manipulation. JavaScript is used to generate the entire contents of the page. Most of the page is stylized by pure CSS, though in some areas Bootstrap is used.

The requirements in Odin page are followed.

The page is made with modular valinna JS (JS6) and the following milestones are finished:

• Milestone 1 - Setup webpack to load style files, and pictures.
• Milestone 2 - Create an MVC structure to create view files, model to fetch data and controller to populate data to view via model.
• Milestone 3 - Setup Unsplash API and OpenWeather API to fetch data.
• Milestone 4 - Add extra spinning loader.

Built With

• Javascript/ES6 Modules
• Fetch Api
• npm v14.13.1
• Webpack 5.11.0
  • HtmlWebpackPlugin
  • style-loader
  • css-loader
  • file-loader
  • DevServer
• HTML5/CSS
• Github Actions
• Bootstrap v4.5
• ESLint
• Stylelint

Live Demo

Live Demo Link

Getting Started

To get a local copy up and running follow these simple example steps.

• Clone the repository by runing git clone git@github.com:RaminMammadzada/js-weather-app.git on your terminal
• Go into project folder cd js-weather-app
• Run npm install
• Run npm run build, if you want to create built files.
  • Alternatively, run npm run dev, if you will work on it to improve.
• Go into dist folder by typing cd dist and open index.html file using your favorite browser.

Authors

👤 Ramin Mammadzada

• Github: @RaminMammadzada
• Twitter: @RaminMammadzada
• Linkedin: @RaminMammadzada

🤝 Contributing

Contributions, issues and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a ⭐️ if you like this project!

Acknowledgments

• Microverse
• Odin project

📝 License

This project is MIT licensed.