Update of the repository with practice examples only

Author: OscarSotoSanchez

README.md

@@ -1,45 +1,5 @@
 # Desarrollo de Aplicaciones Web
 
-En este repositorio se encuentra el código con ejemplos y ejercicios resueltos de las diferentes partes de la asignatura "Desarrollo de Aplicaciones Web" del Grado en Ingeniería del Software de la ETSII URJC.
+En este repositorio se encuentran ejemplos de las diferentes prácticas solicitadas en la asignatura.
 
-## El temario de la asignatura se divide en 4 partes
-
-### Parte 1: Tecnologías web básicas de cliente: HTML, CSS, JavaScript y APIs REST
-* Tema 1: Introducción
-* Tema 2: Maquetación (HTML y CSS)
-* Tema 3: JavaScript
-* Tema 4: APIs REST
-
-Los ejemplos y ejercicios de esta parte pueden encontrarse en [Parte 1](parte_1)
-
-### Parte 2. Tecnologías web de servidor: Java, Spring y MySQL
-* Tema 1: Desarrollo web con Spring
-* Tema 2: APIs REST con Spring
-* Tema 3: Bases de datos con Spring
-* Tema 4: Seguridad en Spring
-* Tema 5: Despliegue Spring
-
-Los ejemplos y ejercicios de esta parte pueden encontrarse en [Parte 2](parte_2)
-
-### Parte 3. Despliegue de aplicaciones web
-* Tema 1. Virtualización, Cloud Computing y Contenedores
-* Tema 2. Docker
-* Tema 3. Docker Compose
-* Tema 4. Railway
-* Tema 5. Heroku
-
-Los ejemplos y ejercicios de esta parte pueden encontrarse en [Parte 3](parte_3)
-
-### Parte 4. Tecnologías web avanzadas de cliente: SPA con Angular
-* Tema 1. Introducción: Angular, TypeScript y Herramientas
-* Tema 2. Componentes en Angular
-* Tema 3. REST y Servicios en Angular
-* Tema 4. Aplicaciones multipágina. Router
-* Tema 5. Librerías de componentes gráficos
-* Tema 6. Publicación
-
-Los ejemplos y ejercicios de esta parte pueden encontrarse en [Parte 4](parte_4)
-
-### Proyectos de ejemplo
-
-El objetivo de la asignatura es que los alumnos desarrollen una aplicación web como si estuvieran trabajando profesionalmente. Los alumnos desarrollarán la aplicación web en grupos, y será entregada por fases. Podemos encontrar proyectos de ejemplo de las diferentes fases de la práctica en [Proyectos de Ejemplo](proyectos_de_ejemplo)
+* [Práctica 1](ejemplo-practica1)

proyectos_de_ejemplo/sample-project-phase2/README.md renamed to ejemplo-practica1/README.md

@@ -1,6 +1,6 @@
 # sample-project-phase2
 
-Ejemplo que contiene algunas de las funcionalidades solicitadas en la Fase 2 del proyecto, en concreto:
+Ejemplo que contiene algunas de las funcionalidades solicitadas en la Prática 1 del proyecto, en concreto:
 
 * Aplicación web implementada con Spring MVC y templates Mustache.
 * Base de datos MySQL
@@ -18,7 +18,7 @@ Por defecto el proyecto require una base de datos MySQL disponible en localhost
 Se puede arrancar usando docker con el comando:
 
 ```
-$ docker run --rm -e MYSQL_ROOT_PASSWORD=password -e MYSQL_DATABASE=books -p 3306:3306 -d mysql:8.0
+$ docker run --rm -e MYSQL_ROOT_PASSWORD=password -e MYSQL_DATABASE=books -p 3306:3306 -d mysql:9.2
 ```
 
 La aplicación se ejecuta con el comando:

proyectos_de_ejemplo/sample-project-phase2/pom.xml renamed to ejemplo-practica1/pom.xml

@@ -4,19 +4,19 @@
 	<modelVersion>4.0.0</modelVersion>
 
 	<groupId>es.codeurjc</groupId>
