Controlando aplicaciones con tu mente y AI

Rate this content
Bookmark

¿Cuál es el futuro de las interacciones de usuario? ¿Seguiremos utilizando la web y el móvil o nos cambiaremos completamente a la realidad virtual y aumentada? ¿Cuál es nuestra experiencia de usuario actual en la web y el móvil y cómo cambiará cuando el mundo digital se conecte con nuevas dimensiones? ¿Seguiremos utilizando el teclado y el ratón o los gestos o utilizaremos algo diferente? En esta charla, echaremos un vistazo al futuro donde controlaremos aplicaciones con nuestros pensamientos. Literalmente. No es un experimento mental, sino un viaje a través de nuestras ondas cerebrales con un casco EEG de consumo. Exploraremos cómo podemos utilizarlos y la inteligencia artificial para crear experiencias futuristas, que sentarán las bases de nuestras interacciones futuras con el mundo digital.

25 min
02 Aug, 2021

Video Summary and Transcription

Esta charla explora el control de aplicaciones con la mente y el futuro de la interfaz de usuario y la experiencia de usuario. Se discute la integración de la realidad virtual y aumentada en la interfaz de usuario y la experiencia de usuario, la comprensión de las neuronas y los cascos EEG, la conexión a Muse a través de Bluetooth, la medición de las ondas cerebrales y la detección de parpadeo, la alimentación de datos al aprendizaje automático y el control mental con la realidad aumentada. El ponente enfatiza la importancia de aprender React Native, realidad aumentada, React, Bluetooth y drones para aquellos interesados en explorar estos temas.

Available in English

1. Introducción a Controlar Aplicaciones con tu Mente

Short description:

Hola a todos. Hoy quiero hablar sobre controlar aplicaciones con tu mente y el futuro de la UI y UX. Estamos en una fase de transición, explorando nuevos horizontes y dimensiones. Tenemos la capacidad de adaptarnos y transformar las cosas en algo completamente diferente. Los fundamentos de la UI y UX se basan en un medio 2D, aunque tenemos elementos falsos en 3D.

Hola a todos. Estoy muy emocionado de estar aquí en la edición remota de React Summit, transmitiendo desde el espacio exterior. Y hoy quiero hablar sobre controlar aplicaciones con tu mente. Mi nombre es Vladimir Novik, soy arquitecto de software y consultor en Vladimir Novik Labs. Soy Google Developer Expert, autor, ingeniero y a diario trabajo en los campos de web, móvil, VR, AR, IoT y AI.

También soy CTO y co-fundador de EventLoop, y estamos creando una experiencia de conferencia en línea robusta, eficiente y con muchas funciones. Básicamente, en lugar de tener Zoom para tu conferencia virtual, te ofrecemos un conjunto de herramientas de conferencia y diferentes complementos y widgets, etc., que te ayudan a organizar y asistir a la conferencia. Así que si eres organizador, orador o asistente y te pones en contacto con nosotros y te registras en nuestro producto Alpha, será un producto de código abierto. Así que si quieres colaborar, eres bienvenido. Puedes encontrarnos en eventloop.ai o en Twitter en eventloopHQ.

Hoy quiero hablar sobre el futuro. Y creo que estamos en una especie de fase de transición tecnológica. Cuando estamos explorando nuevos horizontes, exploramos nuevos medios, tenemos VR, AR, realidad mixta, web, móvil. Todo está cambiando constantemente. Y por eso somos los que rompemos las reglas para crear nuevas. Pensemos en qué medio usaremos en el futuro. ¿Qué dimensiones usaremos? ¿Quizás VR? ¿Quizás AR? ¿Quizás algo diferente? Solo estoy pensando en voz alta, pero la computación cuántica está ganando impulso, VR está ganando impulso, AR está ganando impulso. Todo está cambiando. ¿Qué dimensiones usaremos? ¿Habrá web como la conocemos hoy o móvil o cambiaremos completamente a un medio diferente? ¿Cómo debemos prepararnos para esa transición? ¿Cómo debemos adaptarnos? ¿Debemos adaptarnos o debemos realmente romper los fundamentos que tenemos? ¿Quizás inventar nuevas técnicas para manipular las cosas, interactuar de manera diferente? ¿Quizás nuevos patrones de UX, quizás nuevas mejores prácticas?

