Presentación del curso, explicación de la página web que conseguiremos después de los capítulos.

Diseñamos la estructura de nuestra Web, el wireframe, la orientaremos principalmente a escritorio y a móviles, además de Tablets. Creamos nuestro sitio de Dreamweaver en local..

Creamos la plantilla en Dreamweaver con la que trabajaremos en nuestra Web, creamos la estructura y los archivos de inclusión que nos servirán para ir construyendo nuestra página.

Creamos el logo y vemos una forma de analizar nuestros colores para la Web. Entendemos la estructura de carpetas de la Web para poder seguir trabajando.

Ajustamos el estilo para que sea adaptable a resoluciones más pequeñas como móviles y tablets. Creamos la Base de Datos con la primera tabla, la de usuarios.

Creamos el primer formulario de alta de usuario. Conectamos a la Base de datos a través de las ayudas que nos proporciona Dreamweaver.

Exportamos la Base de Datos con phpmyadmin. Creamos y modificamos con Spry los campos obligatorios del alta de usuario.

Modificamos los estilos CSS para mejorar la visualización de los formularios. Empezamos a crear el formulario de usuario y contraseña.

Comenzamos con el formulario de acceso ayudándonos de las herramientas de Dreamweaver. Encriptamos la contraseña en la Base de Datos.

Resolvemos el problema con el include y codificamos la contraseña del usuario en la Base de datos para que quede encriptada. Continuamos con el acceso y alta de usuario.

Aprendemos a utilizar más de un formulario en una misma página y aumentamos el número de campos de la Base de Datos para albergar más información del usuario.

Modificamos el acceso a usuario para obtener el valor del campo que nos servirá para identificar de forma única cada usuario.

Creamos un formulario de modificación de datos para modificar el nombre y el sexo del usuario que está dado de alta en el sistema y ha accedido.

Preparamos un archivo funciones.php que albergará todas las funcionalidades de nuestra red social, de forma sencilla y eficiente.

Comenzamos con la creación de un formulario que nos subirá una imagen al servidor en PHP. Limitaremos su tamaño y su tipo.

Finalizamos la creación del formulario y mostramos la imagen del usuario en la barra lateral, muy al estilo de otras redes sociales.

Utilizamos javascript para hacer que nuestra foto se actualice automáticamente cuando la cargamos. Empezamos con modificaciones simples de CSS para mejorar el estilo de la Web.

Utilizamos CSS para ir dando estilo a los diferentes bloques de la página Web. Modificamos directamente y vemos los resultados en la página conforme los vamos desarrollando.

Creamos una tabla para insertar los mensajes de las personas, indicando la fecha de publicación. Creamos un formulario para que los usuarios puedan insertar sus mensajes. Utilizamos las ayudas de Dreamweaver para crear las consultas que necesitamos.

Limitamos el acceso a los comentarios del muro exclusivamente a usuarios registrados. Hacemos una consulta para ver los últimos comentarios. Comenzamos formateando los datos que obtenemos de esta consulta.

Modificamos la función de muestra de las imágenes para mejorar la visualización de los comentarios. Aprendemos a formatear la fecha que nos saca la BD de MySQL en PHP con una función.

Probamos el formulario de inserción de comentarios. Comenzamos con la construcción del “muro” de nuestro apartado privado de la red social. Creamos nuevas zonas laterales para los diferentes apartados de nuestra Red Social.

Iniciamos la distinción entre muro público y privado. Comprobamos el funcionamiento con dos navegadores diferentes con dos usuarios, para ver el efecto en cada uno de ellos. Comenzamos con la inserción de la imagen, para poder meter una foto en el comentario de los muros.

Preparamos la subida de imágenes, asociándolas a una carpeta por cada usuario, comprobamos que el fichero no existe anteriormente para no sobreescribirlo.

Preparamos una función para que nos genere un nombre aleatorio cuando el nombre de la imagen coincide. Mostramos la imagen en el muro.

Finalizamos la programación de los muros. Comenzamos la creación de un sistema de mensajería interno, para poder enviar mensajes a los otros participantes de la Web.

