ES6 Weather Forecast
- ES6 (with babel)
- Hot Module Replacement for faster development
- Axios as promise based HTTP Client. Read this Fetch vs Axios comparison
- Forecast API
- Responsive design
- Mock Data allowing working offline and saving calls to weather API
- Webpack development environment configuration
- Webpack Babel loader configuration
- Webpack SCSS configuration
- Webpack configuration for HMR
- Webpack production configuration
- Jest as testing tool. Tests under __tests__ folder
- Add test like this
Features NOT INCLUDED (with more time...)
- Create React component as well
- Add a selector of Locations to allow the user to select more Locations (not only London)
- Improve the design
- Add more information about clouds, wind, etc...
- Even if that is responsive (i used float divs) it could be targeted with media queries and the mobile user experience could be improved.
- Initial Spinner meanwhile the app is doing the query to weather API
- Add the results to sessionStorage cache
- Node.js and NPM: Download and install. I have version 6.6.0 of Node and 3.10.6 of NPM on Windows PC
- Git: Download and install. I have version 2.7.4 installed on Windows PC
- Get the url of your forked project.
- Click on "Clone or download" and Copy to clipboard the url ending on .git.
- Open your command line and go to your directoy
You don't need to create a specific folder for the project, it will be created by git
- Clone the repo on your machine:
$ git clone https://github.com/username/es6-weather-forecast
Note: That will create a new folder called es6-weather-forecast with all the files in.
Install Project dependencies
We will use npm i to install all our dependencies in our node_modules folder.
$ cd es6-weather-forecast $ npm i
Run the app in Development mode
$ npm run start
$ npm run build
$ npm run lint
$ npm run test
Please feel free to add your own improvement. I am waiting your Pull Request (PR).
MIT License Copyright (c) 2016 Jose Quinto Zamora