Versión en EspañolES

Despliega y Prueba Aplicaciones React de Pila Completa en Cloudflare

Please sign in to watch this workshop.

Bookmark

Github

Esta masterclass de 3 horas proporcionará una introducción a la Plataforma de Desarrolladores de Cloudflare para desarrolladores de aplicaciones. Se centrará en desarrollar una aplicación React de pila completa respaldada por pruebas que puedan garantizar la corrección de sus interacciones con los recursos y APIs proporcionados por la Plataforma de Desarrolladores.

La masterclass asume un conocimiento básico de TypeScript y React, ¡no mucho más allá de lo necesario para construir una aplicación hola mundo en React usando TypeScript! Tampoco se requiere conocimiento de la Plataforma de Desarrolladores, ya que todo lo relacionado con Cloudflare se introducirá como parte de la masterclass.

Así que si estás interesado en el desarrollo de aplicaciones en la plataforma de Cloudflare (¡rápida y económica!), entonces esta masterclass es para ti. Al final de la misma, sabrás cómo construir una aplicación web de pila completa, completamente probada (usando React o cualquier marco de tu elección) con una estructura de pruebas integral que te dará plena confianza y tranquilidad.

Agenda

La masterclass incluirá codificación en vivo, preguntas y respuestas, y secciones de codificación interactivas. El código inicial, junto con las instrucciones, también estará disponible para que los participantes lo revisen y profundicen después de

la masterclass.

Como parte de la configuración inicial, veremos cómo usar la herramienta C3 para desplegar fácilmente aplicaciones en Cloudflare en cuestión de minutos.

Después, veremos cómo escribir código que interactúe con los recursos y APIs específicos de la Plataforma de Desarrolladores, específicamente, usaremos KVs, R2 buckets y Workers AI. También nos aseguraremos de probar todo el código para asegurarnos de que interactúa correctamente con las APIs mencionadas a través de la integración oficial de Workers Vitest.

Luego integraremos el código de Workers con nuestra aplicación React para construir una aplicación de pila completa lista para ser desplegada en la red de borde de Cloudflare. Usaremos playwright para implementar un conjunto de pruebas de extremo a extremo (e2e) para asegurarnos de que la aplicación se integra perfectamente con la plataforma de Cloudflare.

Conclusiones

- Cómo desarrollar en el runtime de Cloudflare Workers e interactuar con varios recursos de Cloudflare

- Cómo desarrollar, probar de manera integral y desplegar una aplicación de pila completa en la Plataforma de Cloudflare

This workshop has been presented at React Summit US 2024, check out the latest edition of this React Conference.

testing

Dario Piotrowicz

Christian Sparks

105 min

13 Nov, 2024

Comments

Tannu Kumari
great explanation
14:10 Nov 23, 2024

Available in other languages:

Watch more workshops on topic

Diseñando Pruebas Efectivas con la Biblioteca de Pruebas de React

React Summit 2023

151 min

Diseñando Pruebas Efectivas con la Biblioteca de Pruebas de React

Top Content

Featured Workshop

Josh Justice

La Biblioteca de Pruebas de React es un gran marco para las pruebas de componentes de React porque responde muchas preguntas por ti, por lo que no necesitas preocuparte por esas preguntas. Pero eso no significa que las pruebas sean fáciles. Todavía hay muchas preguntas que tienes que resolver por ti mismo: ¿Cuántas pruebas de componentes debes escribir vs pruebas de extremo a extremo o pruebas de unidad de nivel inferior? ¿Cómo puedes probar una cierta línea de código que es difícil de probar? ¿Y qué se supone que debes hacer con esa persistente advertencia de act()?
En esta masterclass de tres horas, presentaremos la Biblioteca de Pruebas de React junto con un modelo mental de cómo pensar en el diseño de tus pruebas de componentes. Este modelo mental te ayudará a ver cómo probar cada bit de lógica, si debes o no simular dependencias, y ayudará a mejorar el diseño de tus componentes. Te irás con las herramientas, técnicas y principios que necesitas para implementar pruebas de componentes de bajo costo y alto valor.
Tabla de contenidos- Los diferentes tipos de pruebas de aplicaciones de React, y dónde encajan las pruebas de componentes- Un modelo mental para pensar en las entradas y salidas de los componentes que pruebas- Opciones para seleccionar elementos DOM para verificar e interactuar con ellos- El valor de los mocks y por qué no deben evitarse- Los desafíos con la asincronía en las pruebas de RTL y cómo manejarlos
Requisitos previos- Familiaridad con la construcción de aplicaciones con React- Experiencia básica escribiendo pruebas automatizadas con Jest u otro marco de pruebas unitarias- No necesitas ninguna experiencia con la Biblioteca de Pruebas de React- Configuración de la máquina: Node LTS, Yarn