Continuamos con la creación del apartado de mensajería interna, los apartados de mensaje nuevo, mensaje recibido, etc…

Creación del formulario de mensaje nuevo a otra persona de nuestra red social. Comprobamos en la Base de Datos, donde se guarda la información del formulario, la fecha de envío, si se ha leído o no, etc…

Distinguimos entre bandeja de entrada y bandeja de enviados. Construimos la plantilla de los mensajes enviadas transformándola en una función que unificará con un formato similar, todas las comunicaciones de la Web.

Finalizamos la construcción del formato de email que se enviará en las diversas acciones de la Web. Mostramos por pantalla como se vería ese email.

Creamos una imagen parpadeante de aviso de nuevos mails. Creamos una función que nos detecte si tenemos mensajes sin leer en la aplicación.

Comprobamos mediante una función si el correo interno se ha leído o no. Comenzamos con la solicitud de amistad en la aplicación.

Modificamos el PHP y la base de datos para distinguir si un mensaje corresponde a solicitud de amistad o únicamente a mensaje del muro. Comenzamos con la preparación de la programación para aceptar-rechazar las solicitudes.

Continuamos con la creación de la función que nos permitirá controlar el estado de una petición de amistad.

Finalizamos la comprobación del estado de las peticiones de amistad y mostramos la lista de amigos de cada uno de los usuarios.

Creamos las opciones de privacidad para cada usuario. Campos checkbox útiles para definir selecciones concretas.

Utilizamos funciones para saber si un usuario tiene o no permitido recibir mensajes. Comprobamos si una amistad está en curso. Generamos una tabla con la lista de los países para que el usuario seleccione el suyo.

Completamos la tabla de países y adecuamos el formulario de modificación de datos. Comenzamos con los álbumes de fotos de usuarios. Creamos las tablas para almacenar los álbumes.

Utilizamos las herramientas de Dreamweaver para hacer en PHP los formularios que nos servirán para crear los nuevos álbumes que contendrán fotografías y ficheros.

Creamos un script para la subida múltiple de ficheros al servidor en PHP, permitiendo diferentes tipos de archivo y controlando el tamaño máximo del archivo.

Continuamos con la programación  del apartado de subida múltiple, dando acceso a ficheros de tipo doc, docx, pdf, jpg y png.

Resolvemos el problema con los condicionales. Creamos el código para que las imágenes queden registradas también en la Base de Datos. Detectamos y resolvemos errores de las consultas.

Iniciamos la página donde visualizaremos las imágenes de los álbumes creados, revisamos los errores en las rutas.

Revisamos los CSS para ajustar la muestra de las imágenes dentro del álbum. Creamos una función para que nos cuente cuantas visitas tiene la imagen o documento que estamos viendo.

Habilitamos la posibilidad de que otra persona pueda consultar nuestros álbumes.

Comprobamos el estado de una amistad para saber si está activa o no. Iniciamos la protección también cuando alguien intenta acceder a los contenidos de los álbumes sin permiso.

Añadimos una función para saber a quién pertenece un álbum.

Utilizamos funciones para que otros usuarios no puedan ver álbumes de los que no son amigos nuestros. Ponemos el volver atrás en las páginas del álbum. Comenzamos con la realización de valoración por estrellas en SQL y Jquery.

Continuamos con la generación del código para realizar la votación por estrellas, con PHP y JQuery. Creamos la tabla asociada que nos almacenará el rating de cada foto o archivo del álbum.

Seguimos las instrucciones paso a paso para el sistema de valoración por estrellas y para reconocer si el producto ya tiene o no votos.

Revisamos el número de valoraciones de las estrellas. Evitamos que una persona que ha votado ya, vuelva a votar.

Revisamos si la persona que ha subido la foto es la misma que intenta votarse a sí mismo, para evitarlo. Mostramos un mensaje de agradecimiento cuando se vota. Modificamos la zona de los álbumes para que reconozca cuando es un documento o una imagen. Averiguamos la extensión de un archivo para el proceso.