Así que tenemos esta capacidad ahora mismo de cambiar las cosas, de adaptarnos y transformarlas en algo completamente diferente. Y hablemos de cuáles son los fundamentos mismos de la UI y cuáles son los fundamentos mismos de la UX. Y creo que es un medio 2D. Y si piensas en eso, hemos recorrido un largo camino desde los dibujos en las cuevas hasta las aplicaciones móviles. Pero si piensas en toda la teoría del color y las líneas y la historia del arte y cómo todo creó los fundamentos del diseño y todo en nuestras pantallas es básicamente un medio 2D. Porque somos falsos 3D. Tercera dimensión. No es realmente como la tercera dimensión. Tenemos modelos 3D en el navegador o en auriculares o donde sea, pero todas las formas y la profundidad se basan en sombreadores, que básicamente es una función de cómo se refleja la luz. Así que es algo falso, ¿verdad? Y tenemos cosas en nuestros teléfonos, tenemos pantallas. Todo es 2D.

2. El Futuro de la UI y UX en VR y AR

Short description:

XR está agregando una nueva dimensión a la UI y UX en VR y AR. Necesitamos crear interacciones basadas en la realidad en estos medios. Comprender las diferentes dimensiones y limitaciones es crucial. La UI adaptativa y la lectura de la mente también son tendencias emergentes.

Y XR está agregando una nueva dimensión a eso. Entonces, cómo lo hemos adoptado. Tomamos diferentes forms. Digamos que tienes un formulario de registro. Entonces tenemos este formulario flotando en el aire en VR. ¿Realista? No realmente. Algo que hemos adoptado del medio 2D, ¿verdad? O en AR, tenemos flechas que apuntan en diferentes direcciones que rompen por completo la inmersión. Pero lo tenemos porque lo hemos adoptado. Y no hemos inventado algo nuevo.

Así que creo que es más crucial crear interacciones basadas en la realidad en VR y AR. Y si piensas en eso, si necesitas iniciar sesión dentro de VR, actualmente tienes un formulario de inicio de sesión, tienes este teclado flotante, y luego ingresas, escribes tu nombre de usuario y contraseña y entras. Pero ¿es algo que verías en la realidad? No realmente, ¿verdad? Entonces es más realista tener algún tipo de contraseña o llave o lo que sea que simplemente colocas en el lugar o giras la llave dentro de la puerta, y te dejará pasar. Es una especie de interacciones basadas en la realidad, ¿verdad? Entonces necesitamos comprender nuestra realidad para crear estas interacciones. Y el medio es completamente diferente.

Ahora, en VR hay otra dimensión, algo que sucede detrás del espectador. Entonces, estoy mirando a la cámara, pero algo está sucediendo detrás. Entonces no puedo usar la teoría del color para hacer esta increíble animación de botón de llamada a la acción. Entonces necesito usar cosas diferentes como hápticos, sonidos, tal vez ralentizar el tiempo, y así sucesivamente. También hay una UI adaptativa. La UI adaptativa es algo que se usa en la web. Y la idea es que la UI aprende de lo que estás haciendo con ella. Entonces, como, los forms están aprendiendo y adaptándose. Así que puedes buscar eso. Es una especie de nueva tendencia. Y otra cosa que propongo es la lectura de la mente real. Y, sí, obviamente no puedo leer tus pensamientos, ¿verdad? Pero hasta cierto punto. Y quiero preguntarte, ¿qué es? Y obviamente, como estamos en línea. Puedes responder en el chat. Haré una pausa. Entonces, es el universo conocido.

3. Comprendiendo las Neuronas y los Auriculares EEG

Short description:

Todos estos puntos son cúmulos de galaxias, pero en realidad representan neuronas en nuestro cerebro. Las neuronas trabajan en pares, con las neuronas excitatorias liberando glutamato y creando un mecanismo de dipolo. Este cambio potencial puede ser medido por electrodos en nuestro cráneo. Para analizar esto más a fondo, utilizamos auriculares EEG, como el Muse, que ayuda con la meditación.

