msb-public
/
Web-Dev-For-Beginners
mirror of https://github.com/microsoft/Web-Dev-For-Beginners.git
1
0
Code Issues Projects Releases Wiki Activity

translate final

Browse Source
pull/1271/head
andreudev 2 years ago
parent 49ca8a294b
commit 735ecc4188
1 changed files with 51 additions and 51 deletions
Show Stats Download Patch File Download Diff File

102
translations/README.es.md
Unescape View File

@ -82,66 +82,66 @@ Nuestra recomendación es que uses [Visual Studio Code](https://code.visualstudi
## 📂 Cada lección incluye:
- optional sketchnote
- optional supplemental video
- Notas (opcional)
- Videos complementarios (opcional)
- Una prueba pre-lección
- written lesson
- for project-based lessons, step-by-step guides on how to build the project
- knowledge checks
- Lección escrita
- Clases basadas en proyectos, guías paso a paso de cómo constriur el proyecto
- Comprobar conocimiento
- Retos
- supplemental reading
- assignment
- Lectura complementaria
- Tareas
- Una prueba post-lección
> **Una nota acerca de las pruebas**: todas las pruebas están incluidas [en esta app](https://ashy-river-0debb7803.1.azurestaticapps.net/), for 48 total quizzes of three questions each. They are linked from within the lessons but the quiz app can be run locally; follow the instruction in the `quiz-app` folder. They are gradually being localized.
> **Una nota acerca de las pruebas**: todas las pruebas están incluidas [en esta app](https://ashy-river-0debb7803.1.azurestaticapps.net/), Para un total de 48 pruebas cada una. Están enlazadas en las lecciones pero puedes ejecutarlas localmente; suguiendo las instrucciones en la carpeta `quiz-app`. Se irán localizando gradualmente.
## 🗃️ Lecciones
| | Nombre del proyecto | Concepts Taught | Objetivos de aprendizaje | Enlaces de la lección | Autor |
| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
| 01 | Getting Started | Introduction to Programming and Tools of the Trade | Learn the basic underpinnings behind most programming languages and about software that helps professional developers do their jobs | [Intro to Programming Languages and Tools of the Trade](/1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Getting Started | Basics of GitHub, includes working with a team | How to use GitHub in your project, how to collaborate with others on a code base | [Intro to GitHub](/1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Getting Started | Accessibility | Learn the basics of web accessibility | [Accessibility Fundamentals](/1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS Basics | JavaScript Data Types | The basics of JavaScript data types | [Data Types](/2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS Basics | Functions and Methods | Learn about functions and methods to manage an application's logic flow | [Functions and Methods](/2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher |
| 06 | JS Basics | Making Decisions with JS | Learn how to create conditions in your code using decision-making methods | [Making Decisions](/2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS Basics | Arrays and Loops | Work with data using arrays and loops in JavaScript | [Arrays and Loops](/2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](/3-terrarium/solution/README.md) | HTML in Practice | Build the HTML to create an online terrarium, focusing on building a layout | [Introduction to HTML](/3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](/3-terrarium/solution/README.md) | CSS in Practice | Build the CSS to style the online terrarium, focusing on the basics of CSS including making the page responsive | [Introduction to CSS](/3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](/3-terrarium/solution/README.md) | JavaScript Closures, DOM manipulation | Build the JavaScript to make the terrarium function as a drag/drop interface, focusing on closures and DOM manipulation | [JavaScript Closures, DOM manipulation](/3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](/4-typing-game/solution/README.md) | Build a Typing Game | Learn how to use keyboard events to drive the logic of your JavaScript app | [Event-Driven Programming](/4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Green Browser Extension](/5-browser-extension/solution/README.md) | Working with Browsers | Learn how browsers work, their history, and how to scaffold the first elements of a browser extension | [About Browsers](/5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Green Browser Extension](/5-browser-extension/solution/README.md) | Building a form, calling an API and storing variables in local storage | Build the JavaScript elements of your browser extension to call an API using variables stored in local storage | [APIs, Forms, and Local Storage](/5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Green Browser Extension](/5-browser-extension/solution/README.md) | Background processes in the browser, web performance | Use the browser's background processes to manage the extension's icon; learn about web performance and some optimizations to make | [Background Tasks and Performance](/5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](/6-space-game/solution/README.md) | More Advanced Game Development with JavaScript | Learn about Inheritance using both Classes and Composition and the Pub/Sub pattern, in preparation for building a game | [Introduction to Advanced Game Development](/6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](/6-space-game/solution/README.md) | Drawing to canvas | Learn about the Canvas API, used to draw elements to a screen | [Drawing to Canvas](/6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](/6-space-game/solution/README.md) | Moving elements around the screen | Discover how elements can gain motion using the cartesian coordinates and the Canvas API | [Moving Elements Around](/6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Space Game](/6-space-game/solution/README.md) | Collision detection | Make elements collide and react to each other using keypresses and provide a cooldown function to ensure performance of the game | [Collision Detection](/6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](/6-space-game/solution/README.md) | Keeping score | Perform math calculations based on the game's status and performance | [Keeping Score](/6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Space Game](/6-space-game/solution/README.md) | Ending and restarting the game | Learn about ending and restarting the game, including cleaning up assets and resetting variable values | [The Ending Condition](/6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banking App](/7-bank-project/solution/README.md) | HTML Templates and Routes in a Web App | Learn how to create the scaffold of a multipage website's architecture using routing and HTML templates | [HTML Templates and Routes](/7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](/7-bank-project/solution/README.md) | Build a Login and Registration Form | Learn about building forms and handling validation routines | [Forms](/7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](/7-bank-project/solution/README.md) | Methods of Fetching and Using Data | How data flows in and out of your app, how to fetch it, store it, and dispose of it | [Data](/7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](/7-bank-project/solution/README.md) | Concepts of State Management | Learn how your app retains state and how to manage it programmatically | [State Management](/7-bank-project/4-state-management/README.md) | Yohan |
| 01 | Primeros pasos | Introducción a la programación y herramientas del area | Aprende los fundamentos básicos de la mayoría de lenguajes de programación y el software que ayuda a los programadores en su trabajo | [Introducción a la programación y herramientas del area](/1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Primeros pasos | GitHub básico, incluyendo el trabajo en equipo | Como usar GitHub en tu proyecto, como colaborar con los demás en un código base | [Introducción a GitHub](/1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Primeros | Accesibilidad | Aprende los fundamentos de la accesibilidad web | [Fundamentos de accesibilidad](/1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS Básico | Tipo de datos en JavaScript | Tipos de datos básicos de JS | [Tipos de datos](/2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS Básico | Funciones y metodos | Aprender funciones y métodos para gestionar el flujo lógico de una aplicación | [Funciones y metodos](/2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher |
| 06 | JS Básico | Tomando decisiones con JS | Aprenda a crear condiciones en su código usando métodos de toma de decisiones | [Tomando decisiones](/2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS Básico | Arreglos y ciclos | Trabaja con datos usando matrices y ciclos en JS | [Arrays and Loops](/2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](/3-terrarium/solution/README.md) | HTML en la práctica | construye el HTML para crear un terrarium, enfocandose en la construcción de un diseño | [Introducción a HTML](/3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](/3-terrarium/solution/README.md) | CSS en la práctica | Construye el CSS para darle estilo al terrarium, centrandose en los fundamentos de CSS incluyendo reponsividad | [Introducción a CSS](/3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](/3-terrarium/solution/README.md) | JavaScript Clausura, manipulación del DOM | Construir el JavaScript para que el terrario funcione como una interfaz de arrastrar y soltar, centrándose en los cierres y el DOM. | [JavaScript Clausura, manipulación del DOM](/3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Juego de mecanografía](/4-typing-game/solution/README.md) | Build a Crear un juego de mecanografía | Aprenda a utilizar los eventos de teclado para controlar la lógica de su aplicación JavaScript. | [Programación basada en eventos](/4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Extensión ecológica para navegadores](/5-browser-extension/solution/README.md) | Trabajando con navegadores | Aprenda cómo funcionan los navegadores, su historia y cómo armar los primeros elementos de una extensión de navegador | [Acerca de los navegadores](/5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Extensión ecológica para navegadores](/5-browser-extension/solution/README.md) | Creando un formulario, llamado de APIs y almacenamiento de variables en variable local | Construye elementos JavaScript de su extensión del navegador para llamar a una API utilizando variables almacenadas en el almacenamiento local | [APIs, formularios y almacenamiento local](/5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Extensión ecológica para navegadores](/5-browser-extension/solution/README.md) | Procesos de segundo plano en el navegador, rendimiento web | Utilizar los procesos de segundo plano del navegador para gestionar el icono de la extensión; aprenda sobre el rendimiento de la web y algunas optimizaciones para realizar | [Tareas de segundo plano y rendimiento](/5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](/6-space-game/solution/README.md) | Desarrollo avanzado de juegos con JavaScript | Aprender sobre Herencia utilizando tanto las clases como la composición y el patrón Pub/Sub, en preparación para la construcción de un juego. | [Introducción al desarrollo avanzado de juegos](/6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](/6-space-game/solution/README.md) | Dibujando en canvas | Conozca la API Canvas, utilizada para dibujar elementos en una pantalla | [Dibujando en canvas](/6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](/6-space-game/solution/README.md) | Mover elementos por la pantalla | Descubra cómo los elementos pueden moverse utilizando las coordenadas cartesianas y la API Canvas. | [Desplazamiento de elementos](/6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Space Game](/6-space-game/solution/README.md) | Detección de colisiones | Hacer que los elementos colisionen y reaccionen entre sí mediante pulsaciones de teclas y proporcionar una función de enfriamiento para garantizar el rendimiento del juego. | [Detección de colisiones](/6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](/6-space-game/solution/README.md) | Puntuación | Realiza cálculos matemáticos basados en el estado y el rendimiento del juego | [Puntuación ](/6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Space Game](/6-space-game/solution/README.md) | Finalizar y reiniciar el juego | Aprende a terminar y reiniciar el juego, incluida la eliminación de activos y el restablecimiento de los valores de las variables | [La condición final](/6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banking App](/7-bank-project/solution/README.md) | Plantillas HTML y Rutas en una Aplicación Web | Aprenda a crear el esqueleto de la constitución de un sitio web multipágina mediante el uso de rutas y plantillas HTML. | [Plantillas y rutas HTML](/7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](/7-bank-project/solution/README.md) | Crear un formulario de registro e inicio de sesión | Aprenda a crear formularios y a manejar rutinas de validación | [Formularios](/7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](/7-bank-project/solution/README.md) | Métodos de obtención y utilización de datos | Cómo fluyen los datos dentro y fuera de su aplicación, cómo obtenerlos, almacenarlos y eliminarlos. | [Datos](/7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](/7-bank-project/solution/README.md) | Conceptos de gestión de estado | Aprenda a conservar el estado de su aplicación y a gestionarlo mediante programación. | [Gestión del estado](/7-bank-project/4-state-management/README.md) | Yohan |
## 🏫 Pedagogy
## 🏫 Pedagogía
Our curriculum is designed with two key pedagogical principles in mind:
* project-based learning
* frequent quizzes
Nuestro plan de estudios se ha diseñado teniendo en cuenta dos principios pedagógicos fundamentales:
* Aprendizaje basado en proyectos
* Pruebas constantes
The program teaches the fundamentals of JavaScript, HTML, and CSS, as well as the latest tools and techniques used by today's web developers. Students will have the opportunity to develop hands-on experience by building a typing game, virtual terrarium, eco-friendly browser extension, space-invader-style game, and a banking app for businesses. By the end of the series, students will have gained a solid understanding of web development.
El programa enseña los fundamentos de JavaScript, HTML y CSS, así como las últimas herramientas y técnicas utilizadas por los desarrolladores web actuales. Los estudiantes tendrán la oportunidad de adquirir experiencia práctica construyendo un juego de mecanografía, un terrario virtual, una extensión de navegador ecológica, un juego del estilo de los invasores del espacio y una aplicación bancaria para empresas. Al final de la serie, los estudiantes habrán adquirido una sólida comprensión del desarrollo web.
> 🎓 You can take the first few lessons in this curriculum as a [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) on Microsoft Learn!
> 🎓 Puedes tomar las primeras lecciones de este plan de estudios como una [ruta de aprendizaje](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) en Microsoft Learn!
By ensuring that the content aligns with projects, the process is made more engaging for students and retention of concepts will be augmented. We also wrote several starter lessons in JavaScript basics to introduce concepts, paired with a video from the "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" collection of video tutorials, some of whose authors contributed to this curriculum.
Al garantizar que el contenido se ajusta a los proyectos, el proceso resulta más atractivo para los alumnos y se incrementa la capacidad de retención de conceptos. También hemos escrito varias lecciones de iniciación a los conceptos básicos de JavaScript, combinadas con un vídeo de la colección de tutoriales en vídeo "[Serie para principiantes: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", algunos de cuyos autores han contribuido a este plan de estudios.
In addition, a low-stakes quiz before a class sets the intention of the student towards learning a topic, while a second quiz after class ensures further retention. This curriculum was designed to be flexible and fun and can be taken in whole or in part. The projects start small and become increasingly complex by the end of the 12-week cycle.
Además, un cuestionario de poca exigencia antes de la clase fija la intención del alumno hacia el aprendizaje de un tema, mientras que un segundo cuestionario después de la clase garantiza una mayor retención. Este plan de estudios se diseñó para que fuera flexible y divertido, y puede cursarse en su totalidad o en parte. Los proyectos empiezan siendo pequeños y se hacen cada vez más complejos al final del ciclo de 12 semanas.
While we have purposefully avoided introducing JavaScript frameworks to concentrate on the basic skills needed as a web developer before adopting a framework, a good next step to completing this curriculum would be learning about Node.js via another collection of videos: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
Aunque hemos evitado a propósito introducir frameworks JavaScript para concentrarnos en las habilidades básicas necesarias como desarrollador web antes de adoptar un framework, un buen siguiente paso para completar este plan de estudios sería aprender sobre Node.js a través de otra colección de vídeos: "[Serie para principiantes a: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> Visita nuestro [Code of Conduct](CODE_OF_CONDUCT.md) and [Contributing](CONTRIBUTING.md) guidelines. We welcome your constructive feedback!
> Visita nuestro [código de conducta](CODE_OF_CONDUCT.md) guía de [Contributing](CONTRIBUTING.md). Agradecemos sus comentarios constructivos.
## 🧭 Acceso sin conexión
@ -153,17 +153,17 @@ Puedes correr esta documentación sin conexión a internet, usando [Docsify](htt
Un PDF con todas las lecciones puedes encontrarlo [aquí](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
## 🎒 Other Curricula
## 🎒 Otros planes de estudio
Our team produces other curricula! Check out:
¡Nuestro equipo elabora otros planes de estudios! Miralos:
- [AI for Beginners](https://aka.ms/ai-beginners)
- [Data Science for Beginners](https://aka.ms/datascience-beginners)
- [Generative AI for Beginners](https://aka.ms/genai-beginners)
- [IoT for Beginners](https://aka.ms/iot-beginners)
- [Machine Learning for Beginners](https://aka.ms/ml-beginners)
- [XR Development for Beginners](https://aka.ms/xr-dev-for-beginners)
- [Mastering GitHub Copilot for AI Paired Programming](https://aka.ms/GitHubCopilotAI)
- [IA para principantes](https://aka.ms/ai-beginners)
- [Cienca de datos para ](https://aka.ms/datascience-beginners)
- [IA generativa para principiantes](https://aka.ms/genai-beginners)
- [IoT para principiantes](https://aka.ms/iot-beginners)
- [Machine Learning para principiantes](https://aka.ms/ml-beginners)
- [Desarrollo XR para principiantes](https://aka.ms/xr-dev-for-beginners)
- [Mastería en GitHub Copilot para la programación conjunta](https://aka.ms/GitHubCopilotAI)
## License

Write Preview
Loading…
Cancel
Save