Conocimientos y habilidades que adquieres realizando este curso

  • ✓ Conocerás toda la potencialidad de un preprocesador CSS como Sass
  • ✓ Practicarás muchas de las posibilidades de Sass mediante la ejecución de casos prácticos propuestos.
  • ✓ Usarás la herramienta Gulp para, junto con Sass, desarrollar un workflow para el desarrollo FrontEnd
  • ✓ Crearás un nuevo tema para el Framework CSS BootStrap
  • ✓ Desarrollarás un mini Framework CSS desde cero usando Sass y Gulp.

Temario

  • Características e instalación

    6m
  • Ventajas y desventajas de usar Sass

    4m
  • Elementos básicos de Sass

    20m
  • Compilando archivos Sass

    9m
  • Ejercicio práctico I

    14m
  • Estructuras de control y funciones

    14m
  • Ejercicio práctico II

    11m
  • Reglas y directivas

    10m
  • Mixins

    10m
  • Documentando Sass con SassDoc

    10m
  • Ejercicio práctico III

    10m
  • Descargando BootStrap

    4m
  • Comprendiendo la organización del proyecto

    4m
  • Creando mi tema (Parte I)

    11m
  • Creando mi tema (Parte II)

    10m
  • Generando un nuevo tema con Sass/Gulp

    10m
  • Estructura de mi proyecto

    4m
  • Workflow de Sass/Gulp

    6m
  • Creando mi framework (Parte I)

    9m
  • Creando mi framework (Parte II)

    11m
  • Creando mi framework (Parte III)

    7m
  • Usando mi propio framework

    5m

Relacionado

Te dejamos una selección de cursos, carreras y artículos

Curso de HTML5 y CSS3

Curso de HTML5 y CSS3

curso

Con este curso aprenderás:

  • Aprenderás lo qué es HTML y CSS.
  • Conocerás la estructura de una página Web.
  • Podrás añadir todo tipo de contenido a dichas páginas web.

Duración: 4 horas y 21 minutos

Curso de Responsive Web Design

Curso de Responsive Web Design

curso

Con este curso aprenderás:

  • Que es diseño responsive o responsivo.
  • Uso de viewports.
  • Qué es y uso de Media Queries.

Duración: 1 hora y 37 minutos

Curso de maquetación web con CSS

Curso de maquetación web con CSS

curso

Con este curso aprenderás:

  • Aprenderás a crear de manera clara y eficaz la estructura de tu Web colocando los elementos donde tú deseas.
  • Conocerás el funcionamiento a nivel de maquetación de los distintos tipos de etiquetas.
  • Comprenderás cómo funciona el flujo de una Web

Duración: 2 horas y 10 minutos

Preguntas Frecuentes

En OpenWebinars no vendemos cursos o talleres unitarios.

Tenemos diferentes tipos de suscripciónes, que te dará acceso completo a todos los cursos de la plataforma y a los nuevos que vamos lanzando, siempre y cuando tu suscripción esté activa (como Spotify con la música o Netflix con las películas y series).

¿Eres una empresa? Tenemos planes especiales para tí. Consúltanos aquí.

En OpenWebinars los cursos no tienen fecha de inicio y de final.

Cada curso tiene una fecha de publicación y desde ese día estarán 100% disponible todos los contenidos del curso para los usuarios suscritos a alguno de nuestro planes.

Si estás suscrito al plan Profesional o VIP, en todos los cursos existe un examen final para evaluar tus conocimientos adquiridos. Si superas este examen con más de un 80% de preguntas correctas obtendrás el diploma de certificación. Puedes realizar un intento cada 24 horas.

Este diploma es un certificado privado emitido por OpenWebinars, y valorado en el mundo empresarial, ya que tenemos grandes compañías clientes que se forman con nosotros y valoran nuestras certificaciones.

No olvides poner tu certificación en tu perfil Linkedin y en tu currículum.

Descripción

Este curso de desarrollo con Sass es un curso ideal para todos aquellos que quieran tener una mejor comprensión global sobre el desarrollo frontend, quieran conocer herramientas y frameworks para mejorar el mismo y quieran mejorar su proceso de desarrollo y hacerlo más organizado.

Podrás realizar este curso online de forma exitosa cumpliendo algunos requisitos previos, como son poseer un conocimiento amplio sobre HTML, también sobre CSS, al menos todo lo referente a selectores y maquetación, y tener ciertos conocimientos básicos sobre programación. Si además sabes algo sobre Bootstrap, mucho mejor.

Si no cumples estos requisitos, te recomendamos preparar previamente los cursos necesarios, que encontrarás en nuestra plataforma, como son el curso de HTML5 y CSS3, el curso de introducción a la programación y el curso de bootstrap 4, todos ellos incluidos en la suscripción.