Y todos estos, como, puntos son cúmulos de galaxias. Y se ve increíble. Pero, ¿qué es esto? Parece bastante similar, ¿verdad? Pero en realidad son neuronas en nuestro cerebro. Entonces, nosotros somos el universo. Y, pregunte en consecuencia.

Entonces, ¿cómo funcionan las neuronas en nuestro cerebro... cómo funcionan? Entonces, las neuronas vienen en pares. Y hay una neurona excitatoria y libera glutamato y crea un mecanismo de dipolo. Básicamente, tiene un polo positivo y uno negativo. Y actúa como una especie de batería. Entonces, tienes un cambio potencial entre diferentes neuronas.

Esto crea un cambio potencial que puede ser medido por electrodos en nuestro cráneo. Y se ve así. Si mides tu cerebro. Entonces, este es el estado de vigilia. Este es el estado de sueño. Y ves que es un poco diferente, ¿verdad? Pero es algo aleatorio, ¿verdad? Entonces, necesitamos analizar eso y entender qué significa todo esto, ¿verdad?

Para hacerlo, utilizaremos auriculares EEG. Y hay muchas versiones de consumo y versiones de investigación de auriculares EEG. Y la idea es colocar electrodos en tu cráneo, y basándonos en eso, medir el cambio potencial debajo de nuestro cráneo. Entonces, los EEG de investigación se ven así. Y son bastante costosos. Pero también hay versiones de consumo. Y en realidad tengo uno aquí. Se llama Muse. Es un buen producto que te ayuda con la meditación. Entonces, si estás meditando, te ayuda a concentrarte y demás. Y, sí, leeré mis ondas cerebrales, y verás cómo se ve. Así que es bastante económico. Solo tiene como 5 electrodos y eso es todo. Pero es bueno para nuestro ejemplo.

4. Conexión a Muse a través de Bluetooth

Short description:

Ahora, no necesito abrir mi cráneo y enchufarlo. Puedo conectarlo usando Bluetooth. Estamos hablando de experimentos, ¿verdad? Es como un experimento mental, literalmente. Pero también como experimentos donde la tecnología nos llevará. Puedo medir en cierta medida lo que está sucediendo en mi cerebro. He creado aquí una pequeña aplicación. Y antes de conectar a Muse, sí, antes de conectar a Muse, en TeamViewer, lo que quiero hacer es ver todas las lecturas de este auricular. Utilizo la biblioteca Muse.js. Y esta biblioteca expone tus lecturas como RxStream a las que puedo suscribirme.

Entonces, ¿cómo conectamos esto a nuestro cerebro? Ahora, no necesito abrir mi cráneo y enchufarlo. Puedo conectarlo usando Bluetooth. Y específicamente usaremos Bluetooth Web. Puedo usar Bluetooth accediendo al objeto Navigator, Bluetooth. Y llamo a requestDevice. Filtraré el servicio de Muse. Y simplemente me conectaré y obtendré algunos atributos del Bluetooth.

Ahora, el soporte no es del todo completo, ¿verdad? Lo vemos en Chrome y por alguna razón en Opera. Pero el resto es más o menos... no, ¿verdad? No es compatible. Pero estamos hablando de experimentos, ¿verdad? Es como un experimento mental, literalmente. Pero también como experimentos donde la tecnología nos llevará. Y veamos la demostración. Así que tengo este espacio de juego aquí. Y puedo emparejarlo con mi auricular. Y verás las ondas cerebrales que pasan. Y estas son mis ondas cerebrales reales. Y como puedes ver, cuando hablo, las ondas cambian un poco. Cuando parpadeo, ves estos pequeños picos, ¿verdad?, de picos de voltaje. Si hago algo como esto, ves los picos más altos. Así que puedo medir en cierta medida lo que está sucediendo en mi cerebro, ¿verdad? Así que esto es bastante bueno.

Pero, ¿qué hago con estos data? Así que he creado aquí una pequeña aplicación. Y antes de conectar a Muse, en realidad, sí, antes de conectar a Muse, en TeamViewer, lo que quiero hacer es ver todas las lecturas de este auricular. Me suscribiré a las lecturas y simplemente las registraré en la consola. Ahora, utilizo la biblioteca Muse.js. Y esta biblioteca expone tus lecturas como RxStream a las que puedo suscribirme. Y simplemente registro en la consola lo que Muse.js me muestra. Así que vamos a conectar. Y veamos qué tenemos aquí.

