Jquery es una biblioteca de JavaScript, que permite simplificar la forma que tiene el usuario de interactuar con documentos de HTML, manipular el DOM, desarrollar animaciones y agregar interacción.

En este curso de jQuery  crearemos un portafolio web o un sitio web personal que nos permita mostrar nuestros trabajos de forma creativa y elegante.

Pueden encontrar los archivos iniciales para poder iniciar el curso desde Github
https://github.com/marcosrivasr/VidaM…


01. Introducción

Bienvenidos a este curso para crear un portafolio web con jQuery. En este tutorial explicaremos la Estructura básica.

02. Menú

Tutorial #2 del curso y Seguimos con nuestro curso de jQuery para crear un sitio web profesional y dinámico. En este tutorial empezamos a darle estilo a nuestro menú, lo configuramos en HTML y le damos estilo con CSS.

03.Terminando menú

Para este tutorial vamos a terminar de estilizar nuestro menú y a empezar a diseñar cómo se van a ver las secciones.

04. Secciones

Para este tutorial vamos a empezar a diseñar las secciones para que cada una tenga su anchura adecuada. También terminaremos por definir la primera sección que es la de inicio.

05. Plugin RSS 1

Para este tutorial vamos a empezar a diseñar nuestro plugin para poder cargar un RSS dentro de nuestro sitio web. En esta parte abundaremos un poco en cómo funciona el parseo de un archivo JSON.

06. Plugin RSS 2

Para este tutorial vamos a terminar el diseño de nuestro plugin para poder cargar un RSS dentro de nuestro sitio web. En esta parte abundaremos un poco en cómo funciona el parseo de un archivo JSON.

07. Plugin RSS 3

Para este tutorial vamos a terminar el diseño de nuestro plugin para poder cargar un RSS dentro de nuestro sitio web. En esta parte modificaremos la parte del CSS para que se vea estéticamente bien y con eso terminar la parte del blog en nuestro sitio.

08. Plugin Slider 1

Para este tutorial vamos a empezar el diseño de nuestro segundo plugin en el cual vamos a crear un slider para presentar una galería de imágenes sencilla.

09. Plugin Slider 2

Para este tutorial vamos a terminar el diseño de nuestro segundo plugin en el cual vamos a crear un slider para presentar una galería de imágenes sencilla.

10.  Galería de imágenes 1

Para este tutorial vamos a empezar a diseñar la interfaz para nuestra galería de imágenes, que nos va a servir como primer paso para mostrar el trabajo que tenemos en nuestro portafolio

11. Galería de imágenes 2

Para este tutorial vamos a continuar con el diseño de la interfaz para nuestra galería de imágenes, que nos va a servir como primer paso para mostrar el trabajo que tenemos en nuestro portafolio.

12. Galería de imágenes 3

Para este tutorial vamos a continuar con el diseño de la interfaz para nuestra galería de imágenes, que nos va a servir como primer paso para mostrar el trabajo que tenemos en nuestro portafolio.

13. Galería de imágenes 4

Para este tutorial vamos a continuar con el diseño de la interfaz para nuestra galería de imágenes, que nos va a servir como primer paso para mostrar el trabajo que tenemos en nuestro portafolio.

14. Galería de imágenes 5

Para este tutorial vamos a terminar con la galería de imágenes, ya haciéndola funcionar con jQuery para que de forma muy sencilla y después de muchos tutoriales funcione adecuadamente.

15. Acordeón

Para este tutorial vamos a iniciar con la sección Acerca, en donde necesitaremos construir un acordeon para mostrar diferentes secciones de una forma interactiva. Para este tutorial empezaremos con la estructura HTML.

16. CSS del acordeón

Para este tutorial vamos a iniciar con la sección Acerca, en donde necesitaremos construir un acordeon para mostrar diferentes secciones de una forma interactiva. Para este tutorial le daremos estilo a nuestro acordeón con CSS.

17.  jQuery del acordeón

Para este tutorial vamos a iniciar con la sección Acerca, en donde necesitaremos construir un acordeon para mostrar diferentes secciones de una forma interactiva. Para este tutorial terminaremos con nuestro acordeón dándole dinamismo con jQuery en un plugin muy sencillo.

18. Contacto 

Para terminar el diseño de nuestro sitio web vamos a hacer la sección de contacto del sitio. Para este tutorial vamos a utilizar solamente HTML para darle la estructura que necesitamos para crear nuestro formulario de contacto. También vamos a validar que los campos sean llenados sin necesidad de usar algún tipo de código.

19. CSS formulario contacto

Para terminar el diseño de nuestro sitio web vamos a hacer la sección de contacto del sitio. Para este tutorial vamos a utilizar solamente HTML para darle la estructura que necesitamos para crear nuestro formulario de contacto. También vamos a validar que los campos sean llenados sin necesidad de usar algún tipo de código.

20. Detalles finales

Para terminar el diseño de nuestro sitio web vamos a configurar la última parte de nuestro curso, donde configuramos el scroll para que funcione de acuerdo a la opción que usemos de nuestro menú. Además arreglamos la parte de la altura de las secciones para que siempre esté al 100% de la altura.

* Autor de este curso http://www.vidamrr.com/