sisay2405 / weather-forecaster-app

🌤️ Seven Day Weather Forecast app with weatherbit API.

Demo-weather-app-detail.mp4

https://trello.com/b/Rl4VFwzy/weather-app

Getting Started with Create React App

This project was bootstrapped with Create React App.

Available Scripts

In the project directory, you can run:

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

npm test

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

##Project Title: Weather Forcaster App This app build with existing knowledge of the React basics (components, JSX, props, event handling, using forms, making API calls, basic hooks) and allow you to practice with React best practices like an ErrorBoundaries, PropTypes, ESLint (to enforce code style consistency), and writing component and unit tests.

This project build in Bitwise React Byteme collaborate with Tyler(tdavis0828) and Javi(javiguerra777) Bytes discuss strategy, debug issues, review code, etc.

A demo of Weather Forecaster app, that initially loads WeatherBit forecast data for a hardcoded location (Jacksonville, Fl), and displays this information to the user via seven individual card components, one for each day of the week. The user can then click on an individual forecast day to view detailed forecast information, or choose instead to search for weather in a new location and uses the WeatherBit API, geocoding API.. Demo-weather-app-detail.mp4

###Getting Started The App build out with simple wireframes using Figma.

###Prerequisites / Installing The app has the following devDependencies installed: eslint eslint-config-airbnb eslint-config-node eslint-config-prettier eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-node eslint-plugin-prettier eslint-plugin-react eslint-plugin-react-hooks prettier and also contain .eslintignore, .eslintrc.json, and .prettierrc , Pull data from external APIs fetch.

-- Each component's props should be destructured for component readibility. -- By using search bar , the app should render weather forecast data for the new location. -- set up to use ESLint with the Airbnb style guide and Prettier. A step by step series of examples that tell you how to get a development env running

###Running the tests Npm Test

Deployment

netlify : https://sisay-weather-forecaster-app.netlify.app/ https://user-images.githubusercontent.com/82465149/178811602-ab766af5-6090-41ce-814f-dc97dad78cd5.mp4

Authors

Sisay Areaya - Initial work the list of contributors who participated in this project. All Byteme: Sarah Cullen(my lead Bitwise React ) , Tyler(tdavis0828), Javi(javiguerra777) and Frankie.

Support & Feedback

If you are having technical issues or want to raise a bug/issue with the app, the preferred way is through GitHub issues. In order to contact with me for any other request please send an email to: [email protected]

License

Distributed under the MIT License. See LICENSE for more information.