diff --git a/README.md b/README.md
index 4c8fd7876..e6aca5a48 100644
--- a/README.md
+++ b/README.md
@@ -1,13 +1,11 @@
-# Project Movies
+# Project Movies 🍿🎥
-Replace this readme with your own information about your project.
-
-Start by briefly describing the assignment in a sentence or two. Keep it short and to the point.
+We did a movie page using react.
## The problem
-Describe how you approached to problem, and what tools and techniques you used to solve it. How did you plan? What technologies did you use? If you had more time, what would be next?
+We had some problem with the intro and to upload it on netlify!
## View it live
-Every project should be deployed somewhere. Be sure to include the link to the deployed project so that the viewer can click around and see what it's all about.
+https://annandreas-popular-movies.netlify.app/
diff --git a/code/package-lock.json b/code/package-lock.json
index bb51e893e..3afb328bc 100644
--- a/code/package-lock.json
+++ b/code/package-lock.json
@@ -16,7 +16,8 @@
"eslint-plugin-react": "^7.30.1",
"eslint-plugin-react-hooks": "^4.6.0",
"react": "^18.2.0",
- "react-dom": "^18.2.0"
+ "react-dom": "^18.2.0",
+ "react-router-dom": "^6.10.0"
},
"devDependencies": {
"react-scripts": "5.0.1"
@@ -3124,6 +3125,14 @@
}
}
},
+ "node_modules/@remix-run/router": {
+ "version": "1.5.0",
+ "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.5.0.tgz",
+ "integrity": "sha512-bkUDCp8o1MvFO+qxkODcbhSqRa6P2GXgrGZVpt0dCXNW2HCSCqYI0ZoAqEOSAjRWmmlKcYgFvN4B4S+zo/f8kg==",
+ "engines": {
+ "node": ">=14"
+ }
+ },
"node_modules/@rollup/plugin-babel": {
"version": "5.3.1",
"resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@@ -14384,6 +14393,36 @@
"node": ">=0.10.0"
}
},
+ "node_modules/react-router": {
+ "version": "6.10.0",
+ "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.10.0.tgz",
+ "integrity": "sha512-Nrg0BWpQqrC3ZFFkyewrflCud9dio9ME3ojHCF/WLsprJVzkq3q3UeEhMCAW1dobjeGbWgjNn/PVF6m46ANxXQ==",
+ "dependencies": {
+ "@remix-run/router": "1.5.0"
+ },
+ "engines": {
+ "node": ">=14"
+ },
+ "peerDependencies": {
+ "react": ">=16.8"
+ }
+ },
+ "node_modules/react-router-dom": {
+ "version": "6.10.0",
+ "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.10.0.tgz",
+ "integrity": "sha512-E5dfxRPuXKJqzwSe/qGcqdwa18QiWC6f3H3cWXM24qj4N0/beCIf/CWTipop2xm7mR0RCS99NnaqPNjHtrAzCg==",
+ "dependencies": {
+ "@remix-run/router": "1.5.0",
+ "react-router": "6.10.0"
+ },
+ "engines": {
+ "node": ">=14"
+ },
+ "peerDependencies": {
+ "react": ">=16.8",
+ "react-dom": ">=16.8"
+ }
+ },
"node_modules/react-scripts": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz",
@@ -19509,6 +19548,11 @@
"source-map": "^0.7.3"
}
},
+ "@remix-run/router": {
+ "version": "1.5.0",
+ "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.5.0.tgz",
+ "integrity": "sha512-bkUDCp8o1MvFO+qxkODcbhSqRa6P2GXgrGZVpt0dCXNW2HCSCqYI0ZoAqEOSAjRWmmlKcYgFvN4B4S+zo/f8kg=="
+ },
"@rollup/plugin-babel": {
"version": "5.3.1",
"resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@@ -27684,6 +27728,23 @@
"integrity": "sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==",
"dev": true
},
+ "react-router": {
+ "version": "6.10.0",
+ "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.10.0.tgz",
+ "integrity": "sha512-Nrg0BWpQqrC3ZFFkyewrflCud9dio9ME3ojHCF/WLsprJVzkq3q3UeEhMCAW1dobjeGbWgjNn/PVF6m46ANxXQ==",
+ "requires": {
+ "@remix-run/router": "1.5.0"
+ }
+ },
+ "react-router-dom": {
+ "version": "6.10.0",
+ "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.10.0.tgz",
+ "integrity": "sha512-E5dfxRPuXKJqzwSe/qGcqdwa18QiWC6f3H3cWXM24qj4N0/beCIf/CWTipop2xm7mR0RCS99NnaqPNjHtrAzCg==",
+ "requires": {
+ "@remix-run/router": "1.5.0",
+ "react-router": "6.10.0"
+ }
+ },
"react-scripts": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz",
diff --git a/code/package.json b/code/package.json
index 7aad26ebc..152f79a1a 100644
--- a/code/package.json
+++ b/code/package.json
@@ -11,7 +11,8 @@
"eslint-plugin-react": "^7.30.1",
"eslint-plugin-react-hooks": "^4.6.0",
"react": "^18.2.0",
- "react-dom": "^18.2.0"
+ "react-dom": "^18.2.0",
+ "react-router-dom": "^6.10.0"
},
"scripts": {
"start": "react-scripts start",
diff --git a/code/public/_redirects b/code/public/_redirects
new file mode 100644
index 000000000..50a463356
--- /dev/null
+++ b/code/public/_redirects
@@ -0,0 +1 @@
+/* /index.html 200
\ No newline at end of file
diff --git a/code/public/favicon.ico b/code/public/favicon.ico
new file mode 100644
index 000000000..7a5ef16be
Binary files /dev/null and b/code/public/favicon.ico differ
diff --git a/code/public/favicoon.ico b/code/public/favicoon.ico
new file mode 100644
index 000000000..0fb31f21b
--- /dev/null
+++ b/code/public/favicoon.ico
@@ -0,0 +1 @@
+
diff --git a/code/public/index.html b/code/public/index.html
index e6730aa66..631c9b834 100644
--- a/code/public/index.html
+++ b/code/public/index.html
@@ -1,6 +1,5 @@
-
@@ -13,7 +12,7 @@
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
- Technigo React App
+ Popular Movies
@@ -30,5 +29,4 @@
To create a production bundle, use `npm run build` or `yarn build`.
-->
-
diff --git a/code/src/App.js b/code/src/App.js
index f2007d229..c82d3ab44 100644
--- a/code/src/App.js
+++ b/code/src/App.js
@@ -1,9 +1,24 @@
-import React from 'react';
+import React from 'react'
+import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom'
+import MovieList from 'components/MovieList'
+import MovieDetails from 'components/MovieDetails'
+import NotFound from 'components/NotFound'
export const App = () => {
return (
-
- Find me in src/app.js!
-
+
+
+ } />
+ } />
+ } />
+ } />
+
+
+
);
}
+
+export default App;
+/* BrowserRouter= Wrapper for everything / main wrapper for the whole wrap */
+/* Route= Wrapper for every component */
+/* Route path= Path to a single component */
diff --git a/code/src/components/Header.js b/code/src/components/Header.js
new file mode 100644
index 000000000..db0f9c747
--- /dev/null
+++ b/code/src/components/Header.js
@@ -0,0 +1,29 @@
+/* eslint-disable jsx-a11y/label-has-associated-control */
+/* import React from 'react';
+
+const Header = () => {
+/* const [category, setCategory] = useState('popular'); */
+
+/* return (
+