raupulus /
Mini-Aplicaciones-Web
Codigo de pequeñas aplicaciones modulares que permiten la fácil incorporación a un proyecto web. Este es un mirror de: https://gitlab.com/raupulus/Mini-Aplicaciones-Web
Loading repository data…
URG022 / repository
Este es mi portafolio personal como estudiante de Ingeniería en Desarrollo de Software. Aquí muestro algunos de los proyectos que he desarrollado utilizando HTML, CSS y JavaScript. Mi objetivo es seguir aprendiendo, aplicar mis conocimientos en proyectos reales y compartir mi crecimiento profesional.
Desarrollador de Software | Backend & Frontend | El Salvador
Un portafolio digital moderno y profesional que presenta mis proyectos, habilidades y experiencia en desarrollo de software.
✅ Diseño Responsivo - Adaptado para dispositivos móviles, tablets y desktop
✅ Animaciones Fluidas - Transiciones suaves al hacer scroll
✅ Menú Móvil Dinámico - Navegación hamburgesa con animación
✅ Formulario de Contacto - Integración con EmailJS para envío de correos
✅ Tema Oscuro Editorial - Estética moderna y professional
✅ Buscador de Habilidades - Carrusel interactivo de tecnologías
✅ Galería de Proyectos - Showcase de trabajos realizados
✅ SEO Optimizado - Metadatos y estructura semántica
Secciones principales:
HTML5 - Estructura semántica
CSS3 - Estilos avanzados + Custom Properties
JavaScript - Interactividad y animaciones
Font Awesome - Iconografía
Google Fonts - Tipografía (Syne + DM Sans)
EmailJS - Servicio de envío de correos
git clone https://github.com/URG022/Portafolio-URG.git
cd Portafolio-URG
# Opción 1: Abrir directamente
open index.html
# Opción 2: Usar Live Server (VS Code)
# Instalar extensión "Live Server"
# Click derecho en index.html → "Open with Live Server"
# Con Python 3
python -m http.server 8000
# Con Python 2
python -m SimpleHTTPServer 8000
# Con Node.js (http-server)
npx http-server
Portafolio-URG/
├── index.html # Archivo principal HTML
├── style.css # Estilos CSS
├── script.js # Lógica JavaScript
├── img/ # Carpeta de imágenes
│ └── URG2.jpg # Foto de perfil
└── README.md # Este archivo
En index.html, busca estas secciones:
<!-- Hero Section -->
<h1>Ulises Rivera<br><span>Guillén</span></h1>
<!-- About Section -->
<p>Soy estudiante de Ingeniería...</p>
<!-- Contact Info -->
<span>ulisesriveraguillen519@gmail.com</span>
En la sección de #projects:
<div class="project-card">
<div class="project-image">
<img src="./img/proyecto.jpg" alt="Nombre">
</div>
<div class="project-info">
<h3>Nombre del Proyecto</h3>
<p>Descripción...</p>
<!-- Agregar más detalles -->
</div>
</div>
En la sección #tools, duplica bloques de skill-card:
<div class="skill-card" data-tip="Tu Tech">
<div class="skill-card-inner">
<!-- SVG del logo -->
<span class="skill-name">Nombre</span>
<span class="skill-level">Nivel</span>
</div>
</div>
Por defecto usa un email simulado. Para recibir correos reales:
Opción A: Usar Formspree
// En script.js, cambia la acción del formulario
<form action="https://formspree.io/f/TU_ID" method="POST">
Opción B: Usar EmailJS
// Crea cuenta en emailjs.com
// Obtén: Service ID, Template ID, Public Key
emailjs.init('TU_PUBLIC_KEY');
emailjs.send('TU_SERVICE_ID', 'TU_TEMPLATE_ID', {
from_name: nombre,
from_email: email,
message: mensaje
});
Header Scroll Detection
// Cambia estilo cuando scroll > 40px
window.addEventListener('scroll', () => {
header.classList.toggle('scrolled', window.scrollY > 40);
});
Menú Móvil Toggle
// Abre/cierra menú en dispositivos móviles
menuToggle.addEventListener('click', () => {
navLinks.classList.toggle('open');
});
Animación al Scroll (Intersection Observer)
// Elementos aparecen con animación cuando entran en vista
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('visible');
}
});
});
Formulario Dinámico
// Validación y feedback visual del formulario
contactForm.addEventListener('submit', async (e) => {
// Envío y manejo de respuesta
});
| Dispositivo | Breakpoint | Comportamiento |
|---|---|---|
| Mobile | < 768px | Menú hamburguesa, stack vertical |
| Tablet | 768px - 1024px | Layout intermedio |
| Desktop | > 1024px | Navegación completa, grid |
Este proyecto es de uso personal. Siéntete libre de usar como referencia o inspiración.
Ulises Rivera Guillén
Estudiante de 4to año en Ingeniería en Desarrollo de Software (ITCA-FEPADE)
Especialidades:
Estado: Disponible para prácticas o posición Junior
Si encuentras bugs o tienes sugerencias:
Última actualización: Abril 2026
⭐ Si te gusta, dale una estrella en GitHub ⭐
Selected from shared topics, language and repository description—not editorial ratings.
raupulus /
Codigo de pequeñas aplicaciones modulares que permiten la fácil incorporación a un proyecto web. Este es un mirror de: https://gitlab.com/raupulus/Mini-Aplicaciones-Web
choidavid4 /
Este es mi tateti armado con html css y js
eduardofierropro /
Este año se está preparando el juego de The Crown of Wu, un juego donde su CEO es mi compañero de trabajo por lo tanto he querido hacer una mini landing page para pasar el ratillo y dar a conocer el juego.
EstebanPajares /
Este es mi portafolio en el que encontrarás toda la información relacionada con mi perfil y los proyectos trabajados en la industria IT. Proyecto implementado desde un diseño en Figma.
greg0910 /
Este es un ejercicio que realicé para practicar HTML, CSS y JavaScript
stjv-code /
Este es mi primer proyecto, una calculadora simple hecha en JS (JavaScript), lo subo para ir mostrando mi progreso como programador.