Lección : Actividades

Actividad 1-1 (Calculando)

Realiza una sencilla calculadora.

  • Pon en una variable un número.
  • Pon en otra variable un número.
  • Suma y muestra el resultado.

Pro:

  • Realiza otras operaciones (Restar, dividir…).

Actividad 1-2 (Meeting)

  • Guarda en una variable el nombre de una chica.
  • Guarda en otra variable el nombre de un chico.
  • Muestra la frase> “A {chica} le gusta {chico}.”

Por ejemplo: A Sonia le gusta Roberto.

Pro:

Guarda en dos variables un nombre y un año de nacimiento. Muestra la siguiente frase calculando la edad: “Me llamo {nombre} y nací el {año de nacimiento}. Por lo tanto tengo 23.”

Actividad 1-3 (Impuestos)

  • Guarda un número.
  • Calcula el IVA de esa cifra.
  • Muestra la misma cifra con IVA añadido.

Pista: Para calcular el IVA debes aplicar la siguiente formula precio * 1.21.

Pro:

  • Muestra además la cifra sin iva.
  • ¡Se creativo! Formatea el resultado de forma atractiva.

Actividad 2-1 (Nos vamos de viaje)

  • Guarda en un array los nombres unos amigos.
  • Imprime la siguiente frase: “{amigo 1} se va de viaje”.
  • Crea otro array con el nombre de varias ciudades.
  • Imprime la siguiente frase: “{amigo 2} se va de viaje a {ciudad 1}”

Pro:

  • Imprime aleatoriamente el nombre de un amigo.

Pista shuffle($amigos).

  • Aleatoriamente busca dos nombre y una ciudad para generar la siguiente frase: “{amigo aleatorio} se va de viaje con {amigo aleatorio} a la bonita ciudad de {ciudad aleatoria}.

Actividad 2-2 (Agenda)

  • Crea un array con el nombre agenda.
  • Añade 2 citas (frases): “Dentista a las 12h” y otra que tú quieras.
  • Imprime con var_dump.
  • Te ha surgido un problema: Modifica la cita del Dentista a las 16h.
  • Imprime con var_dump.
  • Al final se te ha liado el día: Borra la cita con el Dentista
  • Imprime con var_dump.

Pro:

  • En lugar del var_dump, crea una lista desordenada (<ul>). ¡Pista! join().

Actividad 2-3 (Concurso de micro relatos)

Se ha convocado un concurso de micro relatos sobre sillones incómodos. El límite de palabras para ser enviadas son de 10.

  • Crea una variable con el micro relato.
  • Muestra el número de palabras usando preg_split y count.

Actividad 2-4 (Censo de población)

  • Crea un diccionario con el censo de población de: España, Portugal, Francia, Italia y Grecia. Ayudate de Wikipedia. Un ejemplo:
$censo = [
    'España' => 99999,
    ...
]
  • Ordena de mayor a menor. ¡Pista! asort hará el trabajo por ti:
asort($censo, SORT_DESC);
  • Imprime con var_dump.

Actividad 3-1 (Lista de películas)

  • Guarda en un array tus 6 películas favoritas.
  • Imprime en párrafos con el siguiente formato: ‘Película: Los Vengadores’
  • Añade la posición de la película: ‘Película 4: Godzilla’

Pro:

  • Imprime en lugar de párrafos… ¡una tabla!
  • Añade un poco de CSS para mejorar el diseño. Cada título debe tener un color aleatorio. ¡Pista!: random_int(0, 255)

Actividad 3-2 (Jugando con bucles)

  • Imprime los números del 1 al 10.
  • Imprime los números de 60 al 70.
  • Imprime los números del 20 al 1.
  • Imprime los números del 1 al 1000
  • Imprime la tabla del 5.

Pro:

  • Imprime la tabla del 5 con este formato: 5 x 3 = 15
  • Suma los números del 1 al 100.

Actividad 3-3 (Test)

Supongo que el ejemplo anterior esta claro y no tienes dudas. ¡Demuéstramelo!

  • ¿Cuantas veces se ejecuta el primer foreach?
  • ¿Cuantas veces se ejecuta el segundo foreach?
  • ¿Cuantos echos se han realizado? ¿Corresponde a las respuestas anteriores?
  • En el ejemplo tienes 2 loops anidados. ¿Cuantos piensas que pueden existir como máximo (un bucle dentro de un bucle de otro bucle…)?

