Weather App: Takss

This a simple weather application, that detects users location at first and then shows weather data for Today and 5 days forecast, it also allows users to look for weather info in other cities in the world by typing the name of the city in the search field on the top right corner and also you can change temperature unit but toggling the button on the left top corner.

Built With

• Vanilla JavaScript,
• the CSS preprocessor SCSS,
• webpack,
• babel,
• stylelint,
• ESlint

Live Demo

Live Demo

Getting started

Prerequisites

In order to have this project up and running you will need:

• NodeJS 10+

Setup

First, you need to clone this project using one of the links above, using this command:

git clone RESPOSITRY_LINK

Then you should run: npm install

And afterward, you supposed to run: npm run server, to run the project in your local machine.

Congrats the project is fully working.

You may have some issues with the image-webpack-loader but that depends on your operating system each operating system has his own way to solve it, if you googled it just for some couple minutes I'm sure you will find the solution, if not you can contact me any time you need I will be happy to help, my contact information are below

Deployment

For deployment, I used GitHub pages, but as you see my project is full of files and the index.html file is inside the build/ folder, so in order to deploy using GitHub pages we need to put the index.html file in the root of the repository, in order to do this we will use a simple trick, please follow the commands below if you want to deploy on your own repository:

• If you have the build/ folder declared inside the .gitignore file please remove it from there.

• run npm run build to generate the build folder.

• then make sure that git knows about your subtree, using this command:

  git add build && git commit -m "Initial build subtree commit"
  

• after that use subtree push to send it to gh-pages branch in GitHub:

  git subtree push --prefix build origin gh-pages
  

  Now you have finished you can check the link to GitHub pages you will find your project deployed there. you can find the link on the repository settings page.

Future Feature

• Add an API that returns images based on location and weather.
• User an accurate API for the weather to get better weather data.

Author

👤 Zakariae El Mejdki

• Github: @elmejdki
• Twitter: @zakariae_elmejdki
• Linkedin: El Mejdki Zakariae

🤝 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!

📝 License

This project is MIT licensed.