freeCodeCamp/curriculum/challenges/spanish/01-responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage.spanish.md

---
id: bd7158d8c242eddfaeb5bd13
title: Build a Personal Portfolio Webpage
isRequired: true
challengeType: 3
videoUrl: ''
localeTitle: Crear una página de portafolio personal
---

## Descripción
<section id="description"> <strong>Objetivo:</strong> crear una aplicación <a href="https://codepen.io" target="_blank">CodePen.io</a> que sea funcionalmente similar a esta: <a href="https://codepen.io/freeCodeCamp/full/zNBOYG" target="_blank">https://codepen.io/freeCodeCamp/full/zNBOYG</a> . Cumple las siguientes <a href="https://en.wikipedia.org/wiki/User_story" target="_blank">historias de usuario</a> y haz que pasen todas las pruebas. Dale tu propio estilo personal. Puedes usar HTML, JavaScript y CSS para completar este proyecto. Se recomienda CSS simple porque eso es lo que las lecciones han cubierto hasta ahora y debes obtener algo de práctica con CSS simple. Puedes utilizar Bootstrap o SASS si lo deseas. No se recomiendan tecnologías adicionales (solo por ejemplo, jQuery, React, Angular o Vue) para este proyecto, y su uso es bajo su propio riesgo. Otros proyectos te darán la oportunidad de trabajar con diferentes pilas de tecnología como React. Aceptaremos e intentaremos solucionar todos los informes de problemas que utilizan la pila de tecnología sugerida para este proyecto. ¡Feliz codificación! <strong>Historia de usuario n. ° 1:</strong> Mi portafolio debe tener una sección de bienvenida con un ID de <code>welcome-section</code> de <code>welcome-section</code> . <strong>Historia de usuario n. ° 2:</strong> La sección de bienvenida debe tener un elemento <code>h1</code> que contenga texto. <strong>Historia de usuario n. ° 3:</strong> Mi portafolio debe tener una sección de proyectos con una identificación de <code>projects</code> . <strong>Historia de usuario n. ° 4:</strong> La sección de proyectos debe contener al menos un elemento con una clase de <code>project-tile</code> para contener un proyecto. <strong>Historia de usuario n. ° 5:</strong> La sección de proyectos debe contener al menos un enlace a un proyecto. <strong>Historia de usuario n. ° 6:</strong> Mi portafolio debe tener una barra de navegación con un ID de <code>navbar</code> de <code>navbar</code> . <strong>Historia de usuario n. ° 7:</strong> La barra de navegación debe contener al menos un enlace en el que pueda hacer clic para navegar a diferentes secciones de la página. <strong>Historia de usuario n. ° 8:</strong> Mi portafolio debe tener un enlace con un ID de <code>profile-link</code> , que abre mi perfil de GitHub o FCC en una nueva pestaña. <strong>Historia de usuario n. ° 9:</strong> Mi portafolio debe tener al menos una consulta de medios. <strong>Historia de usuario n. ° 10:</strong> La altura de la sección de bienvenida debe ser igual a la altura de la ventana gráfica. <strong>Historia de usuario n. ° 11:</strong> la barra de navegación siempre debe estar en la parte superior de la ventana gráfica. Puedes construir tu proyecto por medio de <a href="http://codepen.io/freeCodeCamp/pen/MJjpwO" target="_blank">este bolígrafo CodePen</a> . O puede usar este enlace CDN para ejecutar las pruebas en el entorno que desee: <code>https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js</code> Una vez que haya terminado, envíe la URL a su cuenta Proyecto con todas sus pruebas aprobadas. Recuerda usar el método de <a href="https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck/19514" target="_blank">lectura-búsqueda-pregunta</a> si te atascas. </section>

## Instrucciones
<section id="instructions">
</section>

## Tests
<section id='tests'>

```yml
tests: []

```

</section>

## Semilla de desafío
<section id='challengeSeed'>

</section>

## Solución
<section id='solution'>

```js
// solution required
```
</section>