eme
@emedevelopa.bsky.social
Mamá full time, aprendiz de desarrolladora cuando las bestias duermen 💪
https://github.com/emedevelopa
https://dribbble.com/emedevelopa
https://github.com/emedevelopa
https://dribbble.com/emedevelopa
May 27, 2025 at 8:05 PM
May 21, 2025 at 8:23 AM
I’ve been playing around with CSS animations and just added this cute little dot cursor effect. What do you think? Would love to hear your thoughts! ❤️
#WebDesign #FrontEnd #design
#WebDesign #FrontEnd #design
May 17, 2025 at 1:28 PM
I’ve been playing around with CSS animations and just added this cute little dot cursor effect. What do you think? Would love to hear your thoughts! ❤️
#WebDesign #FrontEnd #design
#WebDesign #FrontEnd #design
May 9, 2025 at 4:43 AM
The first of many projects in @webflow !
#webdesign #webflow #portfoliotemplate #design #ux #ui #portfolio #webtemplate
#webdesign #webflow #portfoliotemplate #design #ux #ui #portfolio #webtemplate
May 2, 2025 at 11:51 AM
The first of many projects in @webflow !
#webdesign #webflow #portfoliotemplate #design #ux #ui #portfolio #webtemplate
#webdesign #webflow #portfoliotemplate #design #ux #ui #portfolio #webtemplate
March 29, 2025 at 9:55 AM
Por las mañanas trabajando en el proximo diseño y por las tardes sufriendo con la recursividad en JS. No se hacer una sola cosa 😂
March 27, 2025 at 6:50 AM
Por las mañanas trabajando en el proximo diseño y por las tardes sufriendo con la recursividad en JS. No se hacer una sola cosa 😂
Finalmente, una vez que tengo todos los elementos creados, los uno utilizando appendChild para que la estructura HTML tenga sentido y todo encaje correctamente.
#WebDev #JavaScript #FrontEnd
#WebDev #JavaScript #FrontEnd
March 21, 2025 at 9:42 AM
Finalmente, una vez que tengo todos los elementos creados, los uno utilizando appendChild para que la estructura HTML tenga sentido y todo encaje correctamente.
#WebDev #JavaScript #FrontEnd
#WebDev #JavaScript #FrontEnd
El contenido de cada card lo agrego accediendo a las propiedades del array de posts (usando el nombre de la propiedad como clave) y lo añado con textContent.
#WebDev #JavaScript #FrontEnd
#WebDev #JavaScript #FrontEnd
March 21, 2025 at 9:42 AM
El contenido de cada card lo agrego accediendo a las propiedades del array de posts (usando el nombre de la propiedad como clave) y lo añado con textContent.
#WebDev #JavaScript #FrontEnd
#WebDev #JavaScript #FrontEnd
Con un bucle forEach recorro los posts y genero los elementos necesarios. Con createElement creo los elementos (como div, article, p) y les añado clases con classList.add para aplicar estilos. Además, no olvido incluir los atributos aria necesarios usando setAttribute.
#WebDev #JavaScript #FrontEnd
#WebDev #JavaScript #FrontEnd
March 21, 2025 at 9:42 AM
Con un bucle forEach recorro los posts y genero los elementos necesarios. Con createElement creo los elementos (como div, article, p) y les añado clases con classList.add para aplicar estilos. Además, no olvido incluir los atributos aria necesarios usando setAttribute.
#WebDev #JavaScript #FrontEnd
#WebDev #JavaScript #FrontEnd
Generar cards de posts de forma dinámica con JavaScript es fácil. Solo necesitas un array de objetos y un bucle para crear el HTML.
#WebDev #JavaScript #FrontEnd
#WebDev #JavaScript #FrontEnd
March 21, 2025 at 9:42 AM
Generar cards de posts de forma dinámica con JavaScript es fácil. Solo necesitas un array de objetos y un bucle para crear el HTML.
#WebDev #JavaScript #FrontEnd
#WebDev #JavaScript #FrontEnd
Con URLSearchParams, leo el parámetro de la URL y filtro los posts para mostrar solo los que coincidan con la categoría seleccionada.
#FrontEndDeveloper #WebDevelopment #JavaScript
#FrontEndDeveloper #WebDevelopment #JavaScript
March 18, 2025 at 11:39 AM
Con URLSearchParams, leo el parámetro de la URL y filtro los posts para mostrar solo los que coincidan con la categoría seleccionada.
#FrontEndDeveloper #WebDevelopment #JavaScript
#FrontEndDeveloper #WebDevelopment #JavaScript
Al hacer clic en un filtro, la URL se actualiza para incluir el parámetro category correspondiente, permitiendo que la página se filtre dinámicamente según la categoría seleccionada.
#FrontEndDeveloper #WebDevelopment #javascript
#FrontEndDeveloper #WebDevelopment #javascript
March 18, 2025 at 11:39 AM
Al hacer clic en un filtro, la URL se actualiza para incluir el parámetro category correspondiente, permitiendo que la página se filtre dinámicamente según la categoría seleccionada.
#FrontEndDeveloper #WebDevelopment #javascript
#FrontEndDeveloper #WebDevelopment #javascript
Llamo a todos los botones en el script y les paso una función que itera por cada uno de ellos para que aplique el atributo aria-pressed en true o false según sea su estado.
#FrontEndDeveloper #WebDevelopment #JavaScript
#FrontEndDeveloper #WebDevelopment #JavaScript
March 18, 2025 at 11:39 AM
Llamo a todos los botones en el script y les paso una función que itera por cada uno de ellos para que aplique el atributo aria-pressed en true o false según sea su estado.
#FrontEndDeveloper #WebDevelopment #JavaScript
#FrontEndDeveloper #WebDevelopment #JavaScript
Para permitir que los usuarios filtren los posts por categoría, utilicé botones con data-category que representan cada categoría. Además cada botón activa un filtro visual y de accesibilidad utilizando aria-pressed para indicar qué categoría está seleccionada.
#FrontEndDeveloper
#FrontEndDeveloper
March 18, 2025 at 11:39 AM
Para permitir que los usuarios filtren los posts por categoría, utilicé botones con data-category que representan cada categoría. Además cada botón activa un filtro visual y de accesibilidad utilizando aria-pressed para indicar qué categoría está seleccionada.
#FrontEndDeveloper
#FrontEndDeveloper
Para gestionar los artículos del blog, utilizo un array de objetos en JS. Así se ve 👇
#FrontEndDeveloper #JavaScript #WebDevelopment
#FrontEndDeveloper #JavaScript #WebDevelopment
March 18, 2025 at 11:39 AM
Para gestionar los artículos del blog, utilizo un array de objetos en JS. Así se ve 👇
#FrontEndDeveloper #JavaScript #WebDevelopment
#FrontEndDeveloper #JavaScript #WebDevelopment
Iré contando poco a poco que he hecho y cómo así de paso refresco la memoría y me sirve de repaso. Hoy voy con los filtros por categoría.
#FrontEnd #JavaScript #Webdevelopment
#FrontEnd #JavaScript #Webdevelopment
March 18, 2025 at 11:39 AM
Iré contando poco a poco que he hecho y cómo así de paso refresco la memoría y me sirve de repaso. Hoy voy con los filtros por categoría.
#FrontEnd #JavaScript #Webdevelopment
#FrontEnd #JavaScript #Webdevelopment
Y por fin está listo!! Un blog hecho full JavaScript, totalmente responsive y con las siguientes funcionalidades:
🔸Filtros por categoría
🔸Paginación
🔸Posts creados dinámicamente
🔸Comentarios
🔸Modo claro/oscuro
Aquí está el bebito 👇
thisismyfirstprojectblog.netlify.app
#FrontEnd #JavaScript
🔸Filtros por categoría
🔸Paginación
🔸Posts creados dinámicamente
🔸Comentarios
🔸Modo claro/oscuro
Aquí está el bebito 👇
thisismyfirstprojectblog.netlify.app
#FrontEnd #JavaScript
March 18, 2025 at 11:39 AM
Y por fin está listo!! Un blog hecho full JavaScript, totalmente responsive y con las siguientes funcionalidades:
🔸Filtros por categoría
🔸Paginación
🔸Posts creados dinámicamente
🔸Comentarios
🔸Modo claro/oscuro
Aquí está el bebito 👇
thisismyfirstprojectblog.netlify.app
#FrontEnd #JavaScript
🔸Filtros por categoría
🔸Paginación
🔸Posts creados dinámicamente
🔸Comentarios
🔸Modo claro/oscuro
Aquí está el bebito 👇
thisismyfirstprojectblog.netlify.app
#FrontEnd #JavaScript
🔸Footer con un formulario de suscripción, enlaces a cada una de las categorías y a redes sociales.
#WebDevelopment #HTML #Accessibility #FrontEnd
#WebDevelopment #HTML #Accessibility #FrontEnd
March 6, 2025 at 5:21 PM
🔸Footer con un formulario de suscripción, enlaces a cada una de las categorías y a redes sociales.
#WebDevelopment #HTML #Accessibility #FrontEnd
#WebDevelopment #HTML #Accessibility #FrontEnd
🔸Contenido principal con
🔸Título con
🔸Título con
🔸Contenedor de filtros con etiquetas
March 6, 2025 at 5:21 PM
🔸Contenido principal con
🔸Título con
🔸Título con
🔸Contenedor de filtros con etiquetas
🔸<header> mejora la estructura para lectores de pantalla y <nav> define el área de navegación del sitio.
🔸Aria-label="Main navigation" para que los usuarios de tecnologías asistivas puedan identificarla fácilmente.
🔸 Input con <label> esencial para accesibilidad.
🔸Aria-label="Main navigation" para que los usuarios de tecnologías asistivas puedan identificarla fácilmente.
🔸 Input con <label> esencial para accesibilidad.
March 6, 2025 at 5:21 PM
🔸<header> mejora la estructura para lectores de pantalla y <nav> define el área de navegación del sitio.
🔸Aria-label="Main navigation" para que los usuarios de tecnologías asistivas puedan identificarla fácilmente.
🔸 Input con <label> esencial para accesibilidad.
🔸Aria-label="Main navigation" para que los usuarios de tecnologías asistivas puedan identificarla fácilmente.
🔸 Input con <label> esencial para accesibilidad.
Me encanta la parte del diseño. Creé un sistema de diseño e implementé el diseño atómico creando componentes reutilizables para facilitar la escalabilidad y la adaptabilidad a distintos dispositivos.
#WebDevelopment #HTML #Accessibility #FrontEnd
#WebDevelopment #HTML #Accessibility #FrontEnd
March 6, 2025 at 5:21 PM
Me encanta la parte del diseño. Creé un sistema de diseño e implementé el diseño atómico creando componentes reutilizables para facilitar la escalabilidad y la adaptabilidad a distintos dispositivos.
#WebDevelopment #HTML #Accessibility #FrontEnd
#WebDevelopment #HTML #Accessibility #FrontEnd