5. Medición de Ondas Cerebrales y Detección de Parpadeos

Short description:

Para medir las cosas de manera más precisa, utilizamos un filtro de paso de banda para eliminar frecuencias y enfocarnos en picos. Estos picos se dividen en épocas para analizar la referencia temporal. Al aplicar la Transformada Rápida de Fourier, podemos convertir los datos al dominio de frecuencia y reconocer diferentes ondas cerebrales. Cada onda representa un estado mental diferente, como el sueño, la percepción elevada o la relajación. Antes de explorar el aprendizaje automático, demostraré cómo suscribirse a las lecturas de ondas alfa y diferenciar los parpadeos utilizando técnicas de filtrado.

Y como puedes ver, similar al gráfico, no tenemos realmente como los datos son bastante extraños, así que no podemos hacer mucho con eso. Entonces, la pregunta es cómo medimos las cosas de manera más precisa. Para medir de manera más precisa, utilizaremos un filtro de paso de banda. Así que eliminamos las frecuencias, como en el gráfico, eliminamos estas y obtenemos solo los picos.

Ahora, luego necesitamos dividir todo esto en épocas, que básicamente es un marco de tiempo porque queremos tener una referencia temporal, si en un período de tiempo específico hay un pico, probablemente eso sea un parpadeo, ¿verdad? Entonces dividimos esto en épocas y también necesitamos pasar esto por la Transformada Rápida de Fourier. Eso significa que tomamos los datos que obtenemos en microvoltios y queremos convertirlos al dominio de frecuencia, por lo que utilizamos la Transformada Rápida de Fourier y convertimos eso al dominio de frecuencia, por lo que vemos diferentes frecuencias a partir de los datos en bruto que obtenemos.

Ahora podemos reconocer diferentes ondas cerebrales en función de estas frecuencias y la diferenciación es gamma, beta, alfa, theta y delta, y cada una de ellas es diferente para nuestro estado mental. Por ejemplo, en delta, es el sueño, la pérdida de conciencia corporal, la reparación, y así sucesivamente. Gamma es la percepción elevada, el aprendizaje, la resolución de problemas, las tareas, el procesamiento de calidad. Como puedes ver, no son muy distintivas, es un rango amplio. Beta es generalmente estar despierto, y alfa es relajación. Puedo medir el estado alfa y ver si estoy relajado. Así que podemos reaccionar a los picos de las ondas cerebrales, y también podemos alimentar estos datos al aprendizaje automático.

Pero antes de hacer cosas increíbles con el aprendizaje automático, quiero mostrarte algo. Quiero suscribirme al enfoque. Y básicamente me dará las lecturas de las ondas alfa. Además, quiero suscribirme a los parpadeos. Para diferenciar el parpadeo, obtengo las lecturas. Las filtro. Obtengo la lectura solo para el electrodo sobre mi ojo izquierdo. Obtengo el máximo de eso, como el pico. Luego uso RXOperatorSwitchMap para diferenciar el pico. Realmente no me importa el resto de los datos, solo el pico. Si hay un pico, eso es algo que devolveré. Cómo se ve. También necesito eliminar este. Vamos a conectarlo de nuevo. Y lo que veremos. Si parpadeo, puedes ver aquí que estoy parpadeando.

6. Alimentando Datos al Aprendizaje Automático

Short description:

Queremos alimentar los datos de parpadeo al aprendizaje automático. Me conectaré a mi auricular usado, obtendré todos los datos, los pasaré por los filtros necesarios y los agregaré como una muestra al Clasificador KNN. Al clasificar los datos, puedo determinar en qué carta estoy pensando. Los principales temas de interés son VRXL e IoT AI.