Actividad 3-4 (Fecha de nacimiento)

  • Crea un select para pedir el dia de nacimiento: 1 al 31. Usa un foreach.
  • A su otro lado select para pedir el mes de nacimiento: 1 al 12. Usa un for.
  • Y a continuación otro select para pedir el año de nacimiento: 1900 al año actual. Usa un while.

Actividad 4-1 (Logicando la lógica)

  • Dime en cada caso si entraría el condicional.

1

if (True && True)

2

if (False && True)

3

if (1 == 1 && 2 == 1)

4

if ("test" == "test")

5

if (1 == 1 || 2 != 1)

6

if (True && 1 == 1)

7

if (False && 0 != 0)

8

if (True || 1 == 1)

9

if ("test" == "testing")

10

if (1 != 0 && 2 == 1)

11

if ("test" != "testing")

12

if ("test" == 1)

13

if (!(True && False))

14

if (!(1 == 1 && 0 != 1))

15

if (!(10 == 1 || 1000 == 1000))

16

if (!(1 != 10 || 3 == 4))

17

if (!("testing" == "testing" && "Zed" == "Cool Guy"))

18

if (1 == 1 && (!("testing" == 1 || 1 == 0)))

19

if ("chunky" == "bacon" && (!(3 == 4 || 3 == 3)))

20

if (3 == 3 && (!("testing" == "testing" || "PHP" == "Fun")))

Actividad 4-2 (Portero de discoteca automático)

  • Pide el año de nacimiento.
  • Calcula la edad.
  • Si es mayor de edad, dile que puede pasar dentro.
  • Si es menor, tírale.
  • Si tiene más de 65 años, dile que es demasiado mayor para entrar.

Pro:

  • Obten el año del sistema en lugar de escribirlo a mano en una variable.

Pro2:

  • Pide además el día y el mes de nacimiento para saber si ha complido el año actual.

Actividad 5-1 (Contacto fraudulento)

  • Realiza un formulario con los siguientes datos: nombre, telefono, email y mensaje.
  • Cuando se pulse en enviar debe mostrar la siguiente plantilla.

“Hola nombre!

Te voy a enviar spam a correo y te llamaré por la madrugada a telefono.

mensaje

Enviado desde un iPhone”

Actividad 5-2 (¿Quién saca al perro?)

  1. Escribe en un textarea una lista de nombres.
  2. Cuando pulses un botón debes mostrar un nombre aleatorio. (Será el encargado de sacar al perro)
  3. Muestra con la siguiente plantilla: nombre saca al perro.

Ejemplo en textarea:

Batman Superman Ironman Pescanova

Cuando es pulsado el botón…

Ironman saca al perro.

Actividad 5-3 (Cueva de Gollum)

  • Muestra la siguiente adivinanza:

“Esta cosa se devora a todas las cosas;

Pájaros, bestias, árboles, flores;

Carcome el hierro, muerde el acero;

Muele duras piedras y las reduce a harina;

Mata al rey, arruina la ciudad,

Y derriba a la montaña.”

  • En un input, pide la respuesta.
  • Añade un botón de submit.
  • Si se pulsa el botón debes comprobar si ha acertado. La respuesta es: Tiempo.
  • Si acierta felicítale.
  • Si pierde, muestra la respuesta y cómetelo.

Actividad 5-4 (Calculadora de IVA dinámica)

  • Vuelve a realizar una calculadora de IVA, pero en esta ocasión la cantidad no estará guardada en una variable sino que nos la proporcionará el usuario.

Pista: Para calcular el IVA debes aplicar la siguiente formula precio / 1.21.

Actividad 5-5 (Listado de películas)

  • Crea un input y un botón de submit.
  • Rellena el campo con el nombre de una película.
  • Cuando se puse debe guardar el contenido en un array.
  • Imprime el resultado en una tabla.

Actividad 5-6 (Notas de los alumnos)

  • Realiza un array o diccionario con unos alumnos y sus respectivas notas.

    Marta: 7,8 Luis: 5 Lorena: 6,9 …

  • Muestra las notas de una forma ordenada.

    Alumno Nota
    Marta 7,8
    Luis 5
  • Da la posibilidad de añadir nuevos alumnos.