Finalizamos la parte de reconocimiento y distinción de archivos gráficos y de documento del álbum. Iniciamos la programación del selector de fecha, para ello agregamos el campo fecha de nacimiento a los datos de perfil.

Finalizamos el selector flotante de fecha, el querypicker, como se llamaría. Comenzamos con la paginación numerada del apartado del muro.

Continuamos con la creación de la paginación numerada en PHP en base al código dado.

Creamos botones de aspecto más atractivo y en CSS, de forma que les podemos dar el ancho que necesitemos.

Finalizamos el gráfico del botón dinámico. Asignamos validación a los elementos del formulario, marcando en rojo cuando nos faltan datos, todo en sencillo javascript. Realizamos el cierre de sesión en PHP.

Solucionamos el problema con el cierre de sesión. Controlar que el email en el alta no existe ya en la Base de Datos para evitar usuarios duplicados.

Solicitamos al nuevo usuario que escriba su contraseña dos veces para evitar errores. Creamos un antispam sencillo, más efectivo que un Captcha y mucho más sencillo. Creamos el campo de modificar contraseña de usuario.

Finalizamos y comprobamos que la contraseña cambiada se guarda correctamente en la Base de datos. Creamos el procedimiento para enviar un email de recuperación de contraseña.

Continuamos con el procedimiento de recuperación de contraseña de los usuarios.

Parte final del procedimiento para recuperar la contraseña de usuario. Comenzamos con la preparación del hosting para subir al Web a un dominio real.

Preparamos el servidor remoto y exportamos la Base de datos al servidor para poder utilizarla. Comprobamos, ya en el servidor, que funciona la recuperación de contraseña.

Revisamos los caracteres y acentos en el email que se recibe. Creamos el mail de confirmación de usuario y el campo en la Base de Datos que nos confirma la existencia de ese email.

Revisamos los permisos de las carpetas que utilizamos para subir imágenes al servidor, y comprobamos que todo está correcto.

Revisamos el problema que había en el envío de los emails. Realizamos una encriptación sencilla de los datos que se pasan por URL para evitar que los usuarios puedan llegar a ver zonas que no deseamos.

Revisamos el pequeño algoritmo de encriptación para que funcione correctamente. Canonicalización de la página con WWW.

Revisamos el htaccess para que finalmente nos funcione. Ponemos las condiciones de uso de la página. Colocamos el código de Google Analytics y activamos la página con las herramientas de Webmaster. Preparamos la Base de datos para preparar la programación de los selectores dependientes, o “dependant dropboxes”, todo en Jquery y sin recargar la página.

Continuamos con los desplegables dependientes en PHP y JQuery. Creamos una tabla donde guardaremos los datos de las actividades extras de la persona.

Mostramos los datos que hemos insertado con el desplegable dinámico en la página de actividades extras del usuario.

Solucionamos el problema al mostrar los datos extra del usuario y damos la posibilidad a la persona para que borre sus propios datos de actividades.

Programamos la posibilidad de eliminar los datos extra del usuario, por él mismo. Resolvemos algunos problemas con usuarios ya reales. Eliminamos la encriptación de la URL. Creamos un campo nuevo para saber si la persona ha accedido al sistema, con el fin de saber los usuarios activos en el sistema.

Realizamos una función para detectar y controlar los tiempos de cuándo fue la última vez que un usuario entró al sistema y realizó acciones con el fin de tener claro el último momento que el usuario hizo algo.

Cambiamos la plantilla principal para añadir el bloque de usuarios conectados en los últimos minutos. Comenzamos con la instalación del script de chat. Es un modulo con licencia GPL que utilizaremos para hacer un chat muy similar al de Facebook en PHP y guardando los datos en MySQL.

Configuramos el chat para que el propio usuario no salga en los usuarios conectados, así como aquellos usuarios que no hayan completado su nombre.

Reparamos las opciones necesarias para que nos funcione el chat. Ultimamos temas de links y hacemos la imagen principal del logo elástica para que se vea bien en móviles y tablets.