diff --git a/.gitignore b/.gitignore index f5cc5e9..f80d5fe 100644 --- a/.gitignore +++ b/.gitignore @@ -3,6 +3,7 @@ node_modules .DS_Store yarn.lock package-lock.json +public/images npm-debug.log* yarn-debug.log* diff --git a/README.md b/README.md index 84c7a15..34d4003 100644 --- a/README.md +++ b/README.md @@ -86,7 +86,7 @@ Base API url: https://mate-uber-eats-api.herokuapp.com/api/v1/ - run `npm run lint` to check code style - When you finished add correct `homepage` to `package.json` and run `npm run deploy` - Add links to your demo in readme.md. - - `[DEMO LINK](https://.github.io//)` - this will be a + - `[DEMO LINK](https://AnnaGerdii.github.io/react_uber-eats/)` - this will be a link to your index.html - Commit and push all recent changes. - Create `Pull Request` from forked repo `()` to original repo diff --git a/package.json b/package.json index 7bd01de..58f8a18 100755 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "homepage": "https://mate-academy.github.io/react_uber-eats", + "homepage": "https://AnnaGerdii.github.io/react_uber-eats/", "name": "react_uber-eats", "version": "0.1.0", "private": true, @@ -7,11 +7,17 @@ "author": "Mate Academy", "license": "GPL-3.0", "dependencies": { + "classnames": "^2.2.6", + "node-sass": "^4.13.0", "prop-types": "^15.7.2", "react": "^16.8.6", "react-dom": "^16.8.6", + "react-redux": "^7.1.3", "react-router-dom": "^5.0.1", - "react-scripts": "3.0.1" + "react-scripts": "3.0.1", + "redux": "^4.0.5", + "redux-thunk": "^2.3.0", + "reselect": "^4.0.0" }, "devDependencies": { "@mate-academy/eslint-config-react": "*", diff --git a/public/index.html b/public/index.html index 4269d67..3124eff 100644 --- a/public/index.html +++ b/public/index.html @@ -4,6 +4,8 @@ React Uber eats + +
diff --git a/src/App.css b/src/App.css deleted file mode 100644 index 8b13789..0000000 --- a/src/App.css +++ /dev/null @@ -1 +0,0 @@ - diff --git a/src/App.js b/src/App.js index d494a99..514623a 100644 --- a/src/App.js +++ b/src/App.js @@ -1,10 +1,21 @@ import React from 'react'; -import './App.css'; +import { Provider } from 'react-redux'; +import './App.scss'; +import { store } from './store'; +import { RestaurantsListPage } from './components/RestaurantsListPage'; +import { Header } from './components/Header'; +import { Footer } from './components/Footer'; -const App = () => ( -
-

React Uber eats

-
+export const App = () => ( + +
+
Uber Eats
+
+
+ +
+
+
+
+ ); - -export default App; diff --git a/src/App.scss b/src/App.scss new file mode 100644 index 0000000..4a63ea4 --- /dev/null +++ b/src/App.scss @@ -0,0 +1,6 @@ +.page { + position: relative; + padding-top: 40px; + min-height: 100vh; + margin-bottom: 40px; +} diff --git a/src/api.js b/src/api.js new file mode 100644 index 0000000..09efd61 --- /dev/null +++ b/src/api.js @@ -0,0 +1,7 @@ +const URL_POSTS = 'https://mate-uber-eats-api.herokuapp.com/api/v1/restaurants'; + +export const getRestaurantsFromServer = async() => { + const restaurants = await fetch(URL_POSTS); + + return restaurants.json(); +}; diff --git a/src/components/Error/Error.js b/src/components/Error/Error.js new file mode 100644 index 0000000..906584e --- /dev/null +++ b/src/components/Error/Error.js @@ -0,0 +1,23 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import './Error.scss'; + +export const Error = ({ message }) => ( +
+

+ {message} +

+ + + Go to Home page + +
+); + +Error.propTypes = { + message: PropTypes.string, +}; + +Error.defaultProps = { + message: 'Sorry, something went wrong', +}; diff --git a/src/components/Error/Error.scss b/src/components/Error/Error.scss new file mode 100644 index 0000000..e96c993 --- /dev/null +++ b/src/components/Error/Error.scss @@ -0,0 +1,20 @@ +@import "../../styles/utils"; + +.error { + @extend %absolute-center; + flex-flow: column nowrap; + + &__text { + font-size: 30px; + font-weight: 500; + } + + &__link { + font-size: 24px; + color: $color-green; + + &:hover { + text-decoration: underline; + } + } +} diff --git a/src/components/Error/index.js b/src/components/Error/index.js new file mode 100644 index 0000000..ae6e95d --- /dev/null +++ b/src/components/Error/index.js @@ -0,0 +1 @@ +export * from './Error'; diff --git a/src/components/Footer/Footer.js b/src/components/Footer/Footer.js new file mode 100644 index 0000000..59c0e17 --- /dev/null +++ b/src/components/Footer/Footer.js @@ -0,0 +1,113 @@ +/* eslint-disable jsx-a11y/anchor-is-valid */ +import React from 'react'; +import './Footer.scss'; +import { Select } from '../Select'; + +export const Footer = () => ( +