Como programador, tienes la tarea de replicar una imagen como un sitio web.
No clones este repositorio porque vamos a usar una plantilla diferente.
Recomendamos abrir el repositorio de la plantilla html
usando una herramienta de provisionamiento como Codespaces (recomendado) o Gitpod. Alternativamente, puedes clonarlo en tu computadora local usando el comando git clone
.
Este es el repositorio que necesitas abrir o clonar:
https://github.com/4GeeksAcademy/html-hello
Por favor sigue estos pasos cómo comenzar un proyecto de codificación.
💡 Importante: Recuerda guardar y subir tu código a GitHub creando un nuevo repositorio, actualizando el remoto (git remote set-url origin <your new url>
) y subiendo el código a tu nuevo repositorio usando los comandos add
, commit
y push
desde la terminal de git.
- Crea un sitio web que se vea exactamente como este:
Aquí puedes ver cada componente separado:
- Inicia el CSS y el HTML desde cero, no lo reutilices en otro ejercicio porque terminarás teniendo un desastre.
- Antes de comenzar a programar haz un dibujo del sitio web con todos los componentes de bootstrap que usarás.
- Una vez hayas identificado todos los componentes, comienza con el navbar (desde arriba hasta abajo) e intenta adaptar los ejemplos que encuentres en internet a lo que se te pide en la imagen. No copies y pegues solamente, entiende y procesa, si no entiendes los nombres de las clases usadas en el componente, terminarás pegándote contra una pared y frustrado.
- Usa todos los posibles bootstrap utilities (helpers), toma el tiempo de leerlos todos porque harán tu vida 99% más fácil.
- Los proyectos tienen que ser 100% responsive utilizando el sistema de grillas de bootstrap.
- Usa todos los posibles componentes de bootstrap, la idea es que los aprendas para poder reutilizarlos durante el resto de tu vida.
Tienes la lección en línea y la hoja de trucos de bootstrap en la sección de activos. También te recomendamos videos tutoriales en bootstrap de Net Ninja.
- Limpia el caché (siempre actualiza con command+shift+R), utilizando el modo incógnito en Google Chrome.
- Busca soluciones en google.
- Habla con otros estudiantes.
- Habla con desarrolladores senior que conozcas.
- Habla con mentores en slack.
- No tengas miedo a preguntar.
- No debes frustrarte y pensar que no sirves para esto: todos los desarrolladores se quedan atascados todo el tiempo, ¡pregunta! ¿Cómo sabes si sirves o no en algo que no sabes? La programación es una ciencia, los hechos son importantes y tú no tienes hechos.
- No te cuestiones por horas sin buscar ayuda: Google solo es tan útil como tú sepas buscar en él, habla con otros estudiantes o con tus instructores.
- Cambia la estrategia: Einstein dijo una vez, si haces lo mismo obtendrás los mismos resultados.
Este y otros proyectos son usados para aprender a programar por parte de los alumnos de 4Geeks Academy Coding Bootcamp realizado por Alejandro Sánchez y muchos otros contribuyentes. Conoce más sobre nuestros Curso de Programación para convertirte en Full Stack Developer, o nuestro Data Science Bootcamp.