Pro:

  • Muestra la media en la parte inferior.

Actividad 5-7 (Montaña rusa)

Para entrar en la atracción vamos a construir un validador que minimice las victimas mortales. Para ello usaremos varios requisitos.

  • Debe superar una altura de 120cm.
  • Debe tener una edad superior a 16 años.
  • ¿Rechaza llevarnos a juicio por daños y perjuicios de un mal mantenimiento?

En caso de ser todo válido le daremos el ticket.

Pro:

  • Genera un ticket con su nombre y un número único. Ejemplo: “Alfonso, ticket 00034”.

Actividad 5-8 (Formulario de padre)

  • Pide el nombre.
  • Pide el sexo.
  • Pide el número de hijos.
  • Muestra la siguiente frase dependiendo de los datos anteriores:

El señor Pepe tiene 1 hijo. El señor Pepe tiene 4 hijos. La señora Sonia tiene 1 hijo. La señora Sonia no tiene hijos.

Actividad 6-1 (Calculadora de newsletter)

Vamos a realizar un sistema que nos calcule el precio de un servicio de newsletter. Dependiendo del número de emails que enviemos costará un precio u otro. A continuación puedes ver una tabla.

De A Precio
0 2000 0 €
2001 10000 0.7 € unidad
10001 Infinito 0.2 € unidad
  • Añade un campo para indicar el número de emails a enviar. Comprueba que es un número.
  • Añade una opción para indicar si quieres un seguro por cada mensaje, lo cual tendrá un recargo por mensaje de 0.1 €.
  • Al pulsar en submit muestra el precio total.

Actividad 6-2 (Reserva de apartamentos)

El objetivo será crear diversos buscadores para encontrar nuestro apartamento ideal.

Guarda en un diccionario varios datos con la siguiente estructura.

  • Precio/noche. Comprueba que es un número.
  • Ciudad. Comprueba que es un texto.
  • Wifi. Comprueba que existe.
  • Página web. Comprueba que es un dominio válido.

Por ejemplo.

$apartamentos =[
	[
    		'precio/noche' => 37,
    		'ciudad' => 'Valencia',
		'wifi' => True,
		'pagina web' => 'https://hotel.com'
	],
	[
    		'precio/noche' => 87,
    		'ciudad' => 'Madrid',
		'wifi' => False,
		'pagina web' => 'https://motel.es'
	],
	...
];

Realiza un formulario diferente por cada campo. Imprime los resultados de una manera bonita y humana.

Pro:

  • Calcula el precio medio de los resultado (puedes usar array_reduce()).

Actividad 7-1 (Perfil)

  • Construye un formulario donde se pida la siguiente información: apodo, edad e imagen de perfil.
  • Al enviar muestra la información en un formato similar a Twitter o una red social. La imagen debe estar presente.

Actividad 7-2 (Papelería online)

  • Crea un formulario para subir un producto a una tienda: número de serie, nombre, precio e imagen.
  • Crea una página de identificación antes de entrar en los productos: nombre, contraseña 1 y contraseña 2.
  • Debe coincidir ambas contraseñas, además del nombre y contraseña con unas variables que tengamos almacenadas.

Actividad 7-3 (Optimizando imágenes de perfil)

Crea un formulario para subir un imagen. Al ser subida debes:

  • Redimensionarla a una anchura de 400 pixeles.
  • Mostrarla debajo del formulario.

Pro:

  • Convertirla en blanco y negro.
  • Crea un crop de la imagen para que sea cuadrada sin deformarla (400x400).

Actividad 8-1 (Recibo de compra)

Realiza un formulario para comprar auriculares.

  • Los campos serán: email y unidades.
  • Cada unidad cuesta 29,95 euros.
  • Envía un email, a la dirección que te han introducido, con el siguiente texto.
¡Gracias por comprar nuestros auriculares "Carmencita"!

Factura:

(número) unidades a 29,95 euros cada una.

Total: (total) euros

Actividad 8-2 (Newsletter de “Madonna”)

Eres el encargado de avisar a todos los fans de la nueva gira Europea de Madonna. Debes enviar un email HTML con la lista de las ciudades.

