¿Qué quieres aprender?

ESAT Online - Herramientas para el desarrollo front-end

ESAT Online - Herramientas para el desarrollo front-end

ESAT - Escuela Superior de Arte y Tecnología

Curso online


69

En el desarrollo de cualquier proyecto Web se dan situaciones específicas que requieren herramientas específicas. Aprender a utilizar estas herramientas con soltura es una de las diferencias entre el amateur y el profesional. Juntas, subirán tu workflow a un nuevo nivel.

En el curso de herramientas de desarrollo Web aprenderás:

Cómo funciona la línea de comando.

Utilizar un sistema de control de versiones (GIT) en tus proyectos.

Qué es un task runner y cómo utilizarlo.

Qué es un module bundler y cómo utilizarlo.

Uso de FTP, SFTP, SSH.

Mucho más.

El curso pertenece al Pack formativo de Desarrollo Front-end.

¿Quieres hablar con un asesor sobre este curso?

Objetivos

Al finalizar este curso dominarás las herramientas que todo desarrollador o desarrolladora moderna utiliza en su día a día.

A quién va dirigido

El curso va dirigido a cualquier persona que quiera dar el siguiente paso en el mundo del desarrollo Web, aprendiendo a utilizar el arsenal de herramientas Web estándar de la industria en sus propios proyectos.

Requisitos

Para aprovechar al máximo este curso, debes sentirte confortable con HTML, CSS y JavaScript, cultivar una actitud de mejora continua, ganas de aprender y 30 minutos al día.

Temario completo de este curso

COMMAND LINE

¿Qué es? Como siempre, comencemos por entender qué es la línea de comando y por qué utilizarla.
¿Dónde obtener ayuda? Veamos dónde buscar ayuda a la hora de utilizar la línea de comando.
Trabajando con directorios. Una de las operaciones más comunes es manipular directorios. Veamos cómo hacer sin salir del terminal.
Crear archivos. Otra de las operaciones esenciales: crear archivos y directorios. Veamos cómo.
Eliminar. En la línea de comando no existe la “papelera de reciclaje” por lo que eliminar siempre conlleva un extra de atención.
Renombrar y mover. A través de de un único comando podemos mover y renombrar archivos y documentos.
Copiar. Veamos cómo copiar archivos y directorios de forma sencilla con el comando cp.
Mostrar, editar y filtrar. Linux/Unix provee varios comandos para realizar tareas del día a día con archivos.
Encontrar. Con el comando find podemos buscar patrones en las rutas y nombres de archivos desde el terminal.
Permisos, usuarios y grupos. Aprende los fundamentos sobre la creación de usuarios en Unix/Linux.
Cambiar permisos. Con los comandos chmod y chown podemos cambiar los permisos y los usuarios y grupos a los que pertenecen archivos y directorios.
Sudo. Para realizar algunos comandos elevados es necesario que sean prefijados por sudo, de “superuser do”.
Enlazar. En Linux/Unix podemos crear enlaces (duros o simbólicos) entre dos archivos o directorios.
Curl. Curl es una de las herramientas más poderosas y tu aliado como desarrollador/a Web. Veamos sus fundamentos.
iTerm y ZSH. Ahora que ya tienes las bases esenciales sobre la línea de comando, es hora de personalizar el terminal y cambiar de shell.
GIT

Introducción. En esta lección aprenderás lo que es GIT, para qué sirve y por qué se convertirá en tu mejor amigo.
Usando GIT por primera vez. Veamos el uso más esencial de GIT en un proyecto.
Corrigiendo commits. ¿Qué ocurre si haces un commit a destiempo o sencillamente quieres corregirlo?
GIT diff. GIT permite visualizar de forma clara las diferencias entre dos o más archivos.
GIT branching. Sin duda alguna una de las características estrella de GIT es la posibilidad de crear diferentes ramas (líneas de tiempo) independientes donde probar lo que quieras sin alterar el núcleo principal de tu proyecto.
Resolver conflictos. No importa el proyecto, más tarde o más temprano aparecerá algún conflicto a la hora de ser gestionado por GIT. Por suerte solucionar los más típicos es sencillo.
GIT stash. A veces tienes que dejar lo que estás haciendo para centrarte en otra área de tu proyecto, pero no estás listo para hacer un commit ¿Qué se puede hacer en esta situación?
GITHub. GITHub es una herramienta online donde puedes compartir y colaborar con otros desarrolladores/as a través de repositorios remotos.
GIT rebase. Haciendo rebasing puedes escribir la historia de tu proyecto de una forma más clara y mantenible.
GIT aliases. Veamos cómo crear atajos para los comandos GIT más utilizados.
OTRAS HERRAMIENTAS

FTP. FTP es un protocolo de transferencia de archivos omnipresente e muy utilizado a la hora de publicar proyectos digitales.
SSH. Con SSH podemos acceder a la shell de otra máquina y administrarla de forma remota.
SSH keys. Utilizando un algoritmo de autentificación basado en un par de claves (pública y privada) podemos prescindir de la contraseña en nuestras acciones SSH.
GitHub pages. GitHub ofrece de forma gratuita un servicio de hospedaje para páginas estáticas que se integra a la perfección en tu workflow GIT.
NPM. NPM es el gestor de módulos/paquetes de Node y la piedra angular del desarrollo Web actual.
BrowserSync. Con BrowserSync podrás testear el aspecto e interacciones de tus proyectos Web en varios dispositivos y navegadores a la vez.
Gulp instalación. Gulp es uno de los task runners más populares. Puede hacerte la vida más sencilla. Vamos a aprender cómo.
Gulp tasks. Con las tareas puedes decirle a Gulp lo que quieres hacer y cómo quieres hacerlo.
Gulp watch. Gulp puede “observar” de forma automática los archivos que decidas y lanzar tareas que realizan acciones.

WEBPACK
Introducción. Como siempre, el primer paso es aprender qué es Webpack (como herramienta) y por qué es interesante que aprendas a utilizarlo a nivel esencial.
Configuración. En la mayoría de proyectos con Webpack deberemos tener una configuración personalizada.
Cargadores. Una de las caracteristicas más potentes de Webpack. Permiten transformar e interpretar de otra forma el código que conforman los módulos.
Babel. Con el transpilador Babel y Webpack podrás utilizar el JavaScript más moderno en cualquier navegador.
Plugins. Otro de los conceptos troncales de WebPack. Si los loaders o cargadores transforman el contenido de los módulos, los plugins pueden realizar un abanico muy amplio de tareas.
Pre-proceso CSS. Los pre-procesadores CSS forman parte de cualquier workflow front-end actual. Veamos cómo incorporarlos a Webpack.
Extraer CSS. En ocasiones extraer el CSS a su propio archivo (en lugar de inyectar vía JavaScript) es lo más recomendado.
CSS sin usar. Con Webpack podemos utilizar únicamente las reglas y selectores CSS que están siendo aplicados a mi proyecto, en lugar de todo el documento.
Caching. Webpack permite añadir hashes a cada recurso, creando una estrategia de cacheo duradera.
Optimización de imágenes. Vamos a configurar Webpack para que optimice las imágenes y otros recursos gráficos que se encuentre, de forma automática.
Ver más