Entonces, como puedes ver, a veces es peor y no es porque sea un umbral, y tal vez no lo puse realmente cerca de mi cráneo. Entonces, sí, esto es el parpadeo, ¿verdad? Ahora, queremos alimentar estos data al aprendizaje automático. Para hacerlo, lo que haré es ir a mi app.js y agregaré mi panel de predicción, o predecir algunas cosas. Y aquí tengo tres cartas, y estas tres cartas, una es web y móvil, otra es VRXR y otra es IoT AI. Entonces, lo que intentaré hacer es conectarme a mi auricular usado, obtener todos los data, pasarlos por todos los filtros que necesito, y luego agregar esto como una muestra al Clasificador KNN, que es un algoritmo de aprendizaje automático, y comenzaremos a clasificar en qué carta estoy pensando. Entonces, permíteme grabar estas ondas muy rápido. Entonces, haré clic en este botón mientras miro la web y el móvil. Ahora VRXL, y ahora IoT AI. Entonces, ahora, si hago clic en clasificar, podré cambiar solo mirando, las manos están aquí, así que puedo simplemente mirar diferentes cartas y cambiar entre ellas. Y, sí, como puedes ver, el tema principal en el que estoy interesado es VRXL y IoT AI.

7. Control Mental con AR y Recursos de Aprendizaje

Short description:

Entonces, esto es bastante genial. Tengo una tienda más grande aquí con la bandera de habilitar drones, y sí, tengo un dron aquí, este pequeño compañero. Me conectaré a mi auricular Muse, me conectaré a mi dron, grabaré las ondas cerebrales y comenzaré a clasificar. La idea principal aquí es que el futuro ya está aquí y ustedes son quienes lo construirán. Gracias. Vamos a traer a Vlad de vuelta al escenario para una pregunta rápida. Después de ver algo como esto, ¿por dónde empieza alguien si quiere comenzar a aprender estas cosas por sí mismo? Puedes ampliar tus horizontes aprendiendo React Native y AR, o React y Bluetooth y drones. Hay recursos como Egghead.io y masterclasses disponibles. No dudes en contactarme en Twitter para obtener orientación y materiales de aprendizaje. Gracias, Vlad.

Entonces, esto es bastante genial, pero si funciona, agregaré otro nivel de genialidad aquí. Así que... Tengo una tienda más grande aquí con la bandera de habilitar drones, y sí, tengo un dron aquí, este pequeño compañero. Así que, a veces funciona, así que veamos si funciona esta vez. Lo que haré primero es conectarme a mi auricular Muse, no debo parpadear. Luego me conectaré a mi dron. Ok, aquí tenemos el dron y espero que lo vean. Grabaré las ondas cerebrales y comenzaré a clasificar. Ahora, espero que esté en la vista de la cámara. Ok, ahora intentaré moverlo solo mirándolo y lo haré aterrizar. Y se cayó. No estoy seguro si estaba en la vista, así que intentaré ponerlo en la vista nuevamente. Ahora probablemente esté aquí y nuevamente, lo estoy moviendo solo con el poder de mi pensamiento. Eso fue bastante genial. La idea principal aquí es cuál es el propósito de todo esto, ¿verdad? ¿Por qué volamos drones con nuestra mente? ¿Por qué usamos estos dispositivos? No son tan confiables. Solo tenemos soporte de Bluetooth web en Chrome. La razón principal de esto es que nosotros somos quienes establecemos las reglas y rompemos las reglas, inventamos cosas nuevas, ¿verdad? Mi conclusión principal de esta charla es que el futuro ya está aquí y ustedes son quienes lo construirán. Gracias. Muy bien. Eso fue increíble. No pensé que veríamos a alguien volar un dron con su mente tan temprano en la mañana. Desafortunadamente, no tenemos mucho tiempo, pero vamos a traer a Vlad de vuelta al escenario para una pregunta rápida. Y luego pasaremos a nuestra próxima sesión. Entonces, Vlad, después de ver algo como esto, el control mental con AR, ¿por dónde empieza alguien si quiere comenzar a aprender estas cosas por sí mismo? Quiero decir, el punto principal de esta charla fue que, ¿verdad? Necesitas, como, puedes cambiar el mundo básicamente, ¿verdad? Y tú eres quien puede cambiar todo, ¿verdad? Y luego debes decidir qué quieres aprender, en términos de tecnología. ¿Quieres ser más experimentado solo en React o quieres ampliar tus horizontes, ¿verdad? Por ejemplo, si quieres tener React Native y AR, o tener React y Bluetooth y drones, puedes acceder a diferentes recursos. Hay Egghead.io, que es un sitio web increíble donde también estaré dando cursos. De hecho, pronto haré un masterclass sobre React Native y AR. De hecho, creé este sonido para React Summit, así que enviaré el enlace en el canal de la comunidad. Si quieres participar en este masterclass, puedes hacerlo. Además, también he dado muchas charlas. Tengo un canal de YouTube donde transmito sobre VR, pero también estaré grabando muchas cosas sobre este tema. Porque, quiero decir, me gusta enseñar estas cosas, ¿verdad? Por eso también comencé un canal de Twitch. Y sí, ese es uno de los lugares, pero obviamente hay muchos lugares donde aprender. Y si realmente quieres meterte en esto, te diría que me envíes un mensaje directo en Twitter, y te informaré. Dime qué quieres hacer en cuanto a tecnología, y probablemente podré dirigirte a materiales de aprendizaje y fuentes gratuitas en algún lugar, y así sucesivamente. Excelente. Bueno, Vlad, muchas gracias. Realmente lo apreciamos. Desearía que tuviéramos más tiempo para preguntas y respuestas. Pero para volver al rumbo, ahora pasaremos a una mesa redonda.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