-	<artifactId>sample-project-phase2</artifactId>
+	<artifactId>ejemplo-practica1</artifactId>
 	<version>0.0.1-SNAPSHOT</version>
 	<packaging>jar</packaging>
 
 	<parent>
 		<groupId>org.springframework.boot</groupId>
 		<artifactId>spring-boot-starter-parent</artifactId>
-		<version>2.7.7</version>
+		<version>3.4.1</version>
 	</parent>
 
 	<properties>
 		<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
-		<java.version>17</java.version>
+		<java.version>21</java.version>
 	</properties>
 
 	<dependencies>
@@ -35,6 +35,7 @@
 		<dependency>
 			<groupId>mysql</groupId>
 			<artifactId>mysql-connector-java</artifactId>
+			<version>8.0.33</version>
 		</dependency>
 		<dependency>
 			<groupId>org.springframework.boot</groupId>

parte_2/tema_5/security_ejem7/src/main/java/es/codeurjc/daw/library/Application.java renamed to ejemplo-practica1/src/main/java/es/codeurjc/daw/library/Application.java

@@ -16,7 +16,7 @@ public class WebSecurityConfig {
 
 	@Autowired
 	RepositoryUserDetailsService userDetailsService;
-	
+
 	@Bean
 	public PasswordEncoder passwordEncoder() {
 		return new BCryptPasswordEncoder();
@@ -34,30 +34,29 @@ public DaoAuthenticationProvider authenticationProvider() {
 
 	@Bean
 	public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
-		
+
 		http.authenticationProvider(authenticationProvider());
-		
+
 		http
-			.authorizeHttpRequests(authorize -> authorize
-					// PUBLIC PAGES
-					.requestMatchers("/").permitAll()
-					.requestMatchers("/books/**").permitAll()
-					// PRIVATE PAGES
-					.requestMatchers("/newbook").hasAnyRole("USER")
-					.requestMatchers("/editbook/*").hasAnyRole("USER")
-                    .requestMatchers("/removebook/*").hasAnyRole("ADMIN")
-			)
-			.formLogin(formLogin -> formLogin
-					.loginPage("/login")
-					.failureUrl("/loginerror")
-					.defaultSuccessUrl("/")
-					.permitAll()
-			)
-			.logout(logout -> logout
-					.logoutUrl("/logout")
-					.logoutSuccessUrl("/")
-					.permitAll()
-			);
+				.authorizeHttpRequests(authorize -> authorize
+						// PUBLIC PAGES
+						.requestMatchers("/").permitAll()
+						.requestMatchers("/images/**").permitAll() // Allow access to static resources
+						.requestMatchers("/books/**").permitAll()
+						// PRIVATE PAGES
+						.requestMatchers("/newbook").hasAnyRole("USER")
+						.requestMatchers("/editbook").hasAnyRole("USER")
+						.requestMatchers("/editbook/*").hasAnyRole("USER")
+						.requestMatchers("/removebook/*").hasAnyRole("ADMIN"))
+				.formLogin(formLogin -> formLogin
+						.loginPage("/login")
+						.failureUrl("/loginerror")
+						.defaultSuccessUrl("/")
+						.permitAll())
+				.logout(logout -> logout
+						.logoutUrl("/logout")
+						.logoutSuccessUrl("/")
+						.permitAll());
 
 		return http.build();
 	}

proyectos_de_ejemplo/spring_3/sample-project-phase2/src/main/java/es/codeurjc/daw/library/controller/BookWebController.java renamed to ejemplo-practica1/src/main/java/es/codeurjc/daw/library/controller/BookWebController.java

@@ -1,4 +1,4 @@
-server.port = ${PORT:8080}
+server.port = 8443
 server.ssl.key-store = classpath:keystore.jks
 server.ssl.key-store-password = password
 server.ssl.key-password = secret
@@ -10,6 +10,11 @@ spring.datasource.username=root
 spring.datasource.password=password
 spring.jpa.hibernate.ddl-auto=create-drop
 
+# Necessary to be able to use accents and the letter ñ
+server.servlet.encoding.charset=UTF-8 
+server.servlet.encoding.enabled=true
+server.servlet.encoding.force=true
+
 logging.level.org.springframework.security=DEBUG
 logging.level.org.springframework.web=DEBUG
 spring.jpa.properties.hibernate.format_sql=true

parte_2/tema_5/security_ejem10/src/main/java/es/codeurjc/daw/library/controller/LoginWebController.java renamed to ejemplo-practica1/src/main/java/es/codeurjc/daw/library/controller/LoginWebController.java

@@ -0,0 +1,43 @@
+{{>header}}
+
+<div class="container mt-4 mb-5">
+    <h2>Book "{{book.title}}"</h2>
+
+    {{#book.image}}
+    <img src="/books/{{book.id}}/image" class="img-fluid mb-4" alt="Book Image">
+    {{/book.image}}
+
+    {{^book.image}}
+    <img src="/images/no_image.png" class="img-fluid mb-4" alt="No Image">
+    {{/book.image}}
+
+    <div>
+        <p>{{book.description}}</p>
+    </div>
+
+    <p><b>Shops where book is available:</b></p>
+    <div>
+        <ul class="list-group">
+            {{#book.shops}}
+            <li class="list-group-item">{{name}}</li>
+            {{/book.shops}}
+        </ul>
+    </div>
+
+    <div class="mt-4">
+        {{#logged}}
+        <div class="btn-group">
+            {{#admin}}
+            <a href="/removebook/{{book.id}}" class="btn btn-danger">Remove</a>
+            {{/admin}}
+
+            <a href="/editbook/{{book.id}}" class="btn btn-warning">Edit</a>
+        </div>
+        {{/logged}}
+
+        <br>
+        <a href="/" class="btn btn-secondary mt-3">Back to all books</a>
+    </div>
+</div>
+
+{{>footer}}

proyectos_de_ejemplo/spring_3/sample-project-phase2/src/main/java/es/codeurjc/daw/library/model/Book.java renamed to ejemplo-practica1/src/main/java/es/codeurjc/daw/library/model/Book.java

@@ -0,0 +1,23 @@
+{{>header}}
+
+<h2 class="mb-4">Books</h2>
+
+<div class="row row-cols-1 row-cols-md-3 g-4">
+    {{#books}}
+    <div class="col">
+        <div class="card h-100">
+            <div class="card-body">
+                <h5 class="card-title"><a href="/books/{{id}}" class="text-decoration-none text-dark">{{title}}</a></h5>
+            </div>
+        </div>
+    </div>
+    {{/books}}
+</div>
+
+{{#logged}}
+<div class="mt-4">
+    <button onclick="location.href='/newbook'" class="btn btn-primary">New Book</button>
+</div>
+{{/logged}}
+
+{{>footer}}

proyectos_de_ejemplo/spring_3/sample-project-phase2/src/main/java/es/codeurjc/daw/library/model/Shop.java renamed to ejemplo-practica1/src/main/java/es/codeurjc/daw/library/model/Shop.java

@@ -0,0 +1,53 @@
+{{>header}}
+
+<div class="container mt-4 mb-5">
+    <h2>Edit Book "{{book.title}}"</h2>
+
+    <form action="/editbook" method="post" enctype="multipart/form-data">
+        <input type="hidden" name="id" value="{{book.id}}" />
+
+        <div class="mb-3">
+            <label for="title" class="form-label">Title</label>
+            <input type="text" name="title" class="form-control" id="title" value="{{book.title}}" placeholder="Title"
+                required />
+        </div>
+
+        <div class="mb-3">
+            <label for="description" class="form-label">Abstract</label>
+            <textarea name="description" class="form-control" id="description" placeholder="Description" rows="4"
+                required>{{book.description}}</textarea>
+        </div>
+
+        <p><b>Image:</b></p>
+
+        {{#book.image}}
+        <img src="/books/{{book.id}}/image" class="img-fluid mb-3" alt="Book Image">
+        <div class="form-check">
+            <input type="checkbox" name="removeImage" class="form-check-input" id="removeImage">
+            <label class="form-check-label" for="removeImage">Remove Image</label>
+        </div>
+        <div class="mb-3">
+            <label for="updateImage" class="form-label">Update Image</label>
+        </div>
+        {{/book.image}}
+
+        {{^book.image}}
+        <img src="/images/no_image.png" class="img-fluid mb-3" alt="No Image">
+        <div class="mb-3">
+            <label for="uploadImage" class="form-label">Upload Image</label>
+        </div>
+        {{/book.image}}
+
+        <input type="file" name="imageField" accept=".jpg, .jpeg" class="form-control mb-3" />
+
+        <input type="hidden" name="_csrf" value="{{token}}" />
+
+        <div class="mb-3">
+            <button type="button" onclick="location.href='/books/{{book.id}}';"
+                class="btn btn-secondary">Cancel</button>
+            <input type="submit" value="Save" class="btn btn-primary" />
+        </div>
+    </form>
+</div>
+
+{{>footer}}

proyectos_de_ejemplo/spring_3/sample-project-phase2/src/main/java/es/codeurjc/daw/library/model/User.java renamed to ejemplo-practica1/src/main/java/es/codeurjc/daw/library/model/User.java

@@ -0,0 +1,6 @@
+        </div>
+	</div>
+
+<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
+</body>
+</html>

parte_2/tema_5/security_ejem10/src/main/java/es/codeurjc/daw/library/repository/BookRepository.java renamed to ejemplo-practica1/src/main/java/es/codeurjc/daw/library/repository/BookRepository.java

@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title>Main</title>
+
+    <meta charset="UTF-8">
+    <base href=".">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
+        integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+
+</head>
+
+<!-- 3. Display the application -->
+
+<body>
+
+    <nav class="navbar navbar-expand-lg bg-dark navbar-dark px-3">
+
+        <a class="navbar-brand" href="/">Library</a>
+
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarContent">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+
+        <div class="collapse navbar-collapse justify-content-end" id="navbarContent">
+            {{^logged}}
+            <form action="/login" method="post" class="d-flex align-items-center p-2">
+                <input type="text" class="form-control me-3" name="username" placeholder="Username">
+                <input type="password" class="form-control me-3" name="password" placeholder="Password">
+                <button type="submit" class="btn btn-primary btn-nowrap w-50">Log In</button>
+                <input type="hidden" name="_csrf" value="{{token}}" />
+            </form>
+            {{/logged}}
+            {{#logged}}
+            <ul class="navbar-nav d-flex align-items-center">
+                <li class="nav-item">
+                    <span class="navbar-text fs-3 text-white mx-3">{{userName}}</span>
+                </li>
+                <li class="nav-item">
+                    <form action="/logout" method="post" class="d-inline">
+                        <button class="btn btn-primary btn-nowrap" type="submit">Log Out</button>
+                        <input type="hidden" name="_csrf" value="{{token}}" />
+                    </form>
+                </li>
+            </ul>
+            {{/logged}}
+        </div>
+    </nav>
+
+    <div class="container">

proyectos_de_ejemplo/sample-project-phase2/src/main/java/es/codeurjc/daw/library/repository/ShopRepository.java renamed to ejemplo-practica1/src/main/java/es/codeurjc/daw/library/repository/ShopRepository.java

@@ -0,0 +1,10 @@
+{{>header}}
+<form action="/login" method="post" class="d-flex flex-column gap-2 p-4">
+    <input type="text" class="form-control" name="username" placeholder="Username">
+    <input type="password" class="form-control" name="password" placeholder="Password">
+    <div class="text-start w-100">
+        <button type="submit" class="btn btn-primary">Log In</button>
+    </div>
+    <input type="hidden" name="_csrf" value="{{token}}" />
+</form>
+{{>footer}}