Fecha Ciudad
27/5 Londres
13/6 Berlín
5/7 París
8/8 Valencia

Actividad 9-1 (Identifícate)

  • Crea una web donde se pida un usuario y una contraseña.
  • Si es correcto debe llegar a una página protegida por sesión.
  • Añade un botón para cerrar la sesión.

Actividad 10-1 (Política de Cookies)

  1. Muestra un cartel avisando que debe aceptar la política de Cookies con un botón.
  2. Cuando sea pulsado crea una cookie.
  3. No vuelvas a mostrar el cartel mientras exista.

Actividad 10-2 (¿Qué idiomas hablas?)

El visitante debe tener la posibilidad de cambiar el idioma de la página.

  • Crea un botón para actualizar el idioma.
  • Guarda la selección en una cookie.
  • Muestra el texto adecuado dependiendo de la cookie existente. Si quieres en mitad de la página.

ES - Bienvenido

EN - Welcome

IT - Benvenuto

FR - Bienvenue

Pro:

  • Guarda además el color del fondo.
  • Usa banderas.

Actividad 13-1 (Banco de España)

Crea un objeto llamado Cuenta para un banco con las siguientes necesidades.

  • Variables: nombre, apellidos, DNI, saldo y activa.
  • Funciones: actualizar datos del cliente, ingresar dinero, restar dinero, bloquear, desbloquear, mostrar información del cliente.

Prueba todas las posibilidades.

Actividad 13-2 (Hotel)

Crea un objeto llamado Habitación para una cadena de Hoteles con las siguientes necesidades.

  • Variables: numero, camas, disponible, limpia y capacidad.
  • Funciones: actualizar datos de la habitación, marcar como sucia, marcar somo limpia, marcar como disponible, marcar como ocupada, ver capacidad y ver número.

Prueba todas las posibilidades.

Actividad 14-1 (Listado de artistas)

Usando la base de datos Chinook.

Crea un desplegable con <select> con los nombres de la tabla Artist. Por cada nombre debe existir un <option>.

Actividad 14-2 (Tabla de Empleados)

Usando la base de datos Chinook.

Crea una tabla HTML con los datos de Employee.

Actividad 15-1 (Concurso de microrelatos)

La RAE te encarga montar un concurso de microrelatos de 100 palabras.

  • Muestra un formulario donde se pueda enviar: título, relato, nombre y email.
  • Guarda la información en la base de datos unicamente si los datos son correctos.
  • Envía un email de confirmación.
  • Lista en la parte inferior en relato con todos los anteriores.
  • Enseña un contador con todos los relatos guardados.
  • Añade un boton para dar un Me gusta.

Actividad 15-2 (Mi lista de series)

Es hora de apuntar en algún sitio todas las series que has visto, son demasiadas y tu memoria muy corta.

  • Realiza una tabla en MySQL con el nombre series.
  • Crea un campo (input) para escribir el título y un botón con el texto “Añadir”.
  • Al pulsar sobre el botón se guardará en la tabla MySQL.
  • Muestra todos los titulos de la base de datos en una tabla HTML.
  • Incluye, en cada fila de la tabla, un botón con el texto “Borrar”.
  • Cuando sea pulsado, deberá desaparecer el título de la base de datos.
  • Incluye, en cada fila de la tabla, un botón con el texto “Modificar”.
  • Al ser presionado te conducirá a una nueva página donde podrás modificar el texto del título. Al guardar el cambio te redireccionará de nuevo a la anterior página.

Pro:

  • Añade a la tabla de MySQL el campo nota. Modifica tu actividad para que pueda incluir, además del título, la valoración entre el 0 y 10.
  • Ordena los resultados por nota.

Pro 2:

  • Realizar un buscador.

Actividad 15-3 (Lista de contactos)

  • Realiza un CRUD para guardar la siguiente información: Nombre, apellidos, teléfono y Email.

Actividad 16-1 (Plantas)

  • Descarga el archivo SQL del siguiente enlace.
  • Migra la información a una base de datos usando una interfaz de MySQL como PHPMyAdmin o Adminer.
  • Lista todas las columnas en una tabla HTML.
  • Muestra únicamente 25 resultados.
  • Añade un botón para avanzar de página.
  • Inserta otro botón para retroceder.