React Advanced Conference 2021React Advanced Conference 2021
39 min
Don't Solve Problems, Eliminate Them
Top Content
Humans are natural problem solvers and we're good enough at it that we've survived over the centuries and become the dominant species of the planet. Because we're so good at it, we sometimes become problem seekers too–looking for problems we can solve. Those who most successfully accomplish their goals are the problem eliminators. Let's talk about the distinction between solving and eliminating problems with examples from inside and outside the coding world.
React Day Berlin 2022React Day Berlin 2022
22 min
Jotai Atoms Are Just Functions
Top Content
Jotai is a state management library. We have been developing it primarily for React, but it's conceptually not tied to React. It this talk, we will see how Jotai atoms work and learn about the mental model we should have. Atoms are framework-agnostic abstraction to represent states, and they are basically just functions. Understanding the atom abstraction will help designing and implementing states in your applications with Jotai
React Summit 2023React Summit 2023
24 min
Debugging JS
As developers, we spend much of our time debugging apps - often code we didn't even write. Sadly, few developers have ever been taught how to approach debugging - it's something most of us learn through painful experience.  The good news is you _can_ learn how to debug effectively, and there's several key techniques and tools you can use for debugging JS and React apps.
React Day Berlin 2022React Day Berlin 2022
29 min
Fighting Technical Debt With Continuous Refactoring
Top Content
Let’s face it: technical debt is inevitable and rewriting your code every 6 months is not an option. Refactoring is a complex topic that doesn't have a one-size-fits-all solution. Frontend applications are particularly sensitive because of frequent requirements and user flows changes. New abstractions, updated patterns and cleaning up those old functions - it all sounds great on paper, but it often fails in practice: todos accumulate, tickets end up rotting in the backlog and legacy code crops up in every corner of your codebase. So a process of continuous refactoring is the only weapon you have against tech debt. In the past three years, I’ve been exploring different strategies and processes for refactoring code. In this talk I will describe the key components of a framework for tackling refactoring and I will share some of the learnings accumulated along the way. Hopefully, this will help you in your quest of improving the code quality of your codebases.
React Summit Remote Edition 2020React Summit Remote Edition 2020
32 min
AHA Programming
Top Content
Are you the kind of programmer who prefers to never see the same code in two places, or do you make liberal use of copy/paste? Many developers swear the Don't Repeat Yourself (DRY) philosophy while others prefer to Write Everything Twice (WET). But which of these produces more maintainable codebases? I've seen both of these approaches lay waste to codebases and I have a new ideology I would like to propose to you: Avoid Hasty Abstractions (AHA). In this keynote, we'll talk about abstraction and how you can improve a codebase applying and creating abstractions more thoughtfully as well as how to get yourself out of a mess of over or under-abstraction.
React Summit US 2023React Summit US 2023
21 min
The Epic Stack
Modern web development is fantastic. There are so many great tools available! Modern web development is exhausting. There are so many great tools available! Each of these sentiments is true. What's great is that most of the time, it's hard to make a choice that is wrong. Seriously. The trade-offs of most of the frameworks and tools you could use to build your application fit within the constraints of the vast majority of apps. Despite this, engineers consistently struggle with analysis paralysis.Let's talk about this, and a solution I am working on for it.

