Eval submission #84
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| VITE_API_KEY=731a6fa24765316e8e44e6e18157a6bd | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,18 @@ | ||
| module.exports = { | ||
| root: true, | ||
| env: { browser: true, es2020: true }, | ||
| extends: [ | ||
| "wesbos" | ||
| ], | ||
| ignorePatterns: ['dist', '.eslintrc.cjs'], | ||
| parserOptions: { ecmaVersion: 'latest', sourceType: 'module' }, | ||
| settings: { react: { version: '18.2' } }, | ||
| plugins: ['react-refresh'], | ||
| rules: { | ||
| 'react-refresh/only-export-components': [ | ||
| 'warn', | ||
| { allowConstantExport: true }, | ||
| ], | ||
| "no-console": 2, | ||
| }, | ||
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,5 +1,14 @@ | ||
| # Redux Weather App | ||
|
|
||
| Search a city name and get back three graphs displaying the temperature, pressure, humidity, and corresponding averages for that city over the next 5 days. This app was built with React using Vite, Redux, and utilizes the [OpenWeather API](https://openweathermap.org/). | ||
|
|
||
| ## Run Locally | ||
|
|
||
| To run locally, fork and clone this repository. `cd` into the directory you created and execute the following commands: | ||
|
|
||
| ``` | ||
| npm install | ||
|
There was a problem hiding this comment. nice job on the readme! it is great to put all instructions on how to run the app in here. |
||
| npm run dev | ||
| ``` | ||
|
|
||
| Now you can type a city name into the input box and retrieve weather data about it. If you get an error, check your spelling. If the city you want isn't coming up, enter the city, state, and two-letter country ISO code (for example, "Chicago, Illinois, US"). | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| <!doctype html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <link rel="icon" type="image/svg+xml" href="/vite.svg" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <title>Vite + React</title> | ||
| </head> | ||
| <body> | ||
| <div id="root"></div> | ||
| <script type="module" src="/src/main.jsx"></script> | ||
| </body> | ||
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,38 +1,40 @@ | ||
| { | ||
| "name": "redux-weather", | ||
| "private": true, | ||
| "version": "0.0.0", | ||
| "type": "module", | ||
| "scripts": { | ||
| "dev": "vite", | ||
| "build": "vite build", | ||
| "lint": "eslint .", | ||
| "lint:fix": "eslint . --fix", | ||
| "preview": "vite preview" | ||
| }, | ||
| "eslintConfig": { | ||
| "extends": [ | ||
| "wesbos" | ||
| ] | ||
| }, | ||
| "dependencies": { | ||
| "@reduxjs/toolkit": "^1.9.7", | ||
| "axios": "^1.5.1", | ||
| "bootstrap": "^5.3.2", | ||
| "eslint-config-wesbos": "^3.2.3", | ||
| "prop-types": "^15.8.1", | ||
| "react": "^18.2.0", | ||
| "react-bootstrap": "^2.9.1", | ||
| "react-dom": "^18.2.0", | ||
| "react-redux": "^8.1.3", | ||
| "react-sparklines": "^1.7.0" | ||
| }, | ||
| "devDependencies": { | ||
| "@types/react": "^18.2.15", | ||
| "@types/react-dom": "^18.2.7", | ||
| "@vitejs/plugin-react": "^4.0.3", | ||
| "eslint": "^8.45.0", | ||
| "eslint-plugin-react": "^7.32.2", | ||
| "eslint-plugin-react-hooks": "^4.6.0", | ||
| "eslint-plugin-react-refresh": "^0.4.3", | ||
| "vite": "^4.4.5" | ||
| } | ||
| } |
Binary file not shown.
Binary file not shown.
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,62 @@ | ||
| import { useState } from 'react'; | ||
| import Container from 'react-bootstrap/Container'; | ||
| import Row from 'react-bootstrap/Row'; | ||
| import Col from 'react-bootstrap/Col'; | ||
| import Button from 'react-bootstrap/Button'; | ||
| import Form from 'react-bootstrap/Form'; | ||
| import InputGroup from 'react-bootstrap/InputGroup'; | ||
|
|
||
| import { useDispatch } from 'react-redux'; | ||
| import WeatherTable from './components/WeatherTable'; | ||
| import { searchForCity } from './reducers/weatherSlice'; | ||
|
|
||
| function App() { | ||
| const [search, setSearch] = useState(''); | ||
| const dispatch = useDispatch(); | ||
|
|
||
| const handleInput = (event) => { | ||
| setSearch(event.target.value); | ||
| }; | ||
|
|
||
| const handleSearchButton = () => { | ||
| if (search !== '') { | ||
|
There was a problem hiding this comment. this could be simplified to if (search) - review the concept of truthy and falsy |
||
| dispatch(searchForCity(search)); | ||
| setSearch(''); | ||
| } | ||
| }; | ||
|
|
||
| const handleEnterKey = (event) => { | ||
| if (event.key === 'Enter' && search !== '') { | ||
| dispatch(searchForCity(search)); | ||
| setSearch(''); | ||
| } | ||
| }; | ||
|
|
||
| return ( | ||
| <Container fluid="md"> | ||
| <Row> | ||
| <Col> | ||
| <InputGroup className="mb-3 mt-3"> | ||
| <Form.Control | ||
| placeholder="Search for a city" | ||
| aria-label="Search for a city" | ||
| value={search} | ||
| onChange={handleInput} | ||
| onKeyDown={handleEnterKey} | ||
| /> | ||
| <Button | ||
| variant="outline-secondary" | ||
| id="search-button" | ||
| onClick={handleSearchButton} | ||
| > | ||
| Search | ||
| </Button> | ||
| </InputGroup> | ||
| </Col> | ||
| </Row> | ||
| <WeatherTable /> | ||
| </Container> | ||
| ); | ||
| } | ||
|
|
||
| export default App; | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,29 @@ | ||
| import Row from 'react-bootstrap/Row'; | ||
| import Col from 'react-bootstrap/Col'; | ||
|
|
||
| import { useSelector } from 'react-redux'; | ||
| import WeatherTableList from './WeatherTableList'; | ||
|
|
||
| export default function WeatherTable() { | ||
| const currentCity = useSelector((state) => state.weather.currentSearch); | ||
|
|
||
| return ( | ||
| <> | ||
| <hr /> | ||
| <Row className="text-center"> | ||
| <Col>City</Col> | ||
| <Col>Temperature (F)</Col> | ||
| <Col>Pressure (hPa)</Col> | ||
| <Col>Humidity (%)</Col> | ||
| </Row> | ||
| <hr /> | ||
| {currentCity !== '' ? ( | ||
| <WeatherTableList /> | ||
| ) : ( | ||
| <h4 className="text-center"> | ||
| Search for a city to see weather data displayed here | ||
| </h4> | ||
| )} | ||
| </> | ||
| ); | ||
| } |
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
generally you don't check .env into your repo cause it exposes things that shouldn't be public like keys. you would want to put this in your .gitignore