Skip to content

Latest commit

 

History

History
100 lines (66 loc) · 5.6 KB

README.es.md

File metadata and controls

100 lines (66 loc) · 5.6 KB
Raw

Tutorial de Ejercicios de CSS de 4Geeks Academy

follow on Twitter

¡Hola! Soy Alejandro Sanchez @alesanchezr, ¡muy emocionado de tenerte aquí! 🎉 😂 Aprender a programar es difícil, ¡necesitas entrenamiento! Envíame un DM en Twitter si tienes alguna pregunta.

En este tutorial aprenderás los siguientes conceptos:

  1. Cómo aplicar CSS a su sitio web de 3 maneras diferentes: en línea, agrupándolos dentro de una etiqueta <style> o usando una hoja de estilos externa <link>.

  2. Seleccionar elementos HTML de su sitio web para aplicar los estilos.

  3. Aplicar Reglas CSS (estilos) a esos elementos.

  4. Utilizar las reglas CSS más populares.

  5. Aprender los trucos CSS más populares.

Antes de empezar... hay otros tutoriales

  1. Aprende HTML
  2. Aprende Formularios HTML5
  3. Aprende CSS← 🔥 Estás aquí
  4. Aprende CSS Layouts
  5. Aprende Bootstrap

Una completa selección de Ejercicios autograduados sobre CSS ¡para cualquier interesado en aprender CSS!

Instalación en un clic (recomendado)

Puedes empezar estos ejercicios en pocos segundos haciendo clic en: Abrir en Codespaces (recomendado) o Abrir en Gitpod.

Una vez ya tengas abierto VSCode los ejercicios de LearnPack deberían empezar automáticamente, si esto no sucede puedes intentar empezar los ejercicios escribiendo este comando en tu terminal: $ learnpack start

Instalación manual

Clona el repositorio en tu ambiente local y sigue los siguientes pasos:

  1. Instala LearnPack, el package manager para tutoriales de aprendizaje y el HTML compiler plugin para LearnPack, asegúrate también de tener node.js 14+:
$ npm i learnpack -g
$ learnpack plugins:install learnpack-html
  1. Descarga estos ejercicios en particular usando LearnPack y luego cd para entrar en la carpeta:
$ learnpack install css-tutorial-exercises-course

Nota: Una vez que termines de descargar, encontrarás una carpeta "exercises" que contiene todos los ejercicios.

  1. Inicializa el tutorial/ejercicios ejecutando el siguiente comando en el mismo nivel donde se encuentra tu archivo learn.json:
$ npm i [email protected] -g
$ learnpack start

¿Cómo están organizados los ejercicios?

Cada ejercicio es una pequeña aplicación de React que contiene los siguientes archivos:

  1. index.html: representa el archivo de entrada para el ejercicio.
  2. styles.css: contiene los estilos y reglas de CSS
  3. README.md: contiene las instrucciones de los ejercicios.
  4. test.js: no tienes que abrir este archivo, contiene el script del test para el ejercicio.

Nota: Los ejercicios son autograduados, pero los tests son muy rígidos y estrictos, mi recomendación es que no prestes demasiada atención a los tests y los uses solo como una sugerencia o podrías frustrarte.

Colaboradores

Gracias a estas personas maravillosas (emoji key):

  1. Alejandro Sanchez (alesanchezr), contribución: (codificador) 💻 (idea) 🤔, (build-tests) ⚠️ , (pull-request-review) 🤓 (tutorial de compilación) ✅ (documentación) 📖

  2. David Hay (haydavid23), contribución: (tests) ⚠️

  3. Daniel Machota (@d4rkm0nst3r), contribución: (build-tutorial) ✅, Traducción 🌍

Este proyecto sigue la especificación all-contributors. ¡Todas las contribuciones son bienvenidas!

Este y otros ejercicios son usados para aprender a programar por parte de los alumnos de 4Geeks Academy Coding Bootcamp realizado por Alejandro Sánchez y muchos otros contribuyentes. Conoce más sobre nuestros Cursos de Programación para convertirte en Full Stack Developer, o nuestro Data Science Bootcamp.