Workshops on related topic

React Advanced Conference 2021React Advanced Conference 2021
174 min
React, TypeScript, and TDD
Top Content
Featured WorkshopFree
ReactJS is wildly popular and thus wildly supported. TypeScript is increasingly popular, and thus increasingly supported.

The two together? Not as much. Given that they both change quickly, it's hard to find accurate learning materials.

React+TypeScript, with JetBrains IDEs? That three-part combination is the topic of this series. We'll show a little about a lot. Meaning, the key steps to getting productive, in the IDE, for React projects using TypeScript. Along the way we'll show test-driven development and emphasize tips-and-tricks in the IDE.
React Advanced Conference 2021React Advanced Conference 2021
145 min
Web3 Workshop - Building Your First Dapp
Top Content
Featured WorkshopFree
In this workshop, you'll learn how to build your first full stack dapp on the Ethereum blockchain, reading and writing data to the network, and connecting a front end application to the contract you've deployed. By the end of the workshop, you'll understand how to set up a full stack development environment, run a local node, and interact with any smart contract using React, HardHat, and Ethers.js.
React Summit 2022React Summit 2022
136 min
Remix Fundamentals
Top Content
Featured WorkshopFree
Building modern web applications is riddled with complexity And that's only if you bother to deal with the problems
Tired of wiring up onSubmit to backend APIs and making sure your client-side cache stays up-to-date? Wouldn't it be cool to be able to use the global nature of CSS to your benefit, rather than find tools or conventions to avoid or work around it? And how would you like nested layouts with intelligent and performance optimized data management that just works™?
Remix solves some of these problems, and completely eliminates the rest. You don't even have to think about server cache management or global CSS namespace clashes. It's not that Remix has APIs to avoid these problems, they simply don't exist when you're using Remix. Oh, and you don't need that huge complex graphql client when you're using Remix. They've got you covered. Ready to build faster apps faster?
At the end of this workshop, you'll know how to:- Create Remix Routes- Style Remix applications- Load data in Remix loaders- Mutate data with forms and actions
Vue.js London Live 2021Vue.js London Live 2021
169 min
Vue3: Modern Frontend App Development
Top Content
Featured WorkshopFree
The Vue3 has been released in mid-2020. Besides many improvements and optimizations, the main feature of Vue3 brings is the Composition API – a new way to write and reuse reactive code. Let's learn more about how to use Composition API efficiently.

Besides core Vue3 features we'll explain examples of how to use popular libraries with Vue3.

Table of contents:
- Introduction to Vue3
- Composition API
- Core libraries
- Vue3 ecosystem

Prerequisites:
IDE of choice (Inellij or VSC) installed
Nodejs + NPM
DevOps.js Conf 2024DevOps.js Conf 2024
163 min
AI on Demand: Serverless AI
Featured WorkshopFree
In this workshop, we discuss the merits of serverless architecture and how it can be applied to the AI space. We'll explore options around building serverless RAG applications for a more lambda-esque approach to AI. Next, we'll get hands on and build a sample CRUD app that allows you to store information and query it using an LLM with Workers AI, Vectorize, D1, and Cloudflare Workers.
JSNation 2023JSNation 2023
174 min
Developing Dynamic Blogs with SvelteKit & Storyblok: A Hands-on Workshop
Featured WorkshopFree
This SvelteKit workshop explores the integration of 3rd party services, such as Storyblok, in a SvelteKit project. Participants will learn how to create a SvelteKit project, leverage Svelte components, and connect to external APIs. The workshop covers important concepts including SSR, CSR, static site generation, and deploying the application using adapters. By the end of the workshop, attendees will have a solid understanding of building SvelteKit applications with API integrations and be prepared for deployment.