Olvida el mal código, concéntrate en el sistema

Video thumbnail
Recording is available to Multipass and Full ticket holders only
Please login if you have one.
Bookmark
Rate this content

El prop drilling está bien. La duplicación es genial. Las funciones largas son amor.

Hablamos mucho sobre el mal código complicado porque es fácil ver el problema. Pero la investigación muestra que los ingenieros pueden trabajar bien con el mal código autónomo. Lo que realmente los confunde es algo completamente diferente: la complejidad arquitectónica.

La complejidad arquitectónica hace que tu código sea difícil de trabajar, causa 3 veces más errores, reduce a la mitad la productividad y puede incluso hacer que los desarrolladores abandonen por frustración. En esta charla exploramos lo que puedes hacer.

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

FAQ

La charla enfatiza que, más allá de concentrarse solo en el código bueno o malo, es crucial enfocarse en cómo se configura todo el sistema y la arquitectura para mejorar la eficiencia y la gestión del mismo.

JSX es una extensión de sintaxis para JavaScript usada en React para describir la interfaz de usuario. Inicialmente, fue recibido con escepticismo y críticas por mezclar HTML con JavaScript, lo que fue visto como una violación de la separación de preocupaciones.

Se utiliza el ejemplo de los sets de LEGO, donde la organización de las piezas por etapas del montaje del Saturno 5 ofrece una forma más eficiente y divertida de construir, comparada con la clasificación detallada de cada pieza pequeña.

La construcción modular, que implica prefabricar piezas completas de un edificio y ensamblarlas, ofrece beneficios como reducción de costos, mayor velocidad de construcción y simplificación del proceso constructivo.

La alta complejidad arquitectónica puede llevar a una caída del 50% en la productividad, un aumento de tres veces en la densidad de defectos y un aumento de la rotación de personal, según un estudio citado en la charla.

Se menciona una herramienta llamada 'madge' que puede visualizar importaciones y dependencias, ayudando a analizar la complejidad arquitectónica.

Se sugiere identificar módulos naturales y moverlos organizadamente, utilizando herramientas como TypeScript y VSCode para facilitar y corregir las importaciones automáticamente durante la reorganización.

Swizec Teller
Swizec Teller
27 min
13 Nov, 2023

Comments

Sign in or register to post your comment.
Video Summary and Transcription
Configurar el sistema y separar las preocupaciones son importantes en el desarrollo de software. La construcción modular y las unidades prefabricadas son una nueva tendencia que hace que la construcción sea más rápida y fácil. La complejidad arquitectónica puede llevar a una caída en la productividad y un aumento en los defectos. Medir la complejidad arquitectónica puede ayudar a identificar módulos naturales en el código. Las mejores prácticas para evitar la complejidad arquitectónica incluyen organizar el código por dominio empresarial y usar prop drilling. El diseño atómico y la organización de un monorepo son enfoques recomendados para gestionar la complejidad arquitectónica.
Video transcription and chapters available for users with access.

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