Pro:

  • Si esta en peligro, muestra el nombre en rojo.
  • Crea un formulario para introducir nuevas plantas.
  • Coloca un botón en cada fila para borrar.
  • Coloca un botón en cada fila para modificar.

Actividad 16-2 (Artistas paginados)

Usando la base de datos Chinook, imprime en una tabla todos los artistas.

  • Pagina los resultados de 10 en 10.
  • Añade un botón para ir a la siguiente página.
  • Añade un botón para retroceder a la anterior página.

PRO:

Crea una previa de páginas siguientes con 5 futuras.

Por ejemplo, si estas en la página 1.

1 - 2 - 3 - 4 - 5 Siguiente

Si estas en la página 12.

Anterior 12 - 13 - 14 - 15 - 16 Siguiente

Actividad 18-1 (Agentes secretos)

Has ascendido como funcionario del estado y ahora te piden construir una plataforma para que los agentes secretos puedan saber el nombre de sus compañeros y no los eliminen por error.

  • Crea una página de login: email y contraseña.
  • Si son introducidos son correctos, redirecciona a una página segura. Esta página tendrá los nombres de los agentes secretos del gobierno y un campo de texto para añadir nuevos. Esta información vendrá de la base de datos.
  • En caso de no ser los datos erróneos será avisado el usuario.
  • Da la posibilidad de cerrar la sesión.

Pro:

  • Otorga la posibilidad de cambiar la contraseña.

Actividad 18-2 (Blog de cocina)

Debes construir un gestor para publicar recetas de cocina. Mínimo debe disponer:

  • Login.
  • Registro.
  • Recuperar contraseña.
  • Base de datos.
  • CRUD de recetas.
  • CRUD de categorías.
  • CRUD de comentarios.

Actividad 18-3 (Instagram)

  • Crea varios campos para subir imágenes.
  • Muestra el resultado en un Grid vertical.

Actividad 18-4 (Twitter privado)

  • Crea una página donde te puedas registrar: username (apodo), contraseña y correo.
  • Crea una página donde te puedas identificar.
  • Crea una página privada con todos tus mensajes.
  • Da la posibilidad que los usuarios puedan publicar nuevos.
  • Crea un botón para salir.

Actividad 19-1 (API masa corporal)

Debes enviar por GET la siguiente información.

  • Peso corporal.
  • Altura.

Devolverás un JSON con el calculo del indice ademas de algunos datos extra como si el peso es adecuado.

Pro: Genera un testing para el Endpoint que acabas de crear.

Diseña una base de datos para que los corredores de una carrera se puedan inscribir.

Necesitarás los siguientes Endpoints.

  • Inscribirse.
  • Obtener información del corredor.
  • Obtener todos los corredores.

Pro: Genera un testing para el Endpoint que acabas de crear.

Actividad 19-3 (API Episodios de los Simpsons)

Busca en internet un CSV con toda la información referente a los episodios de los Simpson.

  1. Lee el archivo desde PHP y genera un Endpoint que devulva un JSON.
  2. Genera una tabla HTML desde JavaScript consumiendo el Endpoint.
  3. Modifica el Endpoint para permitir una paginación.
  4. Crea un nuevo Endpoint para filtrar por nombre.
  5. Modifica JavaScript para que use el paginador, añadiendo botones para pasar de página, y un campo para buscar por nombre consumiendo el Endpoint del filtro.

Actividad 19-4 (Slack de pingüinos)

Crea un API, con sus correspondientes Endpoints para crear un feed de mensajes similar a Slack pero orientado a pingüinos.

  • El HTML será generado por JavaScript por medio de AJAX.
  • El scroll de mensajes será infinito.
  • Se podrá añadir un mensaje.
  • Se podrá borrar tus propios mensajes.

¿Te ayudo?

  • 1 café: ¡Gracias por el apoyo! Te ayudo a que esta web siga estando online pagando los servidores.
  • 2 cafés: Respondo a una duda en los comentarios.
  • 4 cafés: Te corrijo una actividad y te envío feedback.
Comprame un café

Comentarios

{{ comments.length }} comentarios

Nuevo comentario

Nueva replica  {{ formatEllipsisAuthor(replyComment.author) }}

Acepto la política de Protección de Datos.

Escribe el primer comentario