react react testing library test driven development react react testing deep dive testing best practices

Detox 101: Cómo escribir pruebas de extremo a extremo estables para su aplicación React Native

React Summit 2022

117 min

Detox 101: Cómo escribir pruebas de extremo a extremo estables para su aplicación React Native

Top Content

WorkshopFree

Yevheniia Hlovatska

A diferencia de las pruebas unitarias, las pruebas de extremo a extremo buscan interactuar con su aplicación tal como lo haría un usuario real. Y como todos sabemos, puede ser bastante desafiante. Especialmente cuando hablamos de aplicaciones móviles.
Las pruebas dependen de muchas condiciones y se consideran lentas e inestables. Por otro lado, las pruebas de extremo a extremo pueden dar la mayor confianza de que su aplicación está funcionando. Y si se hace correctamente, puede convertirse en una herramienta increíble para aumentar la velocidad del desarrollador.
Detox es un marco de pruebas de extremo a extremo en caja gris para aplicaciones móviles. Desarrollado por Wix para resolver el problema de la lentitud e inestabilidad y utilizado por React Native en sí como su herramienta de pruebas E2E.
Únete a mí en esta masterclass para aprender cómo hacer que tus pruebas de extremo a extremo móviles con Detox sean excelentes.
Prerrequisitos- iOS/Android: MacOS Catalina o más reciente- Solo Android: Linux- Instalar antes de la masterclass

e2e testing react native detox react native test automation react native react native testing react native accessibility testing beginner friendly

Masterclass de Pruebas de API con Postman

TestJS Summit 2023

48 min

Masterclass de Pruebas de API con Postman

Top Content

WorkshopFree

Pooja Mistry

En el panorama siempre en evolución del desarrollo de software, garantizar la fiabilidad y funcionalidad de las API se ha vuelto primordial. "Pruebas de API con Postman" es una masterclass completa diseñada para equipar a los participantes con los conocimientos y habilidades necesarios para sobresalir en las pruebas de API utilizando Postman, una herramienta poderosa ampliamente adoptada por profesionales en el campo. Esta masterclass profundiza en los fundamentos de las pruebas de API, avanza a técnicas de prueba avanzadas y explora la automatización, las pruebas de rendimiento y el soporte multiprotocolo, proporcionando a los asistentes una comprensión holística de las pruebas de API con Postman.
Únete a nosotros para esta masterclass para desbloquear todo el potencial de Postman para las pruebas de API, agilizar tus procesos de prueba y mejorar la calidad y fiabilidad de tu software. Ya seas un principiante o un probador experimentado, esta masterclass te equipará con las habilidades necesarias para sobresalir en las pruebas de API con Postman.

security testing testing

Monitoreo 101 para Desarrolladores de React

React Summit US 2023

107 min

Monitoreo 101 para Desarrolladores de React

Top Content

WorkshopFree

2 authors

Si encontrar errores en tu proyecto frontend es como buscar una aguja en un pajar de código, entonces el monitoreo de errores de Sentry puede ser tu detector de metales. Aprende los conceptos básicos del monitoreo de errores con Sentry. Ya sea que estés ejecutando un proyecto de React, Angular, Vue, o simplemente JavaScript “vainilla”, mira cómo Sentry puede ayudarte a encontrar el quién, qué, cuándo y dónde detrás de los errores en tu proyecto frontend.
Nivel de la masterclass: Intermedio

vue react angular testing

Testing Web Applications Using Cypress

TestJS Summit - January, 2021

173 min

Testing Web Applications Using Cypress

Top Content

WorkshopFree

Gleb Bahmutov

Esta masterclass te enseñará los conceptos básicos para escribir pruebas end-to-end útiles utilizando Cypress Test Runner.
Cubriremos la escritura de pruebas, cubriendo cada característica de la aplicación, estructurando pruebas, interceptando solicitudes de red y configurando los datos del backend.
Cualquiera que conozca el lenguaje de programación JavaScript y tenga NPM instalado podrá seguir adelante.