La formación se compone de cuatro bloques, cada uno centrado en un aspecto del desarrollo frontend, para que vayas adquiriendo los conocimientos de forma organizada y estructurada en clases no muy extensas, para ayudarte a la comprensión.

Comienza el curso con una primera toma de contacto con el tutor y con el curso, quién realiza una introducción sobre él mismo y sobre el temario. Después explicará el glosario de conceptos básicos, como frontend, preprocesador CSS, web component, build-tools o task runners y workflow.

Para completar esta primera parte introductoria, podrás ver los componentes y programas que componen el entorno de trabajo recomendado y que se utilizará durante el resto del curso, para que puedas instalarlo en tu equipo.

Una vez finalizada esta primera sección, comenzaría ya el primer bloque formativo propiamente dicho, el cual se va a centrar en Sass, el preprocesador CSS que utilizaremos y en el que se basa todo este curso online.

En las diferentes lecciones que componen el bloque de Sass aprenderás sus características principales, sus ventajas más destacadas y algunas de las desventajas que presenta respecto a otras opciones, así como instalar la última versión del mismo.

También irás conociendo los elementos básicos de esta herramienta (variables, comentarios, listas, mapas, interpolación y anidamiento), para después aprender a realizar una compilación con Sass.

Seguidamente realizaremos el ejercicio práctico propuesto por el profesor, el cual te servirá para plasmar de forma más visual todo lo visto de forma teórica hasta este momento.

En la recta final del apartado dedicado a Sass se hablará sobre las estructuras de control y las funciones del mismo (@if, @else, @while, @for, @each), sus directivas (@import, @extend, @error, @warn, @debug, @at-root, @media, @support, @keyframes) y los mixins.

De todos estos conceptos se realizarán unos completos ejercicios prácticos con los que asentar estos conocimientos de una forma mucho más fácil. Y para completar el bloque, veremos cómo documentar nuestro proyecto CSS con la herramienta SaasDoc, realizando también una práctica sobre este proceso.

El siguiente bloque trata sobre Gulp, un task runner o build-tool que nos proporciona muchas posibilidades. Comenzarás aprendiendo a instalar esta aplicación y a crear un primer proyecto con ella, y a continuación se explicará cómo generar las tareas con el fichero gulpfile.js.

En el resto de clases de este segmento dedicado a Gulp te mostraremos una serie de interesantes plugins con los que extender sus funcionalidades, como gulp-concat o gulp-dart-sass entre otros, y también cómo definir nuestro workflow y qué tareas lo componen.

Llegamos al penúltimo apartado del curso, en el que aprenderás a crear tu propio framework de trabajo utilizando Bootstrap, un completo y conocido framework CSS. Comenzaremos explicando qué es Bootstrap, sus ventajas e inconvenientes y cómo descargar e instalarlo en nuestro sistema.

Seguidamente pasamos a explicar cómo se organiza un framework CSS de manera profesional, para que conozcas su estructura de directorios, el fichero package.json y la carpeta Scss. Después aprenderás a adaptar un tema ya existente en Bootstrap y modificándolo según tus necesidades, y también cómo generar un tema nuevo propio utilizando Gulp.

Para concluir el curso te enfrentarás al segmento en el que vamos a desarrollar nuestro propio mini framework CSS, aplicando todos los conocimientos que se han visto a lo largo del curso hasta llegar aquí, pudiendo de esta forma comprobar todas las posibilidades que ofrece el uso de Sass y Gulp conjuntamente.

En este proceso partiremos de una estructura previa de directorios, crearemos los componentes de nuestro framework, estableceremos el flujo de trabajo con Sass y Gulp, comenzaremos la creación del framework y acabaremos utilizando el mismo para desarrollar una página web.

Comprobarás que este curso de Sass desde cero se ha desarrollado enfocándolo principalmente a que aprendas de una forma muy centrada en la práctica, de forma que comprendas la teoría y de forma inmediata con los ejercicios aplicados la asimiles mucho más rápidamente.

Aprender Sass y complementarlo con el uso de Gulp y de Bootstrap tal y cómo el profesor explica a lo largo de esta formación, hará que mejores tu perfil como desarrollador frontend o desarrollador web de una forma más profesional.

* Requisitos del Curso

Para poder realizar con soltura el curso es necesario que tengas conocimiento sobre HTML, sobre CSS y todas las posibilidades que tenemos para maquetar. 

Estas son algunas de las empresas que ya confían en OpenWebinars

Profesores y profesionales

Nuestros docentes son profesionales que trabajan día a día en la materia que imparten

Conviértete en profesor de OpenWebinars