react

Recursos de programación de react
Empezamos el año haciendo repaso del estado de JavaScript en 2021 🚀 ¿Es el hype de Remix justificado? ¿Empieza el declive de React? ¿Le decimos adiós a React Native de una vez? 😢 🔗 Links relacionados ├ 🔖 Cursos de JavaScript: https://pro.codely.tv/library/by/category/javascript/ └ 🎨 Estado de JavaScript: https://2021.stateofjs.com {▶️} CodelyTV ├ 🎥 Suscríbete: https://youtube.com/c/CodelyTV?sub_confirmation=1 ├ 🐦 Twitter CodelyTV: https://twitter.com/CodelyTV ├ 🍺 Twitter Isma: https://twitter.com/ismanapa ├ 💂‍♂️ Twitter Rafa: https://twitter.com/rafaoe ├ 📸 Instagram: https://instagram.com/CodelyTV ├ ℹ️ LinkedIn: https://linkedin.com/company/codelytv ├ 🟦 Facebook: https://facebook.com/CodelyTV └ 📕 Catálogo cursos: https://bit.ly/cursos-codely
▬▬▬▬▬▬ Título de la Sesión ▬▬▬▬▬▬ Mejora del rendimiento del componente TreeFilter en el panel de contenidos ▬▬▬▬▬▬ Ponente ▬▬▬▬▬▬ Beltrán Rengifo Beltrán es Senior Frontend Engineer en Liferay y entre sus pasiones Javascript está en primer lugar. Vue, React, Nuxt, Next, SASS/LESS/BEM, Styled Components. JS del lado del servidor con Node y a veces Python o PHP. Intentando con ahínco asumir los conocimientos necesarios de Frontend devops como Docker, CI/CD con Gitlab/GitHub, Jenkins y Rancher. Intentando controlar Webpack desde 2017. Admirando las plataformas Vercel y Netlify. * Linkedin - https://www.linkedin.com/in/beltranrengifo/ * Twitter - https://twitter.com/BeltranRengifo ▬▬▬▬▬▬ Resumen ▬▬▬▬▬▬ En este caso veremos cómo el equipo de Liferay se planteó la necesidad de auditar el rendimiento del componente React TreeFilter y nos compartirán los resultados obtenidos. En la sesión se aprenderá a detectar, analizar y resolver problemas de rendimiento en un componente React JS, para ello se realizará: * Detectar mediante la realización de pruebas pesadas * Analizar concluyendo sobre las métricas * Resolver implementando las tareas más eficientes y asequibles En el camino mostraremos algunas implementaciones de JS dentro de los componentes de React, cómo probamos el rendimiento utilizando el componente OOTB Profiler de React, y las correcciones finales que implementamos en la rama master. Primero se presentará el componente, sus principales funciones y los inconvenientes que detectamos en el camino, para después mostrar el test de rendimiento, los resultados y la implementación de las mejoras. La agenda de la sesión de este miércoles será la siguiente: 18:30 - Bienvenida y Anuncios 18:40 - Meetup Enero 2022 - Mejora del rendimiento del componente TreeFilter en el panel de contenidos - Beltrán Rengifo. 19:25 - Q & A 19:30 - Networking (Mozilla Hubs) ▬▬▬▬▬▬ Organizadores de la sesión ▬▬▬▬▬▬ - - - ▬▬▬▬▬▬ LUGSpain ▬▬▬▬▬▬ Twitter - https://twitter.com/LUGSpain Slack - https://liferay.dev/chat Meetup - https://www.meetup.com/es-ES/Liferay-Spain-User-Group/
Quieres montar una startup para darle una vuelta a cómo gestionamos las dailies a día de hoy. Tienes la idea de montar una app. Objetivo: que las personas del equipo puedan comunicarse de forma asíncrona y disfrutar más del rato que coincidamos conectados. Conclusión: ¿Por dónde empiezas? ¿JavaScript vanilla? ¿React? ¿React Native? ¿React Native Web? ¿Progressive Web App? ¿Nativo en iOS y Android? ¿Core compartido en Rust? 🤯 Hoy hablamos con Jorge y Sergi, 2 de los fundadores de Cassette que pasaron justamente por esta experiencia y nos contarán qué decisiones tecnológicas han tomado, cómo quieren replantear las dailies, y enseñarnos un poco de detalles de implementación 😬 📼 Cassette ├ 🔗 Web: https://cassetteapp.com ├ 🐦 Twitter: https://twitter.com/cassette_app ├ 👤 Jorge: https://twitter.com/jorgeavila_ss └ 👤 Sergi: https://twitter.com/SergiGP {▶️} CodelyTV ├ 🎥 Suscríbete: https://youtube.com/c/CodelyTV?sub_confirmation=1 ├ 🐦 Twitter CodelyTV: https://twitter.com/CodelyTV ├ 💂🏼 Twitter Rafa: https://twitter.com/rafaoe ├ 🧔🏻 Twitter Javi: https://twitter.com/JavierCane ├ 📸 Instagram: https://instagram.com/CodelyTV ├ ℹ️ LinkedIn: https://linkedin.com/company/codelytv ├ 🟦 Facebook: https://facebook.com/CodelyTV └ 📕 Catálogo cursos: https://bit.ly/cursos-codely
Actualmente existen muchas alternativas para la gestión de estado en React. Hoy hablamos de Recoil que se nos presenta como una alternativa ligera para gestionar el estado entre componentes basándose en Atoms. Si quieres saber más sobre cómo gestionar el estado con React no te pierdas nuestro curso en Codely: https://pro.codely.tv/library/gestion-estado-en-react-171307/ {▶️} CodelyTV ├ 🎥 Suscríbete: https://youtube.com/c/CodelyTV?sub_confirmation=1 ├ 🐦 Twitter CodelyTV: https://twitter.com/CodelyTV ├ 🍺 Twitter Isma: https://twitter.com/ismanapa ├ 📸 Instagram: https://instagram.com/CodelyTV ├ ℹ️ LinkedIn: https://linkedin.com/company/codelytv ├ 🟦 Facebook: https://facebook.com/CodelyTV └ 📕 Catálogo cursos: https://bit.ly/cursos-codely
▬▬▬▬▬▬ Título de la Sesión ▬▬▬▬▬▬ Forms ¿pero eso no se había deprecado? ▬▬▬▬▬▬ Ponente ▬▬▬▬▬▬ Martín Domínguez Martín trabaja como Sales Engineer en Liferay desde principios de 2020 y desde entonces ha participado en varios eventos como la DevCon, Vision, Symposiums y las dos ediciones de /dev/24 celebradas. Es un apasionado del Open Source y del trabajo en Comunidad y de hecho lleva más de 15 años dedicado profesionalmente a productos basados en Open Source. * Linkedin: https://www.linkedin.com/in/-martin-dominguez/ * Twitter: @mtindominguez * GitHub: https://github.com/martin-dominguez ▬▬▬▬▬▬ Resumen ▬▬▬▬▬▬ En la sesión comenzaremos con un repaso de forms y evolución por las versiones y continuaremos con el objetivo principal de esta sesión, dar a conocer cuáles son las claves cuando quieres aprovechar toda la potencia de los formularios y crear tus propios campos personalizados. No importa lo que quieras hacer, si puedes hacerlo con React puedes tenerlo en Forms. Aunque los equipos de documentación y Forms están trabajando duro para proporcionar documentación y ejemplos, mientras tanto, intentaremos arrojar algo de luz sobre las distintas piezas que puedes utilizar y como hacerlo La agenda de la sesión de este miércoles será la siguiente: 18:30 - Bienvenida y Anuncios 18:40 - Forms ¿pero eso no se había deprecado? - Martín Domínguez con la colaboración de Álvaro Saugar. 19:25 - Q & A 19:30 - Networking (Mozilla Hubs) ▬▬▬▬▬▬ Organizadores de la sesión ▬▬▬▬▬▬ - Carlos Durán - Álvaro Saugar ▬▬▬▬▬▬ LUGSpain ▬▬▬▬▬▬ Twitter - https://twitter.com/LUGSpain Slack - https://liferay.dev/chat
En este vídeo analizamos cómo han evolucionado las herramientas de gestión de estado en React a lo largo de los años pasando desde el original react setState a nuevas alternativas como Zustand o Recoil Si quieres conocer más de cómo funciona la gestión de estado en React y que alternativas tenemos para configurar esta gestión de estado apúntate al curso que estamos publicando ahora mismo al respecto: https://bit.ly/gestion-estado-react {▶️} CodelyTV ├ 🎥 Suscríbete: https://youtube.com/c/CodelyTV?sub_confirmation=1 ├ 🐦 Twitter CodelyTV: https://twitter.com/CodelyTV ├ 🧔🏻 Twitter Javi: https://twitter.com/JavierCane ├ 🍺 Twitter Isma: https://twitter.com/ismanapa ├ 📸 Instagram: https://instagram.com/CodelyTV ├ ℹ️ LinkedIn: https://linkedin.com/company/codelytv ├ 🟦 Facebook: https://facebook.com/CodelyTV └ 📕 Catálogo cursos: https://bit.ly/cursos-codely
¿Alguna vez te has preguntado cómo React se encarga de persistir los cambios de estado? Detrás de cada cambio de estado hay un proceso de reconciliación a través del cual React se encarga de identificar cuales son los elementos de la interfaz que han sido modificados de manera que solo es necesario volver a pintar estos elementos. Es en este proceso dónde esta el virtual DOM del que hablamos en este vídeo. Si quieres conocer más de cómo funciona la gestión de estado en React y que alternativas tenemos para configurar esta gestión de estado apúntate al curso que estamos publicando ahora mismo al respecto: https://bit.ly/gestion-estado-react {▶️} CodelyTV ├ 🎥 Suscríbete: https://youtube.com/c/CodelyTV?sub_confirmation=1 ├ 🐦 Twitter CodelyTV: https://twitter.com/CodelyTV ├ 🧔🏻 Twitter Javi: https://twitter.com/JavierCane ├ 🍺 Twitter Isma: https://twitter.com/ismanapa ├ 📸 Instagram: https://instagram.com/CodelyTV ├ ℹ️ LinkedIn: https://linkedin.com/company/codelytv ├ 🟦 Facebook: https://facebook.com/CodelyTV └ 📕 Catálogo cursos: https://bit.ly/cursos-codely
Menudo combo traemos... Next.JS, Chakra UI y José Manuel Lucas 🚀 Next.js, es un framework de JavaScript que nos permite crear fácilmente sitios web de React listos para salir a producción. Instalando una sola dependencia puedes tener configurado todas las herramientas que necesitas: #Babel, #Webpack, server render... incluso el #deploy resulta mucho más sencillo. Por su lado, Chakra UI, está considerada como una de las bibliotecas de componentes más popular ya que es sencilla, modular y muy accesible. Te proporciona los bloques de construcción que necesitas para construir tus aplicaciones React y consigues de manera más ágil y rápida una gran experiencia de usuario. En este #livecoding conoceremos las ventajas del uso de #NextJS como motor de nuestra aplicación #frontend, los modos de renderizado y las diferencias entre ellos así como la implementación de una de las soluciones de diseño más famosas: #ChakraUI. Conoce más a José Manuel: https://jmlweb.es/ Comenta en twitter mencionando a @geeks_academy con el hashtag #MeetupsGeeksHubs. Únete a nuestra Comunidad en Slack: https://join.slack.com/t/geekshubs/shared_invite/zt-xjn9x7ht-yxM3kfCqnsYCYfu_x4mdJA Boocamp Full Stack Developer Presencial en Valencia, Madrid y Barcelona 🚀 https://bootcamp.geekshubsacademy.com/full-stack-developer/ 🎥 Canal de Youtube: https://www.youtube.com/user/geekshubs 🐦 Twitter GeeksHubs: https://twitter.com/geekshubs 🐦 Twitter GeeksHubs Academy: https://twitter.com/geeks_academy 📸 Instagram: https://instagram.com/geekshubs ℹ️️️️️ LinkedIn GeeksHubs: https://www.linkedin.com/company/geeks-hubs ℹ️️️️️ LinkedIn GeeksHubs Academy: https://www.linkedin.com/school/geekshubsacademy/ ? Facebook GeeksHubs: https://facebook.com/geekshubs ? Facebook GeeksHubs Academy: https://www.facebook.com/geekshubsacademy 📕 Plataforma online +30 cursos gratuitos: https://geekshubsacademy.com/ 🎧 Podcast I am Geek: https://open.spotify.com/show/4G4PpNzPOeWh5DrrumDXCd
En un desarrollo multiplataforma web y móvil con React tenemos dos opciones: - Pastilla azul: desarrollamos una versión web con React y otra móvil con React Native, siendo cada una de ellas un proyecto independiente duplicando funcionalidades y solucionando los problemas dos veces. - Pastilla roja: afrontamos un único desarrollo multiplataforma en un único proyecto. Resolvemos los problemas funcionales una única vez a costa de tener que resolver problemas concretos de cada plataforma. Revisaremos las diferentes estrategias que existen, cuál hemos elegido y cómo la hemos llevado a cabo en un proyecto real. # Irati Casi Graduada en Ingeniería Informática por la Universidad Pública de Navarra. Máster en Ingeniería web por la Universidad Politécnica de Madrid. Experiencia desarrollando aplicaciones con tecnología React y React Native: Desarrollando el servicio de sharing de vehículos líder del sector. Desarrollando para Lookiero un proyecto móvil de estrategia de código compartido entre React y React Native. Enfocada en desarrollar software mantenible, cambiable y testable aplicando prácticas extreme programming. # Mikel Ros Desarrolla software para empresas nacionales e internacionales con el objetivo de que sea mantenible y fácil de cambiar a través de metodologías ágiles y extreme programming. Desarrollando el servicio de sharing de vehículos líder del sector. Liderando un proyecto móvil de estrategia de código compartido entre React y React Native. Formador en proyectos frontend web y móvil abstrayendo el uso concreto de la tecnología o el framework y centrándose en resolver los problemas del negocio. Enfocado en la integración y el despliegue continuo con un feedback loop corto y mediante testing y diseño simple. # Redes sociales Twitter: https://twitter.com/540deg?s=20 página web: https://540deg.com/
Tras 3 temporadas de #MeetupsGeeksHubs, streamings en directo cada jueves en nuestro canal de Youtube, damos paso a una nueva etapa… ¡Van a suceder cosas diferentes, vamos a hacer realidad todas vuestras propuestas y van a venir invitadxs que os van a sorprender mucho! 😎 Empezamos con #Vue, uno de los frameworks #Frontend más populares, junto con #React y #Angular. Uno de los motivos es la positiva experiencia de desarrollo, que abarca prácticamente todas las expectativas de los profesionales y ofrece bastante libertad a la hora de organizar el código de los proyectos, manteniéndolos simples. Además, Vue cuenta con una comunidad de desarrolladores entusiastas y una amplia documentación. 📗 En esta sesión, Gonzalo va a empezar por el principio: ⚫ Analizando y enseñándote su forma de trabajo, ¡verás que no es tan distinto a sus competidores! ⚫ Mostraremos similitudes con sus hermanos mayores y analizaremos algunas de las novedades de composition API, en nuevo enfoque en VUE3. ⚫ Como guinda del pastel, haremos una propuesta de estrategia de testing aplicada al ecosistema frontend. Con esto, podrás darte cuenta de si el gusanillo de VUE te ha picado poco, mucho o demasiado… 😏En cualquier caso, podrás seguir aprendiendo si ganas la plaza de nuestro nuevo Bootcamp Online sobre Vue 👉 https://bootcamp.geekshubsacademy.com/online/frontend-vue/?utm_source=youtube&utm_medium=socialmedia&utm_campaign=inicio-4temporada-meetups ¿Te apuntas? 🥳 Comenta en twitter mencionando a @geeks_academy con el hashtag #MeetupsGeeksHubs. 🎥 Suscríbete: https://www.youtube.com/user/geekshubs 🐦 Twitter GeeksHubs: https://twitter.com/geekshubs 🐦 Twitter GeeksHubs Academy: https://twitter.com/geeks_academy 📸 Instagram: https://instagram.com/geekshubs ℹ️️️ LinkedIn GeeksHubs: https://www.linkedin.com/company/geeks-hubs ℹ️️️ LinkedIn GeeksHubs Academy: https://www.linkedin.com/school/geekshubsacademy/ ? Facebook: https://facebook.com/geekshubs 📕 Plataforma online +30 cursos gratuitos: https://geekshubsacademy.com/