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
Copy file name to clipboardExpand all lines: es/README.md
+5-5Lines changed: 5 additions & 5 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -4,19 +4,19 @@
4
4
5
5
> Este trabajo está bajo la licencia internacional Creative Commons Attribution-ShareAlike 4.0. Para ver una copia de esta licencia, visita el siguiente enlace https://creativecommons.org/licenses/by-sa/4.0/
6
6
7
-
## Bienvenido/a
7
+
## Bienvenida/o
8
8
9
9
¡Bienvenido/a al tutorial de las Django Girls! ¡Nos alegra que estés aquí :) En este tutorial, te llevaremos de viaje a las entrañas de la tecnología web, para que veas todas las piezas que se necesitan para que la web funcione.
10
10
11
11
Como pasa con todas las cosas nuevas, va a ser una aventura - pero no te preocupes; una vez que te has decidido a empezar, te irá de maravilla :)
12
12
13
13
## Introducción
14
14
15
-
¿Alguna vez has tenido la sensación de que el mundo es cada vez más tecnológico? ¿que cada vez lo entiendes menos? ¿Alguna vez te has planteado crear un sitio web pero no sabías por donde empezar? ¿Has pensado alguna vez que el mundo del software es demasiado complicado como para intentar hacer algo por tu cuenta?
15
+
¿Alguna vez has tenido la sensación de que el mundo es cada vez más tecnológico? ¿que cada vez lo entiendes menos? ¿Alguna vez te has planteado crear un sitio web pero no sabías por dónde empezar? ¿Has pensado alguna vez que el mundo del software es demasiado complicado como para intentar hacer algo por tu cuenta?
16
16
17
17
Bueno, ¡tenemos buenas noticias! Programar no es tan difícil como parece y queremos demostrarte lo divertido que puede llegar a ser.
18
18
19
-
Este tutorial no te convertirá en programadora de la noche a la mañana. Sí quieres ser buena en esto, necesitarás meses o incluso años de aprendizaje y práctica. Sin embargo queremos enseñarte que programar o crear sitios web no es tan complicado como parece. Intentaremos explicar las cosas lo mejor que podamos, para perderle el miedo a la tecnología.
19
+
Este tutorial no te convertirá en programadora de la noche a la mañana. Si quieres ser buena en esto, necesitarás meses o incluso años de aprendizaje y práctica. Sin embargo queremos enseñarte que programar o crear sitios web no es tan complicado como parece. Intentaremos explicar las cosas lo mejor que podamos, para perderle el miedo a la tecnología.
20
20
21
21
¡Esperamos conseguir que te guste la tecnología tanto como a nosotras!
22
22
@@ -34,9 +34,9 @@ Bien, [empecemos por el comienzo...](./how_the_internet_works/README.md)
34
34
35
35
## Seguir el tutorial desde casa
36
36
37
-
Participar en un taller de Django Girls en vivo es genial, pero somos conscientes de que no siempre es posible hacerlo. Por eso, te recomendamos hacer este tutorial en casa. Para las que estáis en casa, estamos preparando videos que facilitarán seguir el tutorial por tu cuenta. Todavía está en progreso, pero cada vez hay más cosas explicadas en el canal de YouTube [Coding is for girls](https://www.youtube.com/channel/UC0hNd2uW8jTR5K3KBzRuG2A/feed) (Nota: en inglés).
37
+
Participar en un taller de Django Girls en vivo es genial, pero somos conscientes de que no siempre es posible hacerlo. Por eso, te recomendamos hacer este tutorial en casa. Para las que estáis en casa, estamos preparando vídeos que facilitarán seguir el tutorial por tu cuenta. Todavía está en progreso, pero cada vez hay más cosas explicadas en el canal de YouTube [Coding is for girls](https://www.youtube.com/channel/UC0hNd2uW8jTR5K3KBzRuG2A/feed) (Nota: en inglés).
38
38
39
-
En cada capítulo hay un enlace que lleva al video correspondiente (si lo hay).
39
+
En cada capítulo hay un enlace que lleva al vídeo correspondiente (si lo hay).
Copy file name to clipboardExpand all lines: es/chromebook_setup/instructions.md
+10-10Lines changed: 10 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -8,7 +8,7 @@ Nube de IDE es una herramienta que te ofrece un editor de código y el acceso po
8
8
9
9
1. Ve a [PaizaCloud Cloud IDE](https://paiza.cloud/)
10
10
2. Crea una cuenta
11
-
3.Haga clic en *Nuevo Servidor* y elija la aplicación Django
11
+
3.Haz clic en *Nuevo Servidor* y elige la aplicación Django
12
12
4. Haz clic en el botón Terminal (en el lado izquierdo de la ventana)
13
13
14
14
Ahora deberías ver una interfaz con una barra y botones en la izquierda. Haz click en al botón "Terminal" para abrir la ventana de la terminal con un símbolo de sistema como este:
@@ -18,23 +18,23 @@ Ahora deberías ver una interfaz con una barra y botones en la izquierda. Haz cl
18
18
$
19
19
20
20
21
-
La terminal en el IDE en la nube PaizaCloud, está preparada para ejecutar tus instrucciones. Puedes redimensionar o maximizar la ventana para hacerla un poco más grande.
21
+
La terminal en el IDE en la nube PaizaCloud está preparada para ejecutar tus instrucciones. Puedes redimensionar o maximizar la ventana para hacerla un poco más grande.
22
22
23
23
#### AWS Cloud9
24
24
25
25
Actualmente Cloud 9 requiere que te registres con AWS y ingreses la información de la tarjeta de crédito.
26
26
27
27
1. Instala Cloud 9 desde la [Chrome web store](https://chrome.google.com/webstore/detail/cloud9/nbdmccoknlfggadpfkmcpnamfnbkmkcp)
28
-
2.Valla a [c9.io](https://c9.io) y haz clic en *Get started with AWS Cloud9*
28
+
2.Ve a [c9.io](https://c9.io) y haz clic en *Get started with AWS Cloud9*
29
29
3. Regístrate en una cuenta AWS (requiere información de tarjeta de crédito, pero puedes usar gratis)
30
-
4. En el panel de control AWS, introduzca*Cloud9* en la barra de búsqueda y haga clic en él
31
-
5. En el panel de control de la Cloud 9, haga clic en *Create environment*
30
+
4. En el panel de control AWS, introduz*Cloud9* en la barra de búsqueda y haz clic en él
31
+
5. En el panel de control de la Cloud 9, haz clic en *Create environment*
32
32
6. Nómbralo *django-girls*
33
-
7. Mientras configura los ajustes, seleccione*Create a new instance for environment (EC2)* para "Environment Type" y seleccione el valor *t2.micro* para "Instance type" (debería decir "Free-tier eligible."). La configuración de ahorro de costes por defecto está bien y puede mantener los otros valores por defecto.
33
+
7. Mientras configuras los ajustes, selecciona*Create a new instance for environment (EC2)* para "Environment Type" y selecciona el valor *t2.micro* para "Instance type" (debería decir "Free-tier eligible."). La configuración de ahorro de costes por defecto está bien y puede mantener los otros valores por defecto.
34
34
8. Haz clic en *Next step*
35
35
9. Haz clic en *Create environment*
36
36
37
-
Ahora deberías ver una interfaz con una barra, una gran ventana principal con algún texto y, una ventana pequeña en la parte inferior que se vería así:
37
+
Ahora deberías ver una interfaz con una barra, una gran ventana principal con algún texto y una ventana pequeña en la parte inferior que se vería así:
38
38
39
39
{% filename %}bash{% endfilename %}
40
40
@@ -58,16 +58,16 @@ Ejecutar:
58
58
pip install django~={{ book.django_version }}
59
59
60
60
61
-
(nota que en la última linea usamos una virgulilla (~) seguido de un signo igual `~=`).
61
+
(nota que en la última línea usamos una virgulilla (~) seguida de un signo igual `~=`).
62
62
63
63
### GitHub
64
64
65
65
Hazte una cuenta de [GitHub](https://github.com).
66
66
67
67
### PythonAnywhere
68
68
69
-
El tutorial de Django Girls incluye una sección en lo que se conoce como Despliegue, lo cual se refiere al proceso de tomar el código que da vida a tu nueva aplicación web y moverlo a un ordenador de acceso publico (llamado servidor) para que otras personas puedan ver tu trabajo.
69
+
El tutorial de Django Girls incluye una sección en lo que se conoce como Despliegue, lo cual se refiere al proceso de tomar el código que da vida a tu nueva aplicación web y moverlo a un ordenador de acceso público (llamado servidor) para que otras personas puedan ver tu trabajo.
70
70
71
-
Esta parte del tutorial es algo extraña usando un Chromebook, pues ya estamos usando un computador conectado a Internet (contrario a, por ejemplo, una laptop). Sin embargo, aún es útil, ya que podemos pensar que nuestro espacio de trabajo en Cloud 9 como un repositorio para nuestro trabajo "en progreso" y Python Anywhere como un lugar donde mostrar nuestro trabajo más completo.
71
+
Esta parte del tutorial es algo extraña usando un Chromebook, pues ya estamos usando un computador conectado a Internet (contrario a, por ejemplo, un portátil). Sin embargo, aún es útil, ya que podemos pensar que nuestro espacio de trabajo en Cloud 9 como un repositorio para nuestro trabajo "en progreso" y Python Anywhere como un lugar donde mostrar nuestro trabajo más completo.
72
72
73
73
Así que, registra una cuenta en Python Anywhere [www.pythonanywhere.com](https://www.pythonanywhere.com).
Copy file name to clipboardExpand all lines: es/code_editor/README.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,10 +1,10 @@
1
1
# Editor de código
2
2
3
-
> Para los lectores en casa: este capitulo se explica en el video[Instalando Python & Editor de Código](https://www.youtube.com/watch?v=pVTaqzKZCdA&t=4m43s).
3
+
> Para los lectores en casa: este capitulo se explica en el vídeo[Instalando Python & Editor de Código](https://www.youtube.com/watch?v=pVTaqzKZCdA&t=4m43s).
4
4
5
-
Estás a punto de escribir tu primera línea de código, así que ¡ya toca descargar un editor de código!
5
+
Estás a punto de escribir tu primera línea de código, así que, ¡ya toca descargar un editor de código!
6
6
7
-
> **Nota** Si estas usando un Chromebook, omite este capitulo y asegurate de seguir las instrucciones de [Instalacion de Chromebook](../chromebook_setup/README.md). La nube IDE que elegiste (Paizacloud Cloud IDE o AWS cloud9) Incluyen un editor de codigo, y cuando tu abres un archivo en tu IDE desde el menu de archivos, tu automaticamente estarás utilizando el editor.
7
+
> **Nota** Si estás usando un Chromebook, omite este capítulo y asegúrate de seguir las instrucciones de [Instalación de Chromebook](../chromebook_setup/README.md). La nube IDE que elegiste (Paizacloud Cloud IDE o AWS cloud9) incluyen un editor de código, y cuando abres un archivo en tu IDE desde el menú de archivos, automáticamente estarás utilizando el editor.
8
8
>
9
9
> **Nota** Es posible que ya hayas hecho esto en el capítulo de instalación. Si es así, ¡puedes avanzar directamente al siguiente capítulo!
Copy file name to clipboardExpand all lines: es/code_editor/instructions.md
+7-7Lines changed: 7 additions & 7 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,6 @@
1
1
Hay muchos editores diferentes y la elección es principalmente una cuestión de preferencia personal. La mayoría de programadores de Python usan IDEs (Entornos de Desarrollo Integrados) complejos pero muy potentes, como PyCharm. Sin embargo, como principiante, probablemente no es lo más aconsejable; nuestras recomendaciones son igualmente potentes pero mucho más simples.
2
2
3
-
Abajo presentamos nuestras sugerencias pero, también puedes preguntarle a tu mentor cuáles son las suyas -será más fácil que te ayude.
3
+
Abajo presentamos nuestras sugerencias pero también puedes preguntarle a tu mentora cuáles son las suyas -será más fácil que te ayude.
4
4
5
5
## Visual Studio Code
6
6
@@ -22,16 +22,16 @@ Sublime Text es un editor muy popular con un periodo de prueba gratis, y está d
22
22
23
23
## Atom
24
24
25
-
Atom es otro editor popular. Es gratis, de código abierto y disponible para Windows, OS X and Linux. Atom esta desarrollado por [Github](https://github.com/).
25
+
Atom es otro editor popular. Es gratis, de código abierto y disponible para Windows, OS X and Linux. Atom está desarrollado por [Github](https://github.com/).
26
26
27
-
[Descargalo aquí](https://atom.io/)
27
+
[Descárgalo aquí](https://atom.io/)
28
28
29
29
## ¿Por qué estamos instalando un editor de código?
30
30
31
-
Tú podrías estar preguntandote por qué estamos instalando éste especializado software editor de código, en vez de usar algo como Word o Notepad.
31
+
Tú podrías estar preguntándote por qué estamos instalando este especializado software editor de código en vez de usar algo como Word o Notepad.
32
32
33
-
La primera razón es que el código necesita ser **texto plano**, y el problema con programas como Word y Textedit es que ellos actualmente no produce texto plano, ellos producen texto rico (con fuentes y formatos), usando formatos personalizados como [RTF ( Formato del Texto Enriquecido, del inglés Rich Text Format)](https://en.wikipedia.org/wiki/Rich_Text_Format).
33
+
La primera razón es que el código necesita ser **texto plano**, y el problema con programas como Word y Textedit es que no producen texto plano, sino texto enriquecido (con fuentes y formatos), usando formatos personalizados como [RTF ( Formato del Texto Enriquecido, del inglés Rich Text Format)](https://en.wikipedia.org/wiki/Rich_Text_Format).
34
34
35
-
La segunda razón es que los editores de código son especializados para ésta función, así ellos pueden proveer ayuda a características como destacar código con color acorde a su significado, o automáticamente cerrando etiquetas para ti.
35
+
La segunda razón es que los editores de código están especializados para esta función, así ellos pueden proveer ayuda a características como destacar código con color acorde a su significado, o automáticamente cerrando etiquetas para ti.
36
36
37
-
Veremos todo esto en acción más adelante. Pronto, pensarás en convertir el editor de código como una de tus herramientas favoritas. :)
37
+
Veremos todo esto en acción más adelante. Pronto pensarás en convertir el editor de código en una de tus herramientas favoritas. :)
Copy file name to clipboardExpand all lines: es/css/README.md
+4-4Lines changed: 4 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -4,13 +4,13 @@ Nuestro blog todavía es un poco feo, ¿no te parece? ¡Es hora de ponerlo bonit
4
4
5
5
## ¿Qué es CSS?
6
6
7
-
El lenguaje CSS (las siglas en inglés de hojas de estilos en cascada, o Cascading Style Sheets) sirve para describir la apariencia de un sitio web escrito en un lenguaje de marcado (como HTML). Es como la capa de pintura para nuestra página web. ;)
7
+
El lenguaje CSS (las siglas en inglés de Hojas de Estilos en Cascada, o Cascading Style Sheets) sirve para describir la apariencia de un sitio web escrito en un lenguaje de marcado (como HTML). Es como la capa de pintura para nuestra página web. ;)
8
8
9
9
Pero no queremos empezar de cero otra vez, ¿verdad? De nuevo vamos a usar algo que otros programadores han publicado ya en Internet. Estar siempre reinventando la rueda no mola.
10
10
11
11
## ¡Vamos a usar Bootstrap!
12
12
13
-
Bootstrap es uno de los frameworks de HTML y CSS mas populares para desarrollar para sitios web atractivos: https://getbootstrap.com/
13
+
Bootstrap es uno de los frameworks de HTML y CSS más populares para desarrollar sitios web atractivos: https://getbootstrap.com/
14
14
15
15
Lo escribieron programadores que trabajaban en Twitter. ¡Ahora lo mantienen y desarrollan voluntarios de todo el mundo!
16
16
@@ -66,7 +66,7 @@ Vamos a crear un archivo CSS, para añadir tu propio estilo a la página. Crea u
66
66
67
67
No vamos a profundizar demasiado en cómo personalizar y aprender CSS. Pero te podemos recomendar un un curso gratuito de CSS al final de esta página por si quieres aprender más.
68
68
69
-
Pero vamos a hacer al menos un poco. ¿Quizas podamos cambiar el color de nuestros encabezados? Los ordenadores utilizan códigos especiales para expresar los colores. Estos códigos empiezan con `#` seguidos por 6 letras (A-F) y números (0-9). Por ejemplo, el código del color azul es `#0000FF`. Puedes encontrar los códigos de muchos colores aquí: http://www.colorpicker.com/ y en otras páginas web. También puedes utilizar [colores predefinidos](http://www.w3schools.com/colors/colors_names.asp) utilizando su nombre en inglés, como `red` y `green`.
69
+
Pero vamos a hacer al menos un poco. ¿Quizás podamos cambiar el color de nuestros encabezados? Los ordenadores utilizan códigos especiales para expresar los colores. Estos códigos empiezan con `#` seguidos por 6 letras (A-F) y números (0-9). Por ejemplo, el código del color azul es `#0000FF`. Puedes encontrar los códigos de muchos colores aquí: http://www.colorpicker.com/ y en otras páginas web. También puedes utilizar [colores predefinidos](http://www.w3schools.com/colors/colors_names.asp) utilizando su nombre en inglés, como `red` y `green`.
70
70
71
71
En el archivo `blog/static/css/blog.css` deberías añadir el siguiente código:
72
72
@@ -79,7 +79,7 @@ h1 a, h2 a {
79
79
80
80
```
81
81
82
-
`h1 a` es un selector CSS. Esto significa que estamos aplicando nuestros estilos a cualquier elemento de `a` dentro de un elemento de `h1`; el selector `h2 a` hace lo mismo para los elementos de `h2`. Así, cuando tenemos algo como `<h1><a href="">link</a></h1>`, se aplicará el estilo `h1 a`. En este caso, le estamos diciendo que cambie el color a un `#C25100`, que es un naranjo oscuro. O puedes poner tu propio color aqui, ¡pero asegurate que tenga un buen contraste contra un fondo blanco!
82
+
`h1 a` es un selector CSS. Esto significa que estamos aplicando nuestros estilos a cualquier elemento de `a` dentro de un elemento de `h1`; el selector `h2 a` hace lo mismo para los elementos de `h2`. Así, cuando tenemos algo como `<h1><a href="">link</a></h1>`, se aplicará el estilo `h1 a`. En este caso, le estamos diciendo que cambie el color a un `#C25100`, que es un naranjo oscuro. O puedes poner tu propio color aqui, ¡pero asegúrate que tenga un buen contraste contra un fondo blanco!
83
83
84
84
En un archivo CSS se definen los estilos de los elementos que aparecen en el archivo HTML. La primera forma de identificar los elementos es por su nombre. Puede que los recuerdes como 'tags' de la sección de HTML. Cosas como `a`, `h1`, y `body` son algunos ejemplos de nombres de elementos. También podemos identificar elementos por el atributo `class` o el atributo `id`. Los valores de "class" e "id" son nombres que das al elemento para poderlo identificar. Con el atributo "class" identificamos grupos de elementos del mismo tipo y con el atributo "id" identificamos un elemento específico. Por ejemplo, el siguiente elemento lo podrías identificar por su nombre de "tag" `a`, por su "class" `external_link`, o por su "id" `link_to_wiki_page`:
0 commit comments