chore(i8n,learn): processed translations
This commit is contained in:
committed by
Mrugesh Mohapatra
parent
15047f2d90
commit
e5c44a3ae5
@ -0,0 +1,47 @@
|
||||
---
|
||||
id: bd7158d8c242eddfaeb5bd13
|
||||
title: Construye una página portafolio personal
|
||||
challengeType: 3
|
||||
forumTopicId: 301143
|
||||
dashedName: build-a-personal-portfolio-webpage
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
**Objetivo:** Construye una aplicación en [CodePen.io](https://codepen.io) que funcionalmente sea similar a esta: <https://codepen.io/freeCodeCamp/full/zNBOYG>.
|
||||
|
||||
Completa las siguientes [historias de usuario](https://es.wikipedia.org/wiki/Historias_de_usuario) y consigue aprobar todas las pruebas. Dale tu propio estilo personal.
|
||||
|
||||
Puedes usar HTML, JavaScript y CSS para completar este proyecto. Se recomienda usar CSS puro porque eso es lo que las lecciones han cubierto hasta ahora y debes practicar un poco con él. Puedes usar Bootstrap o SASS si lo deseas. Tecnologías adicionales (por ejemplo, jQuery, React, Angular o Vue) no se recomiendan para este proyecto, y usarlas es bajo tu propio riesgo. Otros proyectos te darán la oportunidad de trabajar con diferentes stacks de tecnologías como React. Aceptaremos e intentaremos solucionar todos los informes de incidencias que utilicen el stack de tecnología sugerido para este proyecto. ¡Feliz día programando!
|
||||
|
||||
**Historia de Usuario #1:** Mi portafolio debería tener una sección de bienvenida con un id establecido como `welcome-section`.
|
||||
|
||||
**Historia de Usuario #2:** La sección de bienvenida debería tener un elemento `h1` que contenga texto.
|
||||
|
||||
**Historia de Usuario #3:** Mi portafolio debería tener una sección de proyectos con un id establecido como `projects`.
|
||||
|
||||
**Historia de Usuario #4:** La sección de proyectos debería contener al menos un elemento con una clase de `project-tile` para abarcar un proyecto.
|
||||
|
||||
**Historia de Usuario #5:** La sección de proyectos debe contener al menos un enlace a un proyecto.
|
||||
|
||||
**Historia de Usuario #6:** Mi portafolio debería tener una barra de navegación con un id establecido como `navbar`.
|
||||
|
||||
**Historia de Usuario #7:** La barra de navegación debe contener al menos un enlace en el que puedo hacer clic para navegar a diferentes secciones de la página.
|
||||
|
||||
**Historia de Usuario #8:** Mi portafolio debería tener un enlace con un id establecido como `profile-link`, el cual abre mi perfil de GitHub o FCC en una nueva pestaña.
|
||||
|
||||
**Historia de Usuario #9:** Mi portafolio debería tener al menos una consulta de medios (media query).
|
||||
|
||||
**Historia de Usuario #10:** La altura de la sección de bienvenida debe ser igual a la altura del viewport.
|
||||
|
||||
**Historia de Usuario #11:** La barra de navegación debe estar siempre en la parte superior del viewport.
|
||||
|
||||
Puedes construir tu proyecto haciendo un fork de [este CodePen](https://codepen.io/freeCodeCamp/pen/MJjpwO). O puedes utilizar este enlace CDN para ejecutar los tests en cualquier entorno que desees: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
|
||||
|
||||
Una vez que hayas terminado, envía la URL de tu proyecto funcional con todos los tests aprobados.
|
||||
|
||||
# --solutions--
|
||||
|
||||
```html
|
||||
// solution required
|
||||
```
|
@ -0,0 +1,55 @@
|
||||
---
|
||||
id: 587d78af367417b2b2512b04
|
||||
title: Construye una página de aterrizaje de producto
|
||||
challengeType: 3
|
||||
forumTopicId: 301144
|
||||
dashedName: build-a-product-landing-page
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
**Objetivo:** Construye una aplicación en [CodePen.io](https://codepen.io) que funcionalmente sea similar a esta: <https://codepen.io/freeCodeCamp/full/RKRbwL>.
|
||||
|
||||
Completa las siguientes [historias de usuario](https://es.wikipedia.org/wiki/Historias_de_usuario) y consigue aprobar todos los tests. Dale tu propio estilo personal.
|
||||
|
||||
Puedes usar HTML, JavaScript y CSS para completar este proyecto. Se recomienda usar CSS puro porque eso es lo que las lecciones han cubierto hasta ahora y debes practicar un poco con él. Puedes usar Bootstrap o SASS si lo deseas. Tecnologías adicionales (por ejemplo, jQuery, React, Angular o Vue) no se recomiendan para este proyecto, y usarlas es bajo tu propio riesgo. Otros proyectos te darán la oportunidad de trabajar con diferentes stacks de tecnologías como React. Aceptaremos e intentaremos solucionar todos los informes de incidencias que utilicen el stack de tecnología sugerido para este proyecto. ¡Feliz día programando!
|
||||
|
||||
**Historia de Usuario #1:** Mi página de aterrizaje de producto debería tener un elemento `header` con un respectivo `id="header"`.
|
||||
|
||||
**Historia de Usuario #2:** Puedo ver una imagen dentro del elemento `header` con un respectivo `id="header-img"`. El logotipo de una empresa sería una buena opción de imagen aquí.
|
||||
|
||||
**Historia de Usuario #3:** Dentro del elemento `#header` puedo ver un elemento `nav` con un respectivo `id="nav-bar"`.
|
||||
|
||||
**Historia de Usuario #4:** Puedo ver al menos tres elementos en los que se puede hacer click dentro del elemento `nav`, cada uno con la clase `nav-link`.
|
||||
|
||||
**Historia de Usuario #5:** Cuando hago clic en un botón `.nav-link` en el elemento `nav`, soy llevado a la sección correspondiente de la página de aterrizaje.
|
||||
|
||||
**Historia de Usuario #6:** Puedo ver un video de producto incrustado con `id="video"`.
|
||||
|
||||
**Historia de usuario #8:** Mi página de aterrizaje tiene un elemento `form` con un respectivo `id="form"`.
|
||||
|
||||
**Historia de Usuario #8:** Dentro del formulario, hay un campo de entrada `input` con `id="email"` donde puedo introducir una dirección de correo electrónico.
|
||||
|
||||
**Historia de Usuario #9:** El campo de entrada `#email` debe tener un texto provisional para que el usuario sepa para qué sirve el campo.
|
||||
|
||||
**Historia de Usuario #10:** El campo de entrada `#email` utiliza la validación de HTML5 para confirmar que el texto introducido es una dirección de correo electrónico.
|
||||
|
||||
**Historia de Usuario #11:** Dentro del formulario, hay un `input` de envío con un respectivo `id="submit"`.
|
||||
|
||||
**Historia de Usuario #12:** Cuando hago clic en el elemento `#submit`, el correo electrónico se envía a una página estática (utiliza esta URL de pruebas: [https://www. reecodecamp.com/email-submit](https://www.freecodecamp.com/email-submit)).
|
||||
|
||||
**Historia de Usuario #13:** La barra de navegación debe estar siempre en la parte superior del viewport.
|
||||
|
||||
**Historia de Usuario #14:** Mi página de aterrizaje de producto debería tener al menos una media query.
|
||||
|
||||
**Historia de Usuario #15:** Mi página de aterrizaje de producto debería utilizar CSS flexbox al menos una vez.
|
||||
|
||||
Puedes construir tu proyecto haciendo un fork de [este CodePen](https://codepen.io/freeCodeCamp/pen/MJjpwO). O puedes utilizar este enlace CDN para ejecutar los tests en cualquier entorno que desees: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
|
||||
|
||||
Una vez que hayas terminado, envía la URL de tu proyecto funcional con todos los tests aprobados.
|
||||
|
||||
# --solutions--
|
||||
|
||||
```html
|
||||
// solution required
|
||||
```
|
@ -0,0 +1,57 @@
|
||||
---
|
||||
id: 587d78af367417b2b2512b03
|
||||
title: Crea un formulario de encuesta
|
||||
challengeType: 3
|
||||
forumTopicId: 301145
|
||||
dashedName: build-a-survey-form
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
**Objetivo:** Construye una aplicación en [CodePen.io](https://codepen.io) que funcionalmente sea similar a esta: <https://codepen.io/freeCodeCamp/full/VPaoNP>.
|
||||
|
||||
Completa las siguientes [historias de usuario](https://es.wikipedia.org/wiki/Historias_de_usuario) y consigue aprobar todos los tests. Dale tu propio estilo personal.
|
||||
|
||||
Puedes usar HTML, JavaScript y CSS para completar este proyecto. Se recomienda usar CSS puro porque eso es lo que las lecciones han cubierto hasta ahora y debes practicar un poco con él. Puedes usar Bootstrap o SASS si lo deseas. Tecnologías adicionales (por ejemplo, jQuery, React, Angular o Vue) no se recomiendan para este proyecto, y usarlas es bajo tu propio riesgo. Otros proyectos te darán la oportunidad de trabajar con diferentes stacks de tecnologías como React. Aceptaremos e intentaremos solucionar todos los informes de incidencias que utilicen el stack de tecnología sugerido para este proyecto. ¡Feliz día programando!
|
||||
|
||||
**Historia de Usuario #1:** Puedo ver un título con `id="title"` en texto tamaño H1.
|
||||
|
||||
**Historia de Usuario #2:** Puedo ver una breve explicación con `id="description"` en texto tamaño P.
|
||||
|
||||
**Historia de Usuario #3:** Puedo ver un elemento `form` con `id="survey-form"`.
|
||||
|
||||
**Historia de Usuario #4:** Dentro del elemento form, es requerido introducir mi nombre en un campo con `id="name"`.
|
||||
|
||||
**Historia de Usuario #5:** Dentro del elemento form, es requerido introducir un correo electrónico en un campo con `id="email"`.
|
||||
|
||||
**Historia de Usuario #6:** Si introduzco un correo electrónico que no cuente con el formato correcto, veré un error de validación HTML5.
|
||||
|
||||
**Historia de Usuario #7:** Dentro del formulario, puedo introducir un número en un campo con `id="number"`.
|
||||
|
||||
**Historia de Usuario #8:** Si introduzco valores no numéricos en la entrada de números, veré un error de validación HTML5.
|
||||
|
||||
**Historia de Usuario #9:** Si introduzco números fuera del rango de la entrada de números, los cuales son definidos por los atributos `min` y `max`, veré un error de validación HTML5.
|
||||
|
||||
**Historia de Usuario #10:** Para los campos nombre, correo, y número dentro del formulario puedo ver las etiquetas (labels) correspondientes que describen el propósito de cada campo con los siguientes ids: `id="name-label"`, `id="email-label"`, y `id="number-label"`.
|
||||
|
||||
**Historia de Usuario #11:** Para los campos nombre, correo y número, puedo ver el texto provisional que me da una descripción o instrucciones para cada campo.
|
||||
|
||||
**Historia de Usuario #12:** Dentro del elemento form, puedo seleccionar una opción de un menú desplegable que tiene el respectivo `id="dropdown"`.
|
||||
|
||||
**Historia de Usuario #13:** Dentro del elemento form, puedo seleccionar un campo de uno o más grupos de botones de radio. Cada grupo debe agruparse utilizando el atributo `name`.
|
||||
|
||||
**Historia de Usuario #14:** Dentro del elemento form, puedo seleccionar varios campos en una serie de casillas de verificación, cada una de las cuales debe tener un atributo `value`.
|
||||
|
||||
**Historia de Usuario #15:** Dentro del elemento form, me es presentado un `textarea` final para hacer comentarios adicionales.
|
||||
|
||||
**Historia de Usuario #16:** Dentro del elemento form, me es presentado un botón con `id="submit"` para enviar todas mis entradas.
|
||||
|
||||
Puedes construir tu proyecto haciendo un fork de [este CodePen](https://codepen.io/freeCodeCamp/pen/MJjpwO). O puedes utilizar este enlace CDN para ejecutar los tests en cualquier entorno que desees: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
|
||||
|
||||
Una vez que hayas terminado, envía la URL de tu proyecto funcional con todos los tests aprobados.
|
||||
|
||||
# --solutions--
|
||||
|
||||
```html
|
||||
// solution required
|
||||
```
|
@ -0,0 +1,55 @@
|
||||
---
|
||||
id: 587d78b0367417b2b2512b05
|
||||
title: Construye una página de documentación técnica
|
||||
challengeType: 3
|
||||
forumTopicId: 301146
|
||||
dashedName: build-a-technical-documentation-page
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
**Objetivo:** Construye una aplicación en [CodePen.io](https://codepen.io) que funcionalmente sea similar a esta: <https://codepen.io/freeCodeCamp/full/NdrKKL>.
|
||||
|
||||
Completa las siguientes [historias de usuario](https://es.wikipedia.org/wiki/Historias_de_usuario) y consigue aprobar todos los tests. Dale tu propio estilo personal.
|
||||
|
||||
Puedes usar HTML, JavaScript y CSS para completar este proyecto. Se recomienda usar CSS puro porque eso es lo que las lecciones han cubierto hasta ahora y debes practicar un poco con él. Puedes usar Bootstrap o SASS si lo deseas. Tecnologías adicionales (por ejemplo, jQuery, React, Angular o Vue) no se recomiendan para este proyecto, y usarlas es bajo tu propio riesgo. Otros proyectos te darán la oportunidad de trabajar con diferentes stacks de tecnologías como React. Aceptaremos e intentaremos solucionar todos los informes de incidencias que utilicen el stack de tecnología sugerido para este proyecto. ¡Feliz día programando!
|
||||
|
||||
**Historia de Usuario #1:** Puedo ver un elemento `main` con un respectivo `id="main-doc"`, que contiene el contenido principal de la página (documentación técnica).
|
||||
|
||||
**Historia de Usuario #2:** Dentro del elemento `#main-doc` puedo ver varios elementos `section`, cada uno con una clase `main-section`. Debería haber un mínimo de 5.
|
||||
|
||||
**Historia de Usuario #3:** El primer elemento dentro de cada sección `.main-section` debería ser un elemento `header` que contenga texto describiendo el tema de esa sección.
|
||||
|
||||
**Historia de Usuario #4:** Cada elemento `section` con la clase `main-section` también debería tener un id que corresponda con el texto de cada `header` contenido en él. Cualquier espacio debería ser reemplazado por guiones bajos (p.e. La sección `section` que contiene el título "JavaScript and Java" debería tener un respectivo `id="JavaScript_and_Java"`).
|
||||
|
||||
**Historia de Usuario #5:** Los elementos `.main-section` deberían contener al menos 10 elementos `p` en total (no cada uno).
|
||||
|
||||
**Historia de Usuario #6:** Los elementos `.main-section` deberían contener al menos 5 elementos `code` en total (no cada uno).
|
||||
|
||||
**Historia de Usuario #7:** Los elementos `.main-section` deberían contener al menos 5 elementos `li` en total (no cada uno).
|
||||
|
||||
**Historia de Usuario #8:** Puedo ver un elemento `nav` con un respectivo `id="navbar"`.
|
||||
|
||||
**Historia de Usuario #9:** El elemento de barra de navegación debe contener un elemento `header` que contenga texto describiendo el tema de la documentación técnica.
|
||||
|
||||
**Historia de Usuario #10:** Adicionalmente, la barra de navegación debería contener enlaces (`a`) con la clase `nav-link`. Debería haber uno para cada elemento con la clase `main-section`.
|
||||
|
||||
**Historia de Usuario #11:** El elemento `header` en la barra de navegación debe aparecer antes que cualquier elemento de enlace (`a`).
|
||||
|
||||
**Historia de Usuario #12:** Cada elemento con la clase `nav-link` debería tener un texto que corresponda con el título `header` dentro de cada sección `section` (p.e. Si tienes una sección/título "Hola Mundo", tu barra de navegación debería tener un elemento que contenga el texto "Hola Mundo").
|
||||
|
||||
**Historia de Usuario #13:** Cuando hago clic en un elemento de la barra de navegación, la página debe navegar a la sección correspondiente del elemento `main-doc` (p.e. Si hago clic en un elemento `nav-link` que contiene el texto "Hola Mundo", la página navegará al elemento `section` que tiene ese id y contiene el título `header` correspondiente.
|
||||
|
||||
**Historia de Usuario #14:** En dispositivos de tamaño normal (portátiles, escritorios), el elemento con `id="navbar"` debe mostrarse en el lado izquierdo de la pantalla y siempre debe ser visible para el usuario.
|
||||
|
||||
**Historia de Usuario #15:** Mi página de Documentación Técnica debería usar al menos una media query.
|
||||
|
||||
Puedes construir tu proyecto haciendo un fork de [este CodePen](https://codepen.io/freeCodeCamp/pen/MJjpwO). O puedes utilizar este enlace CDN para ejecutar las pruebas en cualquier entorno que desees: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
|
||||
|
||||
Una vez que hayas terminado, envía la URL de tu proyecto funcional con todas las pruebas aprobadas.
|
||||
|
||||
# --solutions--
|
||||
|
||||
```html
|
||||
// solution required
|
||||
```
|
@ -0,0 +1,43 @@
|
||||
---
|
||||
id: bd7158d8c442eddfaeb5bd18
|
||||
title: Construye una página tributo
|
||||
challengeType: 3
|
||||
forumTopicId: 301147
|
||||
dashedName: build-a-tribute-page
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
**Objetivo:** Construye una aplicación en [CodePen.io](https://codepen.io) que funcionalmente sea similar a esta: <https://codepen.io/freeCodeCamp/full/zNqgVx>.
|
||||
|
||||
Completa las siguientes [historias de usuario](https://es.wikipedia.org/wiki/Historias_de_usuario) y consigue aprobar todos los tests. Dale tu propio estilo personal.
|
||||
|
||||
Puedes usar HTML, JavaScript y CSS para completar este proyecto. Se recomienda usar CSS puro porque eso es lo que las lecciones han cubierto hasta ahora y debes practicar un poco con él. Puedes usar Bootstrap o SASS si lo deseas. Tecnologías adicionales (por ejemplo, jQuery, React, Angular o Vue) no se recomiendan para este proyecto, y usarlas es bajo tu propio riesgo. Otros proyectos te darán la oportunidad de trabajar con diferentes stacks de tecnologías como React. Aceptaremos e intentaremos solucionar todos los informes de incidencias que utilicen el stack de tecnología sugerido para este proyecto. ¡Feliz día programando!
|
||||
|
||||
**Historia de Usuario #1:** Mi página tributo debería tener un elemento con un respectivo `id="main"`, el cual contiene todos los demás elementos.
|
||||
|
||||
**Historia de Usuario #2:** Debería ver un elemento con un respectivo `id="title"`, que contiene una cadena que describe el tema de la página tributo (p. ej. "Dr. Norman Borlaug").
|
||||
|
||||
**Historia de Usuario #3:** Debería ver un elemento `div` con un respectivo `id="img-div"`.
|
||||
|
||||
**Historia de Usuario #4:** Dentro del elemento `img-div`, debería ver un elemento `img` con un respectivo `id="image"`.
|
||||
|
||||
**Historia de Usuario #5:** Dentro del elemento `img-div`, debería ver un elemento con un respectivo `id="img-caption"` que contiene contenido textual describiendo la imagen mostrada en `img-div`.
|
||||
|
||||
**Historia de Usuario #6:** Debería ver un elemento con un respectivo `id="tribute-info"`, que contiene contenido textual describiendo el tema de la página tributo.
|
||||
|
||||
**Historia de Usuario #7:** Debería ver un elemento `a` con un respectivo `id="tribute-link"`, que enlaza a un sitio externo conteniendo información adicional sobre el tema de la página tributo. SUGERENCIA: Debes dar a tu elemento un atributo `target` y establecerlo como `_blank` para que tu enlace se abra en una nueva pestaña (p. ej. `target="_blank"`).
|
||||
|
||||
**Historia de Usuario #8:** El elemento `img` debería cambiar de tamaño de forma responsiva, en relación al ancho de su elemento padre, sin exceder su tamaño original.
|
||||
|
||||
**Historia de Usuario #9:** El elemento `img` debería estar centrado dentro de su elemento padre.
|
||||
|
||||
Puedes construir tu proyecto haciendo un fork de [este CodePen](https://codepen.io/freeCodeCamp/pen/MJjpwO). O puedes utilizar este enlace CDN para ejecutar los tests en cualquier entorno que desees: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`.
|
||||
|
||||
Una vez que hayas terminado, envía la URL de tu proyecto funcional con todos los tests aprobados.
|
||||
|
||||
# --solutions--
|
||||
|
||||
```html
|
||||
// solution required
|
||||
```
|
Reference in New Issue
Block a user