Adding a proposed solution for lab 8

polito-webapp1 · May 22, 2024 · ff8a70d · ff8a70d
1 parent f666268
commit ff8a70d
Show file tree

Hide file tree

Showing 18 changed files with 5,286 additions and 0 deletions.
diff --git a/lab08-routes/FilmLibrary.PNG b/lab08-routes/FilmLibrary.PNG
diff --git a/lab08-routes/README.md b/lab08-routes/README.md
@@ -0,0 +1,19 @@
+# Lab 08: React Routers
+
+The files in this folder are structured as follows:
+
+- `index.html`: the HTML page on which the React application will be mounted at run-time;
+- `main.jsx`: was modified for enabling React Router.
+- `src` folder: the file related to the React application.
+
+The desired layout should be similar to the following picture:
+
+![This picture shows a possible layout for the applicaiton](./FilmLibrary.PNG)
+
+In this version of the application:
+
+- Each filter is implemented as a different route.
+- When a user press on the "+" button it will be redirect into a new page allowing the user to insert a new movie.
+- Clicking on the pencil, close to each entry in the film library, the user will be redirected to a page that allows to modify the data of the selected film.
+- Users can modify rating and favorite value directly "in-line".
+- Delete operation is enabled.
diff --git a/lab08-routes/solution/.eslintrc.cjs b/lab08-routes/solution/.eslintrc.cjs
@@ -0,0 +1,21 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    'eslint:recommended',
+    'plugin:react/recommended',
+    'plugin:react/jsx-runtime',
+    'plugin:react-hooks/recommended',
+  ],
+  ignorePatterns: ['dist', '.eslintrc.cjs'],
+  parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
+  settings: { react: { version: '18.2' } },
+  plugins: ['react-refresh'],
+  rules: {
+    'react/jsx-no-target-blank': 'off',
+    'react-refresh/only-export-components': [
+      'warn',
+      { allowConstantExport: true },
+    ],
+  },
+}
diff --git a/lab08-routes/solution/index.html b/lab08-routes/solution/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8"/>
+    <link rel="icon" type="image/svg+xml" href="/favicon.ico"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <title>Film Library</title>
+</head>
+<body>
+<div id="root" class="w-100"></div>
+<script type="module" src="/src/main.jsx"></script>
+</body>
+</html>