Diseño de aplicaciones interactivas
Erick Fernando Martínez Viruette
(trabajo en progreso)
emartinez@enesmorelia.unam.mx
erick.martinez@tec.mx
Profesor
Preparación del
entorno de trabajo
Erick Fernando Martínez Viruette
Preparación del entorno
- Integrated development environment (IDE)
- Control de versiones
- Navegadores para desarrolladores
Integrated Development Environment (IDE)
Control
de
versiones
Cualidades:
- Mecanismo de almacenamiento de los elementos a gestionar.
- Posibilidad de realizar cambios sobre tales elementos.
- Registro histórico de las acciones realizadas con cada elemento (además, quien lo realizó).
Beneficios
- Favorece el trabajo ordenado
- Facilita el archivado de las versiones
- Mantiene en orden la información histórica
- Habilita la colaboración
- Administra el espacio de almacenamiento
- Ofrece un medio para la recuperación ante borrado o mala edición
Navegadores para desarrolladores
Localhost
Servidor local
XAMPP
X (cualquier OS)
A pache
M ySQL/MariaDB
P HP
P erl
HTML
Timothy "Tim" Berners-Lee
Se le considera el padre (junto a su equipo) del Internet o la World Wide Web.
La web debe ser una forma de comunicación universal, no restrictiva
Intercreatividad
El proceso de hacer cosas o resolver problemas juntos. […] tenemos que ser capaces no solo de encontrar cualquier tipo de documento en la web, sino también de crear cualquier tipo de documento, fácilmente […] Tendríamos que ser capaces no solo de interaccionar con otras personas, sino crear con otras personas.
Berners-Lee, 1999.
HTML
Sintaxis
vs
Para complementar (w3schools):
Web semántico
Para complementar:
CSS
CSS
Sintaxis
Declaration block
{
CSS Externo
Recordar la sintaxis:
Propiedad : Valor
Selector
CSS Interno
Recordar la sintaxis:
CSS Inline
Orden en cascada
(cascading order)
- Inline
- Externo e Interno
- Default del navegador
Para complementar (w3schools):
CSS
Flexbox
Para complementar (w3schools):
Otros editores tipo WYSIWYG:
CSS
Media queries
CSS
Animaciones
Para complementar (w3schools):
Otros recursos:
Javascript
Javascript ≠ Java
Document Object Model
Para complementar (w3schools):
Web Audio API
audioContext y nodos
Audio source
(nodo)
Audio
filter
(nodo)
Destination
(nodo)
audioContext
Tone.js
Es un entorno de trabajo (framework) para crear música interactiva en el navegador.
Javascript
JQuery
Javascript
Librerías
(solo algunos ejemplos)
Para más ejemplos y documentación, click sobre la imagen:
p5.js
(Javascript)
PHP
Hypertext Pre Processor
SQL
Structured Query Language
Content Management System
Sistema manejador de contenido
https://www.markethink.net/blog/sistemas-gestion-de-contenidos-cms/
https://www.cefove.com/sobre-los-cms/
Para complementar (wikipedia):