Cómo hacer un portafolio web profesional para tu carrera

Tu currículum vitae ya no es suficiente. Las empresas de tecnología en Honduras quieren ver qué has construido, no solo leer qué sabes hacer. Un portafolio web profesional es tu carta de presentación como ingeniero y puede ser la diferencia entre conseguir la entrevista o quedar en la pila de CVs ignorados.

Por qué necesitas un portafolio

Si buscas empleo en desarrollo: Los reclutadores de empresas como Grupo Karim's, BAC, Ficohsa o startups locales revisan portafolios. Un proyecto funcional vale más que una lista de tecnologías en tu CV.

Si buscas freelance: Los clientes necesitan ver trabajo previo antes de contratarte. Tu portafolio es tu vitrina.

Si estás por graduarte: Un portafolio con tu proyecto de tesis, proyectos de clase y proyectos personales demuestra crecimiento profesional.

Qué incluir en tu portafolio

Sección 1: Presentación

Tu nombre, título profesional (o lo que aspiras ser), una foto profesional y una descripción breve de quién eres. Dos o tres oraciones bastan.

Ejemplo: "Ingeniero en Sistemas egresado de UNITEC. Desarrollo aplicaciones web con React y aplicaciones móviles con Flutter. Me enfoco en soluciones que resuelven problemas reales."

No escribas una biografía completa. El visitante tiene 10 segundos de atención.

Sección 2: Proyectos (la más importante)

Aquí es donde demuestras lo que sabes hacer. Cada proyecto debe incluir:

• Nombre del proyecto con un título descriptivo
• Descripción breve — Qué problema resuelve (2-3 oraciones)
• Captura de pantalla o demo — Una imagen vale más que un párrafo
• Tecnologías utilizadas — Badges o etiquetas del stack
• Enlace al repositorio — GitHub, siempre
• Enlace a la demo — Si está desplegado, inclúyelo

Cuántos proyectos incluir: Entre 3 y 6. Es mejor tener 4 proyectos bien documentados que 12 a medias.

Qué tipos de proyectos destacar:

Tipo de proyecto	Por qué lo incluyes
Proyecto de tesis	Demuestra capacidad de resolver problemas complejos
Proyecto de clase destacado	Muestra tu progreso académico
Proyecto personal	Demuestra iniciativa y aprendizaje autónomo
Contribución open source	Demuestra colaboración y trabajo en equipo
Freelance o cliente real	Demuestra experiencia profesional

Sección 3: Habilidades

Lista tus tecnologías organizadas por categoría. No infles la lista. Si pusiste Python pero solo hiciste un "Hola Mundo", no lo incluyas.

Formato recomendado:

• Frontend: React, TypeScript, Tailwind CSS, HTML5
• Backend: Node.js, Express, Firebase
• Móvil: Flutter, Dart
• Base de datos: PostgreSQL, Firestore
• Herramientas: Git, GitHub, Figma, Postman

Sección 4: Sobre mí

Un poco más de contexto sobre tu trayectoria. Dónde estudias o estudiaste, qué te motiva, áreas de interés. Mantenlo profesional pero con personalidad.

Sección 5: Contacto

Formulario de contacto o al menos tu correo, LinkedIn y GitHub. Facilita que te encuentren.

Herramientas gratuitas para construirlo

Opción 1: HTML + CSS + JavaScript (nivel básico)

Si quieres algo simple y rápido, una página estática funciona perfectamente. Usa una plantilla de HTML5 y personalízala.

Ventaja: Control total, sin dependencias. Desventaja: Menos funcionalidades dinámicas.

Opción 2: React + Tailwind + Vercel (nivel intermedio)

Si ya cursaste desarrollo web, construir tu portafolio con React demuestra tus habilidades y te da práctica real.

Ventaja: Demuestra dominio del framework, desplegable gratis en Vercel. Desventaja: Requiere conocimiento previo de React.

Opción 3: Next.js + MDX (nivel avanzado)

Si quieres un portafolio con blog integrado (recomendado para diferenciarte), Next.js con archivos MDX te permite escribir artículos como si fueran Markdown.

Ventaja: SEO optimizado, blog integrado, rendimiento excelente. Desventaja: Curva de aprendizaje si no conoces Next.js.

Opción 4: Plataformas sin código

Si no eres de desarrollo web pero necesitas presencia online:

• GitHub Pages — Gratis, usando plantillas de Jekyll
• Notion + Super.so — Tu página de Notion convertida en sitio web
• Carrd.co — Páginas simples de una sola sección

Despliegue gratuito

No necesitas pagar hosting. Estas opciones son gratuitas:

Plataforma	Ideal para	Límite gratis
Vercel	React, Next.js	Proyectos personales ilimitados
Netlify	Sitios estáticos, React	100 GB de ancho de banda
GitHub Pages	HTML estático, Jekyll	Repositorios públicos
Firebase Hosting	Cualquier frontend	10 GB de transferencia

Errores que debes evitar

1. Usar plantillas sin personalizar — Si tu portafolio se ve idéntico al template de Bootstrap, pierde impacto
2. Proyectos sin descripción — Un enlace a un repositorio sin README ni explicación no dice nada
3. Información desactualizada — Si tu último proyecto es de hace dos años, parece que dejaste de aprender
4. Diseño sobrecargado — Animaciones excesivas, colores neón y 15 fuentes diferentes gritan amateur
5. Sin versión móvil — Si tu portafolio se ve mal en teléfono, perdiste la mitad de tus visitantes
6. Links rotos — Verifica que todos los enlaces funcionen antes de compartirlo

Ejemplo de estructura profesional

Pagina principal
  - Hero: Nombre, titulo, foto, CTA
  - Proyectos destacados (3-4 cards)
  - Habilidades (grid de tecnologias)
  - Sobre mi (breve)
  - Contacto (formulario o enlaces)

Pagina de proyecto individual (opcional)
  - Descripcion extendida
  - Capturas de pantalla
  - Problema que resuelve
  - Stack utilizado
  - Lecciones aprendidas
  - Enlace a demo y repositorio

El portafolio como proyecto de clase

En varias universidades de Honduras, crear tu portafolio web puede funcionar como proyecto de clase para materias de desarrollo web, programación o sistemas de información. Pregúntale a tu catedrático — matas dos pájaros de un tiro.

En Folium Labs creamos portafolios web profesionales para estudiantes y profesionales. Si prefieres que un equipo experto diseñe y desarrolle tu portafolio mientras tú te concentras en tu tesis, estamos para ayudarte.

---

Tu portafolio es tu primer proyecto profesional. Trátalo como tal: planifícalo, diséñalo, desarróllalo y mantenlo actualizado.

Cotiza tu portafolio web →