IA y Desarrollo Web: ¿Exageración o Realidad?
JSNation 2023JSNation 2023
24 min
IA y Desarrollo Web: ¿Exageración o Realidad?
Top Content
This talk explores the use of AI in web development, including tools like GitHub Copilot and Fig for CLI commands. AI can generate boilerplate code, provide context-aware solutions, and generate dummy data. It can also assist with CSS selectors and regexes, and be integrated into applications. AI is used to enhance the podcast experience by transcribing episodes and providing JSON data. The talk also discusses formatting AI output, crafting requests, and analyzing embeddings for similarity.
Confesiones de un Impostor
JSNation 2022JSNation 2022
46 min
Confesiones de un Impostor
Top Content
The Talk discusses imposter syndrome and reframes it as being a professional imposter. It emphasizes the importance of sharing and starting, embracing imposterism, and building inclusively for the web. The speaker shares personal experiences of being an imposter in various technical disciplines and highlights the significance of accessibility. The Talk concludes with the idea of building a collective RPG game to remove excuses for not making things accessible.
Mejorando la Felicidad del Desarrollador con IA
React Summit 2023React Summit 2023
29 min
Mejorando la Felicidad del Desarrollador con IA
GitHub Copilot is an auto-completion tool that provides suggestions based on context. Research has shown that developers using Copilot feel less frustrated, spend less time searching externally, and experience less mental effort on repetitive tasks. Copilot can generate code for various tasks, including adding modals, testing, and refactoring. It is a useful tool for improving productivity and saving time, especially for junior developers and those working in unfamiliar domains. Security concerns have been addressed with optional data sharing and different versions for individuals and businesses.
Maximize Productivity with AI Agents
Productivity Conf for Devs and Tech LeadersProductivity Conf for Devs and Tech Leaders
25 min
Maximize Productivity with AI Agents
I'm Tejas Kumar, a software developer with over 20 years of experience. AI agents are defined as entities that act on behalf of users or groups to produce specific effects. Agents consist of an orchestration layer, a language model, and tools represented as JSON functions. Langflow is an open-source tool that allows users to build their own AI agents by connecting language models and tools. Composio is a tool that enhances agent capabilities by offering integrations and apps, such as Google Calendar integration. MCP (Model Context Protocol) is a way to share context with models and extend their capabilities. It allows functions to be made available to models over standard input/output or an HTTP endpoint. MCP can be used with GitHub to perform various tasks like searching and fixing code issues. The Talk covered the basics of AI agents, building agents with Langflow and enhancing them with Composio, and using MCP with GitHub. The speaker encouraged audience questions and exploration of these concepts.
¡VS Code puede hacer eso!
JSNation Live 2021JSNation Live 2021
28 min
¡VS Code puede hacer eso!
The Talk covers various tips and features of using VS Code, including the command palette, Zen mode, external terminals, and debugging. It also highlights advanced editing and refactoring features, Git integration, and the use of dev containers. The speaker demonstrates how to set up a dev container for a Python app, run code in a container, and create and configure dev containers. The benefits of using dev containers are also discussed, such as eliminating manual configuration, handling dependencies, and facilitating team-based development.
Desarrollo Frontend Potenciado por IA: Construyendo Mejores UIs Más Rápido
Productivity Conf for Devs and Tech LeadersProductivity Conf for Devs and Tech Leaders
19 min
Desarrollo Frontend Potenciado por IA: Construyendo Mejores UIs Más Rápido
Today's Talk introduces the use of large language models (LLMs) to enhance front-end development. LLMs can act like our brains by maximizing the good parts and minimizing the bad parts. A demo in Cursor, an IDE, showcases how LLMs can be used with the builder.io Figma plugin. The Talk emphasizes the automation of tasks, such as adding a settings button and resolving errors, with the AI agent. Feedback and manual verification are crucial to ensure desired results. Tests and continuous iteration are recommended for stronger guarantees of correctness. Monitoring and guiding the AI agents is important to stay on track. Connecting to other tools like Figma and using AI prompting can further enhance code generation. The CLI enables code base integration and parallel development. Visual prototyping and seamless updates are possible with the Builder tool. Overall, the Talk highlights how LLMs can revolutionize front-end development by automating tasks, improving efficiency, and facilitating collaboration.

Workshops on related topic

Cómo Crear una Aplicación Web de Manera (Casi) Autónoma Usando Clean Coder
Productivity Conf for Devs and Tech LeadersProductivity Conf for Devs and Tech Leaders
95 min
Cómo Crear una Aplicación Web de Manera (Casi) Autónoma Usando Clean Coder
Workshop
Grigorij Dudnik
Grigorij Dudnik
Imagina reemplazarte a ti mismo con un programador de IA multi-agente para desarrollar tu aplicación web de producción. Eso es exactamente lo que hicimos en mi startup takzyli.pl. Para lograr esto, diseñamos y utilizamos el Clean Coder - marco de agentes de IA para la escritura autónoma de código (https://github.com/GregorD1A1/Clean-Coder-AI), que es un proyecto de código abierto, con suerte. Si funcionó para nosotros, ¿por qué no debería funcionar para ti?En esta masterclass, te mostraré cómo crear una aplicación web completa de manera (casi) autónoma y reducir drásticamente el tiempo que tú o tus empleados pasan escribiendo código.
Test, Code, Repeat: Dominando el Desarrollo Asistido por AI
Productivity Conf for Devs and Tech LeadersProductivity Conf for Devs and Tech Leaders
53 min
Test, Code, Repeat: Dominando el Desarrollo Asistido por AI
Workshop
Marco Pierobon
Marco Pierobon
"Test, Code, Repeat: Dominando el Desarrollo Asistido por AI" introduce a los desarrolladores a una forma transformadora de codificación con AI como un socio colaborativo. Esta masterclass se centra en cómo los flujos de trabajo iterativos, como la técnica de emparejamiento ping pong, permiten una interacción mejorada entre la creatividad humana y la eficiencia de AI.