e2e testing javascript testing cypress

Mejores Prácticas para Escribir y Depurar Pruebas de Cypress

TestJS Summit 2023

148 min

Mejores Prácticas para Escribir y Depurar Pruebas de Cypress

Workshop

Filip Hric

Probablemente conozcas la historia. Has creado un par de pruebas y, como estás utilizando Cypress, lo has hecho bastante rápido. Parece que nada te detiene, pero luego - prueba fallida. No fue la aplicación, no fue un error, la prueba fue... ¿inestable? Bueno sí. El diseño de la prueba es importante sin importar la herramienta que utilices, incluyendo Cypress. La buena noticia es que Cypress tiene un par de herramientas bajo su cinturón que pueden ayudarte. Únete a mí en mi masterclass, donde te guiaré lejos del valle de los anti-patrones hacia los campos de pruebas estables y siempre verdes. Hablaremos sobre los errores comunes al escribir tu prueba, así como depurar y revelar problemas subyacentes. Todo con el objetivo de evitar la inestabilidad y diseñar pruebas estables.

testing cypress

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

Solicitudes de Red con Cypress

TestJS Summit 2021

33 min

Solicitudes de Red con Cypress

Top Content

Cecelia Martinez

Ionic

Cecilia Martinez, a technical account manager at Cypress, discusses network requests in Cypress and demonstrates commands like cydot request and SCI.INTERCEPT. She also explains dynamic matching and aliasing, network stubbing, and the pros and cons of using real server responses versus stubbing. The talk covers logging request responses, testing front-end and backend API, handling list length and DOM traversal, lazy loading, and provides resources for beginners to learn Cypress.

testing cypress

Pruebas de ciclo completo con Cypress

TestJS Summit 2022

27 min

Pruebas de ciclo completo con Cypress

Top Content

Filip Hric

Replay.io

Cypress is a powerful tool for end-to-end testing and API testing. It provides instant feedback on test errors and allows tests to be run inside the browser. Cypress enables testing at both the application and network layers, making it easier to reach different edge cases. With features like AppActions and component testing, Cypress allows for comprehensive testing of individual components and the entire application. Join the workshops to learn more about full circle testing with Cypress.

e2e testing testing cypress

Desarrollo Efectivo de Pruebas

TestJS Summit 2021

31 min

Desarrollo Efectivo de Pruebas

Top Content

Shai Reznik

HiRez.io

This Talk introduces Test Effective Development, a new approach to testing that aims to make companies more cost-effective. The speaker shares their personal journey of improving code quality and reducing bugs through smarter testing strategies. They discuss the importance of finding a balance between testing confidence and efficiency and introduce the concepts of isolated and integrated testing. The speaker also suggests different testing strategies based on the size of the application and emphasizes the need to choose cost-effective testing approaches based on the specific project requirements.

unit testing testing

Playwright Test Runner

TestJS Summit 2021

25 min

Playwright Test Runner

Top Content

Andrey Lushnikov

Microsoft

The Playwright Test Runner is a cross-browser web testing framework that allows you to write tests using just a few lines of code. It supports features like parallel test execution, device emulation, and different reporters for customized output. Code-Gen is a new feature that generates code to interact with web pages. Playwright Tracing provides a powerful tool for debugging and analyzing test actions, with the ability to explore trace files using TraceViewer. Overall, Playwright Test offers installation, test authoring, debugging, and post-mortem debugging capabilities.

testing

Todos pueden escribir pruebas fácilmente

TestJS Summit 2023

21 min

Todos pueden escribir pruebas fácilmente

Debbie O'Brien

Senior Program Manager @ Microsoft, working with Playwright.

Playwright is a reliable end-to-end testing tool for modern web apps that provides one API, full isolation, fast execution, and supports multiple languages. It offers features like auto-weighting, retrying assertions, seamless testing of iframes and shadow DOM, test isolation, parallelism, and scalability. Playwright provides tools like VS Code extension, UiMode, and Trace Viewer for writing, debugging, and running tests. Effective tests prioritize user-facing attributes, use playwright locators and assertions, and avoid testing third-party dependencies. Playwright simplifies testing by generating tests, providing code generation and UI mode, and allows for easy running and debugging of tests. It helps in fixing failed tests and analyzing DOM changes, fixing locator mismatches, and scaling tests. Playwright is open source, free, and continuously growing.

e2e testing testing