You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Una completa selección de Ejercicios autograduados sobre CSS ¡para cualquier interesado en aprender CSS!
34
+
Una completa selección de ejercicios autograduados sobre CSS ¡para cualquier interesado en aprender CSS!
37
35
38
36
## Instalación en un clic (recomendado)
39
37
40
38
Puedes empezar estos ejercicios en pocos segundos haciendo clic en: [Abrir en Codespaces](https://codespaces.new/?repo=4GeeksAcademy/bootstrap-exercises-tutorial) (recomendado) o [Abrir en Gitpod](https://gitpod.io#https://github.com/4GeeksAcademy/bootstrap-exercises-tutorial).
41
39
42
-
> Una vez ya tengas abirto 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`
40
+
> 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`
43
41
44
42
## Instalación local:
45
43
46
-
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+:
44
+
Clona el repositorio en tu ambiente local y sigue los siguientes pasos:
47
45
46
+
1. Instala LearnPack, el package manager para los tutoriales interactivos y el node compiler plugin para LearnPack, asegúrate también de tener node.js 14+:
48
47
49
-
```
48
+
```bash
50
49
$ npm i learnpack -g
51
50
$ learnpack plugins:install learnpack-html
52
51
```
53
52
54
-
2. Descarga estos ejercicios en particular usando learnpack y luego "cd" para entrar en la carpeta:
53
+
2. Descarga estos ejercicios en particular usando LearnPack y luego `cd` para entrar en la carpeta:
55
54
56
-
```
55
+
```bash
57
56
$ learnpack download bootstrap-exercises-tutorial
58
57
$ cd bootstrap-exercises-tutorial
59
58
```
60
59
61
-
Nota: Una vez que termines de descargar, encontrarás una carpeta "exercises" que contiene todos los ejercicios.
60
+
> Nota: Una vez que termines de descargar, encontrarás una carpeta "exercises" que contiene todos los ejercicios.
62
61
63
-
3. Inicializa el tutorial/ejercicios ejecutando el siguiente comando en el mismo nivel donde se encuentra tu archivo bc.json:
62
+
3. Inicializa el tutorial/ejercicios ejecutando el siguiente comando en el mismo nivel donde se encuentra tu archivo learn.json:
Cada ejercicio es una pequeña aplicación de react que contiene los siguientes archivos:
73
+
Cada ejercicio es una pequeña aplicación de React que contiene los siguientes archivos:
75
74
76
-
1.**index.js:** Representa el archivo de entrada para toda la aplicación.
75
+
1.**index.html:** Representa el archivo de entrada para toda la aplicación.
77
76
2.**README.md:** Contiene las instrucciones de los ejercicios.
78
77
3.**test.js:** No tienes que abrir este archivo, contiene el script del test para el ejercicio.
79
78
80
-
> Nota: Los ejercicios son autograduados pero los tests son muy rígidos y estrictos, mi recomendación es que ignores los tests y los uses solo como una recomendación o pueden frustrarte.
79
+
> 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.
81
80
82
81
## Colaboradores
83
82
@@ -87,4 +86,4 @@ Gracias a estas personas maravillosas ([emoji key](https://github.com/kentcdodds
87
86
88
87
Este proyecto sigue la especificación [all-contributors](https://github.com/kentcdodds/all-contributors). ¡Todas las contribuciones son bienvenidas!
89
88
90
-
Este y otros ejercicios son usados para [aprender a programar](https://4geeksacademy.com/es/aprender-a-programar/aprender-a-programar-desde-cero) por parte de los alumnos de 4Geeks Academy [Coding Bootcamp](https://4geeksacademy.com/us/coding-bootcamp) realizado por [Alejandro Sánchez](https://twitter.com/alesanchezr) y muchos otros contribuyentes. Conoce más sobre nuestros [Curso de Programación](https://4geeksacademy.com/es/curso-de-programacion-desde-cero?lang=es) para convertirte en [Full Stack Developer](https://4geeksacademy.com/es/coding-bootcamps/desarrollador-full-stack/?lang=es), o nuestro [Data Science Bootcamp](https://4geeksacademy.com/es/coding-bootcamps/curso-datascience-machine-learning).
89
+
Este y otros ejercicios son usados para [aprender a programar](https://4geeksacademy.com/es/aprender-a-programar/aprender-a-programar-desde-cero) por parte de los alumnos de 4Geeks Academy [Coding Bootcamp](https://4geeksacademy.com/us/coding-bootcamp) realizado por [Alejandro Sánchez](https://twitter.com/alesanchezr) y muchos otros contribuyentes. Conoce más sobre nuestros [Cursos de Programación](https://4geeksacademy.com/es/curso-de-programacion-desde-cero?lang=es) para convertirte en [Full Stack Developer](https://4geeksacademy.com/es/coding-bootcamps/desarrollador-full-stack/?lang=es), o nuestro [Data Science Bootcamp](https://4geeksacademy.com/es/coding-bootcamps/curso-datascience-machine-learning).
Copy file name to clipboardExpand all lines: README.md
+21-21
Original file line number
Diff line number
Diff line change
@@ -5,63 +5,63 @@
5
5
<ahref="https://twitter.com/alesanchezr"><imgsrc="https://img.shields.io/twitter/follow/alesanchezr?style=social&logo=twitter"alt="follow on Twitter"></a>
Hi! I'm Alejandro Sanchez @alesanchezr, I'm thrilled to have you here! 🎉 😂 Learning to code is hard; you need coaching! DM me on Twitter if you have any question. You'll be learning the following concepts:
8
9
9
-
Hi! I'm Alejandro Sanchez @alesanchezr, really excited to have you here! 🎉 😂 Learning to code is hard, you need coaching! DM me on Twitter if you have any question. You'll be learning the following concepts:
10
10
<!-- endhide -->
11
11
12
+
## You'll be learning the following concepts:
13
+
12
14
1. How to apply Bootstrap to your website.
13
15
14
-
2. Selecting HTML Elements from your website to apply the Bootstrap styles to.
16
+
2. Selecting HTML Elements from your website to apply the Bootstrap styles.
You can open these exercises in just a few seconds by clicking: [Open in Codespaces](https://codespaces.new/?repo=4GeeksAcademy/bootstrap-exercises-tutorial) (recommended) or [Open in Gitpod](https://gitpod.io#https://github.com/4GeeksAcademy/bootstrap-exercises-tutorial.git).
41
39
42
-
> Once you have VSCode open the LearnPack exercises should start automatically. If exercises don't run automatically you can try typing on your terminal: `$ learnpack start`
40
+
> Once you have VSCode open, the LearnPack exercises should start automatically. If exercises don't run automatically you can try typing on your terminal: `$ learnpack start`
43
41
44
42
## Local installation:
45
43
46
-
1. Install learnpack, the package manager for learning tutorials and the html compiler plugin for learnpack, make sure you also have node.js 12+:
44
+
Clone the repository in your local environment and follow the steps below:
47
45
48
-
```
46
+
1. Install LearnPack, the package manager for learning tutorials and the node compiler plugin for LearPack, make sure you also have node.js 14+:
47
+
48
+
```bash
49
49
$ npm i learnpack -g
50
50
$ learnpack plugins:install learnpack-html
51
51
```
52
52
53
-
2. Download this particular exercises using learnpack and `cd` into the folder:
53
+
2. Download these particular exercises using LearnPack and `cd` into the folder:
54
54
55
-
```
55
+
```bash
56
56
$ learnpack download bootstrap-exercises-tutorial
57
57
$ cd bootstrap-exercises-tutorial
58
58
```
59
59
60
-
> Note: Once you finish downloading, you will find a "exercises" folder that contains all the exercises within.
60
+
> Note: Once you finish downloading, you will find an "exercises" folder that contains all the exercises within.
61
61
62
-
3. Start the tutorial/exercises by running the following command at the same level were your bc.json file is:
62
+
3. Start the tutorial/exercises by running the following command at the same level where your learn.json file is:
Each exercise is a small react application containing the following files:
74
+
Each exercise is a small React application containing the following files:
75
75
76
-
1.**index.js:** represents the entry file for the entire exercise.
76
+
1.**index.html:** represents the entry file for the entire exercise.
77
77
2.**README.md:** contains exercise instructions.
78
78
3.**test.js:** you don't have to open this file, it contains the testing script for the exercise.
79
79
80
-
> Note: The exercises have automatic grading but its very rigid and string, my recomendation is to ignore the tests and use them only as a recomendation or you can get frustrated.
80
+
> Note: The exercises have automatic grading, but it's very rigid and strict, my recommendation is to not take the tests too serious and use them only as a suggestion, or you may get frustrated.
Mi nombre es Alejandro Sanchez@alesanchezr. Estoy realmente emocionado de tenerte aquí!! 🎉 😂 Aprender a programar es dificil, necesitas apoyo! Si tienes una pregunta enviame un directo por twitter o slack.
3
+
Mi nombre es [Alejandro Sanchez](https://twitter.com/alesanchezr). Estoy realmente emocionado de tenerte aquí!! 🎉 😂 Aprender a programar es difícil, necesitas apoyo! Si tienes una pregunta envíame un mensaje directo por Twitter o Slack.
4
4
5
5
Durante este curso vas a aprender los siguientes conceptos:
6
6
7
-
1. Como aplicar Bootstrap a tu sitio web (website).
7
+
1. Como aplicar Bootstrap a tu sitio web.
8
8
9
-
2. Seleccionar Elementos de HTML de tu website para aplicarle los estilos de Bootstrap.
9
+
2. Seleccionar elementos HTML de tu website para aplicarle los estilos de Bootstrap.
10
10
11
11
3. Aplicar a esos elementos las clases de Bootstrap.
12
12
13
-
4.Usa las reglas más populares de Bootstrap.
13
+
4.Uso de las reglas de Bootstrap más populares.
14
14
15
15
5. Aprender los trucos más populares de Bootstrap.
16
16
17
-
Como habrás notado, HTML solo te permite crear website básicos. Nadie quiere ver un website blanco con algún horrible texto en él. Entonces es tiempo de aprender sobre que trata Bootstrap! Aprender Bootstrap para hacer bonito tu website. Vamos a hacerlo brillar!
17
+
Como habrás notado, HTML solo te permite crear websites básicos. Nadie quiere ver un website blanco con un montón de texto en él. ¡Entonces es tiempo de aprender sobre que trata Bootstrap! Aprender Bootstrap para hacer bonito tu website. ¡Vamos a hacerlo brillar!
18
18
19
19
## Colaboradores
20
20
21
21
Gracias a estas maravillosas personas ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):
specification. Colaboraciones de cualquier tipo son bienvenidas!
26
+
Este proyecto sigue la [all-contributors](https://github.com/kentcdodds/all-contributors) specification. ¡Colaboraciones de cualquier tipo son bienvenidas!
My name is [Alejandro Sanchez](https://twitter.com/alesanchezr). I'm really excited to have you here!! 🎉 😂 Learning to code is hard, you problably will need coaching! DM me on twitter if you have any question.
3
+
My name is [Alejandro Sanchez](https://twitter.com/alesanchezr). I'm really excited to have you here!! 🎉 😂 Learning to code is hard, you probably will need coaching! DM me on Twitter if you have any question.
4
4
5
5
During this course you will be learning the following concepts:
6
6
@@ -10,19 +10,17 @@ During this course you will be learning the following concepts:
10
10
11
11
3. Apply Bootstrap classes to those elements.
12
12
13
-
4. Use the most popular Bootstrap Rules.
13
+
4. Use the most popular Bootstrap rules.
14
14
15
-
5. Learn the most popular Bootstrap Tricks.
15
+
5. Learn the most popular Bootstrap tricks.
16
16
17
17
As you may have noticed, HTML allows you to create only basic websites. Nobody wants to see a white website with some horrible text on it. So it's time to learn what Bootstrap is all about! Learn Bootstrap to make your website beautiful. Let's make it shine!
18
18
19
19
## Contributors
20
20
21
21
Thanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):
specification. Contributions of any kind are welcome!
26
+
This project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) specification. Contributions of any kind are welcome!
0 commit comments