INTRODUCCIoN al desarrollo web
Que es el desarrollo web?
Desarrollo web es simplemente la combinación entre
"front-end" y "back-end", la colaboración entre estas tecnologías para mostrar y generar contenido en internet.
Simple! verdad?
QUE ES LA W3C?
W3C, abreviatura de World Wide Web Consortium, es un consorcio internacional encargado de regular y producir stand-ares,recomendaciones para la World Wide Web
(o internet y punto!)
Mitos y leyendas sobre la w3c
Cuenta la leyenda que la W3C es un grupo de borrachos dedicados a regular internet, mejorando o frenando el progreso de la web
DEBIDO A ESTA RAZON..
Y OJO! ES MUY IMPORTANTE..
No sigas al PIE DE LA LETRA las recomendaciones de la W3C, parte de las recomendaciones son demasiado estrictas y no se aplican al mundo real cuando uno se encuentra desarrollando..
Si tratas de seguir al pie de la letra todas estas recomendaciones podrías terminar..
FRONT-END
Front-end
Hablar de front-end es sin duda hablar de HTML, CSS, HTML5, CSS3, Javascript, Jquery Y MAS...
Hablar y aplicar front-end se refiere a maquetar la estructura semantica del contenido (HTML), codificar el diseño de la pagina en hojas de estilo (CSS) y agregar interaccion con el usuario (Javascript)
EN LA EPOCA ACTUAL LOS FRONT-ENDS TIENEN HTML5 Y CSS3
HTML5
Con HTML5 desde el front-end es posible hacer geolocalizacion, dibujo vectorial (SVG) , dibujo a nivel de bitmaps (CANVAS), guardar datos en el disco del usuario (LocalStorage y SessionStorage), insertar audio y video sin la necesidad de plug-in's como el viejo y mitico FLASH
CSS3
Con CSS3, se pueden crear diseños altamente complejos y hermosos sin la necesidad sin la necesidad de imagenes cortadas o demasiado diseño gráfico, solo usando CODIGO.
Bordes redondeados, sombras, degradados, fondos múltiples, transformaciones, transiciones, animaciones, tipografía..
en fin CSS3 es hermoso!
Javascript
El lenguaje de programación para la web, javascript y sus diversos frameworks y librerias añaden el toque de interactividad y conexion al servidor fluidamente.
Con javascript es posible comunicarse con el back-end y la base de datos sin recargar la pagina (si, ese momento incomodo en el que estas en una web, presionas un botón para realizar una tarea sencilla y tienes que esperar que recarge toda la pagina.. -.-' AGARREN A ESE PROGRAMADOR Y LLEVENLO A LA HOGUERA! ) usando AJAX o WebSockets, recibir esos datos y cambiar el diseño del sitio. . Maravilloso!
BACK-END
BACK-END
El clasico programador tiende a ser un back-end, back-end en pocas palabras es la labor que compone el acceso a datos.. generar, modificar y eliminar informacion, gestionar la seguridad, crear informacion en base a ciertos parametros.
El back-end se encarga de implementar base de datos (MySql, Postgres, SQL Server, MongoDB), luego atraves de un lenguaje (PHP, JAVA, PYTHON) realizamos la conexion a la base de datos para recibir, procesar y enviar la informacion devuelta al navegador del usuario.
CHARLEMOS UN POCO..
Lenguajes de programacion
BASES DE DATOS
FUNCIONAMIENTO GENERAL DE UNA WEB
Toda esta bella historia comienza cuando un usuario atraves de su navegador web favorito (Chrome por favor!) realiza una petición (request) a un servidor mediante las famosas URL, el servidor procesa esta petición realizando una serie de tareas (conexión a base de datos, validaciones, seguridad, etc) y al final retorna una respuesta (response) al usuario (específicamente al navegador.. nuevamente Chrome por favor!) para representar la información.
No entendiste?
expliquemos un poco mas..
VERBOS HTTP
La peticiones (request) que envían los navegadores a los servidor se realizan mediante un verbo http..
Los mas usados:
- GET : Petición para obtener información del servidor
- POST: Petición para agregar información al servidor
Existen mas.. investiga un poco!
(PUT, DELETE..)
CODIGOS HTTP DE RETORNO
- 200 : Todo esta perfecto
- 201 : Nuevos cambios
- 3[xx] : Redireccion
- 4[xx] : Errores del cliente
- 400: No tengo ni idea de lo que pediste!
- 401: Hey! no tienes permiso de hacer esto!
- 404: No se encuentra
- 5[xx] : Error del servidor
EL DESARROLLO WEB MODERNO IMPLICA
- Diseño de prototipos - mockups (diagramar la interfaz y lo que se tiene pensado realizar
- Definir cual sera la estructura de la informacion
- Realizar el front-end de la web (puede trabajar en paralelo con el back-end)
- Realizar el back-end de la aplicacion (puede trabajar en paralelo con el front-end)
- Pruebas
Y SOBRE TODO IMPLICA..
DEJAR DE PENSAR QUE UNA SOLA PERSONA PUEDE HACER TODOS ESTOS TRABAJOS
NO A LOS TODISTAS!
SACAR UN PRODUCTO WEB MODERNO IMPLICA TRABAJO EN EQUIPO, GENTE ESPECIALIZADA EN CADA ÁREA DEL DESARROLLO PARA UN MAYOR RENDIMIENTO..
NO COGER LO VIEJO Y PARCHARLO!
NOOOO!!
TRABAJO EN EQUIPO
- Diseñador : Para el diseño de los prototipos, creacion de logos e imagenes personalizadas
- Front-end : Para llevar el prototipo a la realidad
- Back-end : Para estructura el manejo de la informacion, la seguridad y las validaciones
- Implementador de servidores : Para implementar o hacer el deploy del producto en un servidor real.
PRINCIPIOS DEL DESARROLLO WEB
Nuestro producto final debe ser:
- Bonito
- Funcional
- Seguro
- Escalable