Skip to content

Commit dd75389

Browse files
committed
https://github.com/learnpack/learnpack/issues/811
1 parent 9f3eb5b commit dd75389

File tree

3 files changed

+95
-3
lines changed

3 files changed

+95
-3
lines changed

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
!bc.json
88
!learn.json
99
!README.md
10+
!README.es.md
1011

1112
!/exercises
1213
!/exercises/*

README.es.md

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
<table>
2+
<tr>
3+
<td><img src="https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/4geeks-icon-blue.png?raw=true"></td>
4+
<td>
5+
<h1 align="center"> Tutorial de EJercicios de CSS de 4Geeks Academy</h1>
6+
<img src="https://img.shields.io/github/last-commit/4geeksacademy/css-tutorial-exercises-course" />
7+
<a href="https://breatheco.de"><img src="https://img.shields.io/badge/certified-BreatheCode-blue" /></a>
8+
<a href="https://twitter.com/alesanchezr"><img src="https://img.shields.io/twitter/follow/alesanchezr?style=social&logo=twitter" alt="follow on Twitter"></a>
9+
<a href="https://gitpod.io#https://github.com/4GeeksAcademy/css-tutorial-exercises-course.git"><img src="https://img.shields.io/badge/Gitpod-ready--to--code-blue?logo=gitpod" /></a>
10+
</td>
11+
</tr>
12+
</table>
13+
14+
¡Hola! Soy [Alejandro Sanchez @alesanchezr](https://github.com/alesanchezr), ¡muy emocionado de tenerte aquí! 🎉 😂 Aprender a programar es difícil, ¡necesitas entrenamiento! [Envíame un DM en Twitter] (https://twitter.com/alesanchezr) si tienes alguna pregunta.
15+
16+
## En este tutorial aprenderás los siguientes conceptos:
17+
18+
1. Usar 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 estilo externa `<link>`.
19+
20+
2. Seleccionar elementos HTML de su sitio web para aplicar los estilos.
21+
22+
3. Aplicar Reglas CSS (estilos) a esos elementos.
23+
24+
4. Utilizar las reglas CSS más populares.
25+
26+
5. Aprender los trucos CSS más populares.
27+
28+
#### Antes de empezar... hay otros tutoriales
29+
30+
ol>
31+
<li><a href="https://github.com/4GeeksAcademy/html-tutorial-exercises-course">Aprende HTML</a></li>
32+
<li><a href="https://github.com/4GeeksAcademy/html-forms-tutorial-exercises">Aprende Formularios HTML5 </a></li>
33+
<li><a href="https://github.com/4GeeksAcademy/css-tutorial-exercises-course">Aprende CSS</a>← estás aquí</li>
34+
<li><a href="https://github.com/4GeeksAcademy/bootstrap-exercises-tutorial">Aprende Bootstrap</a></li>
35+
</ol>
36+
<p align="center">
37+
<img src="https://github.com/4GeeksAcademy/html-forms-tutorial-exercises/blob/master/.learn/assets/animation.gif?raw=true">
38+
</p>
39+
40+
Una completa selección de Ejercicios autograduados sobre CSS ¡para cualquier interesado en aprender CSS!
41+
42+
## Instalación con un clic
43+
44+
<img src="https://gitpod.io/button/open-in-gitpod.svg" align="right">
45+
46+
## Instalación manual
47+
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 12+:
48+
49+
```
50+
$ npm i learnpack -g
51+
$ learnpack plugins:install learnpack-html
52+
```
53+
2. Descarga estos ejercicios en particular usando learnpack y luego `cd` para entrar en la carpeta:
54+
55+
```bash
56+
$ learnpack install css-tutorial-exercises-course
57+
```
58+
59+
Nota: Una vez que termines de descargar, encontrarás una carpeta "exercises" que contiene todos los ejercicios.
60+
61+
3. Inicializa el tutorial/ejercicios ejecutando el siguiente comando en el mismo nivel donde se encuentra tu archivo bc.json:
62+
63+
```sh
64+
$ npm i jest@24.8.0 -g
65+
$ learnpack start
66+
```
67+
68+
## ¿Cómo están organizados los ejercicios?
69+
70+
Cada ejercicio es una pequeña aplicación de react que contiene los siguientes archivos:
71+
72+
1. **index.js:** representa el archivo de entrada para toda la aplicación.
73+
2. **README.md:** contiene las instrucciones de los ejercicios.
74+
3. **test.js:** no tienes que abrir este archivo, contiene el script del test para el ejercicio.
75+
76+
## Colaboradores
77+
78+
Gracias a estas personas maravillosas ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):
79+
80+
1. [Alejandro Sanchez (alesanchezr)](https://github.com/alesanchezr), contribución: (codificador) 💻 (idea) 🤔, (build-tests) ⚠️ , (pull-request-review) 🤓 (tutorial de compilación) ✅ (documentación) 📖
81+
2. [David Hay (haydavid23)](https://github.com/haydavid23), contribución: (tests) ⚠️
82+
3. [Daniel Machota (@d4rkm0nst3r)](https://github.com/d4rkm0nst3r), contribución: (build-tutorial) ✅, Traducción 🌍
83+
84+
Este proyecto sigue la especificación [all-contributors](https://github.com/kentcdodds/all-contributors). ¡Todas las contribuciones son bienvenidas!

README.md

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,18 +13,25 @@
1313

1414
Hi! I'm [Alejandro Sanchez @alesanchezr](https://github.com/alesanchezr), really excited to have you here! 🎉 😂 Learning to code is hard, you need coaching! [DM me on twitter](https://twitter.com/alesanchezr) if you have any question. You'll be learning the following concepts:
1515

16-
1. Using how to apply CSS to your website in 3 different ways: Inline, by grouping them together inside a `<style>` tag or using an exeternal stylesheet `<link>`,
16+
1. Using how to apply CSS to your website in 3 different ways: Inline, by grouping them together inside a `<style>` tag or using an exeternal stylesheet `<link>`.
17+
1718
2. Selecting HTML Elements from your website to apply the styles to.
19+
1820
3. Apply CSS Rules (styles) to those elements.
21+
1922
4. Use the most popular CSS Rules.
23+
2024
5. Learn the most popular CSS Tricks.
2125

22-
<h4>Before we start... other related tutorials</h4>
26+
#### Before we start... other related tutorials
27+
2328
<ol>
2429
<li><a href="https://github.com/4GeeksAcademy/html-tutorial-exercises-course">Learn HTML</a></li>
25-
<li><a href="https://github.com/4GeeksAcademy/css-tutorial-exercises-course">Learn CSS</a>← your are here now</li>
30+
<li><a href="https://github.com/4GeeksAcademy/html-forms-tutorial-exercises">Learn HTML5 Forms</a>← your are here now</li>
31+
<li><a href="https://github.com/4GeeksAcademy/css-tutorial-exercises-course">Learn CSS</a></li>
2632
<li><a href="https://github.com/4GeeksAcademy/bootstrap-exercises-tutorial">Learn Bootstrap</a></li>
2733
</ol>
34+
2835
Complete selection of autograded CSS exercises, anyone interested in learning CSS!
2936

3037
<h2>One click installation:</h2>

0 commit comments

Comments
 (0)