Welcoem to posts!!
in the future - u will be able to do some more stuff here,,,!! like pat catgirl- i mean um yeah... for now u can only see others's posts :c
🎬 Nuevo video: Maquetamos el formulario para nuestras listas de la compra con React y Tailwind 4.0
En este nuevo video seguimos construyendo nuestro proyecto y nos centramos en una parte clave: el formulario para gestionar nuestras listas de la compra. Si estás aprendiendo React o quieres reforzar tus conocimientos, este video te va a encantar.
🔹 Cómo crear componentes reutilizables en React
🔹 Desestructuración de props y su importancia
🔹 Renderización condicional para mejorar la UX
🔹 Aplicación de estilos con Tailwind 4.0
Además, este proyecto no solo es una excelente práctica, sino que también puedes incluirlo en tu portfolio.
🎥 Mira el video aquí: https://youtu.be/EfQzg8cHEos?si=um3BZ...
📢 Pregunta para ti: ¿Qué técnica de React te ha resultado más difícil de aprender? Cuéntamelo en los comentarios y lo exploramos en próximos videos. 👇
#ReactJS #TailwindCSS #Frontend #DesarrolloWeb #Programación #AprendeReact #PortfolioDev 🚀
3 - 0
😍 ¡Me he ENAMORADO de TAILWIND CSS 4.0! 😍
En este video, no solo te presentamos el nuevo proyecto que estaremos desarrollando durante las próximas semanas, sino que también exploramos las principales novedades de Tailwind CSS 4, la versión más rápida y eficiente hasta la fecha.
⬇️⬇️ ¡Vente a picar un poco de código con nosotros! ⬇️⬇️
https://youtu.be/RQw_A8nyu_o
🔥 ¿Qué aprenderás en este video?
✅ Tailwind CSS 4 vs. Tailwind CSS 3: Principales diferencias y mejoras.
✅ Nuevo sistema de configuración: Adiós a tailwind.config.js, hola @theme y @import.
✅ El motor Oxide: ¿Cómo logra builds hasta 100 veces más rápidas? ⚡
✅ Cómo iniciar un proyecto con Vite y Tailwind CSS 4 paso a paso.
✅ Las nuevas características CSS avanzadas que mejoran la personalización y el rendimiento.
🎯 Si usas Tailwind en tus proyectos, este video es imprescindible para que te adaptes rápidamente a los cambios y aproveches todas las mejoras.
💬 ¿Qué opinas de Tailwind CSS 4? ¿Crees que estas novedades lo hacen aún mejor? ¡Déjamelo en los comentarios y conversemos! 👇
📌 No olvides suscribirte y activar la campanita 🔔 para más contenido sobre desarrollo web, React y herramientas modernas para frontends.
#TailwindCSS #Tailwind4 #Frontend #DesarrolloWeb #React #CSS
8 - 0
📌 ¿Sabías que en React puedes renderizar un componente en una parte diferente del DOM sin alterar la estructura de tu aplicación?
Esto es posible gracias a React Portals 🚀, una herramienta poderosa que nos permite "teletransportar" componentes dentro del árbol de elementos.
En el nuevo video de nuestro curso de React, exploramos:
✅ Qué son los Portals y cómo funcionan.
✅ Por qué son útiles para modales, tooltips y overlays.
✅ Cómo usarlos correctamente con createPortal().
✅ Buenas prácticas para mejorar accesibilidad y evitar problemas de estilo.
Si alguna vez te has encontrado con problemas de posicionamiento en modales o tooltips dentro de React, este video es para ti. ¡Vamos a aprender juntos! 🎬🔥
💬 ¿Ya has usado Portals en tus proyectos? ¿En qué casos te han sido útiles? Te leo en los comentarios. 👇
🔗 Mira el video aquí: https://youtu.be/asNw3OeOrdo
#React #JavaScript #WebDevelopment #FrontEnd #Programación
2 - 0
⏳ ¿Cómo manejar intervalos en JavaScript como un PRO? ⏳
En nuestro último video, seguimos mejorando nuestra aplicación de temporizador, pero esta vez vamos más allá del código. Exploramos a fondo setInterval, entendemos cómo se diferencia de setTimeout, y vemos cómo integrarlo correctamente en React usando refs para evitar errores y optimizar el rendimiento.
💡 ¿Cuándo usar setInterval?
💡 ¿Cómo asegurarnos de que se detiene correctamente?
💡 ¿Qué pasa si lo combinamos con estados en React?
Si alguna vez has trabajado con temporizadores en JavaScript, sabes que gestionarlos mal puede traer problemas de rendimiento y bugs difíciles de detectar. En este video, te enseño cómo hacerlo bien desde el principio. 🚀
👉 Mira el video y dime en los comentarios: ¿Has tenido problemas con los temporizadores en React? ¿Cómo los has solucionado? ¡Hablemos sobre ello! 🎬🔥
https://youtu.be/Z3aEoRvuXLw?si=inMbD...
4 - 0
🚀 ¡Mañana comienza Talent Arena y estaremos por allí! 🎉
Si eres developer, te apasiona la tecnología o simplemente quieres conectar con las mentes más brillantes del sector, este evento es imperdible. Del 3 al 5 de marzo, Barcelona se convierte en el epicentro de la innovación, el networking y el crecimiento profesional.
🔹 Charlas con referentes mundiales 🗣️
Desde Steve Wozniak (cofundador de Apple) hasta Garry Kasparov, pasando por expertos en IA, ciberseguridad, cloud, desarrollo de software y más.
🔹 Talleres y hackatones 💡
Si te gusta ensuciarte las manos con código, prepárate para retos como el GSMA Open Gateway Hackathon, donde podrás desarrollar soluciones innovadoras en redes programables.
🔹 Oportunidades laborales y networking 🔗
Empresas tecnológicas, startups y recruiters estarán ahí buscando talento. Si buscas trabajo en el sector tech, este es tu momento.
📍 ¿Dónde? Fira de Montjuïc, Barcelona
⏳ ¿Cuándo? Del 3 al 5 de marzo
🎟️ ¿Cuánto cuesta? ¡Es GRATIS! Solo tienes que registrarte.
📌Vente al evento de forma gratuita accediendo a través del siguiente enlace:
talentarena.tech/es/?utm_source=SergioCorr&utm_med…
🔥 Yo estaré recorriendo el evento, así que si te pasas, dime y nos vemos!
¿Qué es lo que más te emociona del Talent Arena? Déjamelo en comentarios o mándame un mensaje si quieres hacer networking. 👇💬
#TalentArena2025 #MWC25 #MWC2025 #Developers #Networking #TechInnovation #BarcelonaTech #Oportunidades #Ad #Publicidad
8 - 2
🔍 Desentrañando el misterio de useImperativeHandle en React: Domina este hook avanzado 🚀
En nuestro último video del canal Picando Código, nos sumergimos en el fascinante mundo de useImperativeHandle, uno de los hooks menos conocidos pero más poderosos de React. Este hook permite que los componentes hijos expongan funciones o propiedades específicas a sus componentes padres, creando una interfaz personalizada para interactuar directamente entre ellos. Pero, ¿por qué es tan útil?
👀 Te lo explicamos aquí: https://youtu.be/jUH9nbWtCP4?si=zR1Z1...
Te explicaremos cómo y cuándo utilizar useImperativeHandle, destacando ejemplos prácticos como validación de formularios o control avanzado de estados. También analizamos en profundidad su relación con useRef y te mostramos por qué este hook es una herramienta clave para escribir un código más claro, eficiente y adaptable en proyectos complejos. Además, exploramos los pros y contras de usarlo, para que sepas exactamente cuándo aprovechar todo su potencial.
💡 Si alguna vez te has preguntado cómo optimizar la comunicación entre componentes o cómo darle a tu proyecto React un toque profesional, ¡este video es para ti! Descúbrelo ahora en nuestro canal de YouTube Picando Código y suscríbete para seguir aprendiendo con nuestros más de 80 videos sobre React, actualizados semanalmente.
👉 ¿Ya conocías este hook o es la primera vez que escuchas sobre él? Comparte tus impresiones y preguntas en los comentarios. ¡Estamos aquí para aprender juntos! 🎥✨
3 - 0
🚀 ¡Descubre el secreto para trabajar referencias en React como un PRO!
¿Sabías que las referencias son una herramienta clave para gestionar componentes en React? En nuestro último video, te enseñamos cómo usar forwardRef, una técnica esencial para pasar referencias de un componente padre a un hijo de manera correcta y profesional. Pero, ¡cuidado! También te mostramos por qué cambiar el nombre de la prop "ref" puede funcionar, pero no es la mejor práctica.
💡 Si alguna vez te has preguntado cómo mejorar la comunicación entre componentes personalizados o cómo mantener un código limpio y eficiente, este video es para ti. Te explicamos paso a paso cómo optimizar tus proyectos con esta técnica y evitar errores comunes que pueden complicar tu desarrollo.
👉 ¿Ya has usado referencias en tus proyectos de React? ¿Conocías la técnica de forwardRef? Comparte tu experiencia en los comentarios y cuéntanos cómo este video te ayuda a mejorar tus habilidades. ¡Dale clic al enlace y lleva tu conocimiento de React al siguiente nivel!
🎥 Mira el video aquí => https://www.youtube.com/watch?v=Q-wtc...
No olvides suscribirte a nuestro canal para seguir aprendiendo sobre React cada semana. ¡Te esperamos en los comentarios para debatir y aprender juntos! 🌟
5 - 0
¡Descubre por qué React es el futuro del desarrollo web! 🚀
Si estás iniciando en el mundo del desarrollo web o ya tienes experiencia con JavaScript, probablemente te hayas preguntado: ¿Es React realmente necesario? 🤔
📎https://youtu.be/ZWHJSS4ZtIk?si=byQMq...
En nuestro primer video del tutorial de React, hacemos una introducción completa a esta biblioteca tan poderosa y respondemos a esa gran pregunta. Aquí exploramos:
1️⃣ ¿Qué es React y por qué ha transformado la forma en que construimos aplicaciones web?
2️⃣ La diferencia entre webs populares que utilizan React (como Instagram, Netflix y Airbnb) y aquellas que no lo hacen, para ver en vivo las ventajas competitivas que ofrece React en rendimiento y experiencia de usuario.
3️⃣ ¿Es hora de dar el salto de JavaScript Vanilla a React? Analizamos casos en los que React es la mejor opción para optimizar y escalar tu proyecto, y los momentos en que quedarte con JavaScript puede limitarte.
Y esto es solo el comienzo. 🔥 Actualmente, nuestra lista de reproducción de React en YouTube tiene más de 70 videos, desde conceptos básicos hasta temas avanzados, ¡y se actualiza cada semana! 🎉 No importa si eres principiante o quieres profundizar más, hay contenido nuevo esperando por ti.
👀 Si aún no has dado el salto a React, ¡este video te abrirá los ojos a lo que podrías lograr!
👉 ¿Qué estás esperando? Mira el video y cuéntanos en los comentarios: ¿Qué te parece React? ¿Ya lo estás usando o estás en ese proceso de decidir si aprenderlo?
6 - 0
⚔️ ¡Maquetamos un componente Dialog para nuestro nuevo juego! ⏳
¿Alguna vez has pensado en crear un componente interactivo para un juego en el que el tiempo es tu enemigo? 🕰️ En nuestro último video, damos un paso adelante en la construcción de nuestro juego "Lucha Contra el Reloj", donde exploramos a fondo cómo maquetar un componente clave usando React y la etiqueta Dialog para una experiencia de usuario envolvente y dinámica. 🎮
Vente a picar un poco de código: https://youtu.be/ZLxjPoC6E-k?si=rbgsh...
En este tutorial, te muestro cómo integrar Dialog de manera eficiente en React, creando una ventana emergente que guiará a los jugadores en cada fase del juego. Te enseño trucos para manejar estados de manera óptima, capturar eventos y controlar el flujo del juego sin interrupciones. ¡Una excelente oportunidad para mejorar la estructura de tus componentes y añadir interactividad! ⚙️✨
Además, exploramos cómo un diseño intuitivo y bien maquetado puede hacer que la experiencia de usuario sea aún más fluida y divertida. Desde la gestión de tiempos hasta el diseño visual, el video cubre todos los detalles. No solo aprenderás a trabajar con Dialog, sino que entenderás cómo puedes aplicarlo en distintos proyectos de React. 🌐💡
¿Te animas a probarlo? 🚀 No te pierdas este nuevo episodio, y cuéntame en los comentarios cómo integrarías este tipo de componentes en tus proyectos. 👇 ¡Suscríbete, deja tu like y compártelo con quien creas que lo necesita!
#ReactJS #DesarrolloWeb #ComponentesReact #FrontendDev
7 - 0
🚀 ¡Nuevo vídeo en mi canal! 🚀
Esta vez, nos metemos de lleno en la práctica con React Hooks y useRef 🔄. En este nuevo caso de uso, trabajamos en una aplicación de videojuegos donde tendrás que luchar contra el reloj ⏰. Pero eso no es todo: también aprenderemos a gestionar el Scope de los componentes y cómo manejar las variables de manera eficiente en cada renderizado.
¿Te gustaría optimizar tu código y entender mejor cómo funciona React bajo el capó? ¡Este vídeo es para ti! 🔥
🔗 https://youtu.be/LfGuQEgSpa0?si=PTSAs...
👉 Cuéntame en los comentarios si ya has usado useRef o si te ha resultado útil este contenido. ¡Nos leemos! 👇
#React #Hooks #useRef #JavaScript #DesarrolloWeb #Programación #Frontend #Desarrolladores #Código #ReactTips #Optimización
4 - 0
Bienvenidos a Picando Código! 🚀
En Picando Código, estamos dedicados a compartir conocimiento sobre programación y desarrollo web a través de tutoriales y cursos detallados. Desde JavaScript, React, y HTML/CSS hasta Java, PHP, y bases de datos, te ofrecemos contenido práctico y actualizado para ayudarte a convertirte en un desarrollador experto.
🔧 ¿Qué encontrarás aquí?
➠ Tutoriales paso a paso en tecnologías clave.
➠ Proyectos prácticos y ejemplos reales para aplicar lo aprendido.
➠Consejos y mejores prácticas para mejorar tus habilidades.
Únete a nuestra comunidad para aprender, crecer y compartir el viaje en el mundo del desarrollo web. ¡Suscríbete y no te pierdas ningún video! 🌟