Udemy web bootcamp

El bootcamp de desarrollo web completo

Recursos

https://www.appbrewery.co/p/web-development-course-resoures

Proyectos

• Proyecto 1: Uso del sitio personal creado HTML - https://sdkdeepa.github.io/resume/

• Proyecto 2: Introducción a CSS - https://sdkdeepa.github.io/profile/

• Proyecto 2 Final: HTML, CSS y Bootstrap - https://sdkdeepa.github.io/udemy-bootstrap/

• Proyecto 3: Juego de dados - Métodos JS y DOM - https://sdkdeepa.github.io/dice

• Proyecto 4: Kit de batería - Eventos de teclado JS - https://sdkdeepa.github.io/drumming/

• Proyecto 5: Simon Game - JS y JQuery - https://sdkdeepa.github.io/simon-game-jquery/

• Proyecto 6: Calculadora del IMC - Node.js y Express.js. Este proyecto utilizando métodos API como Get and Post para calcular el IMC

---

• Proyecto 7: APP meteorológica - Node.js y Express.js. Este proyecto utiliza una API meteorológica externa para hacer una llamada para obtener los datos meteorológicos después de que se envía una solicitud posterior.

• Proyecto 8: Registro del boletín-HTML, CSS, Bootstrap, JS, NodeJS, Express, API, NPM, Nodemon, Body-Parser, etc.-https://shrouded-river-17694.herokuapp.com/

• Proyecto 9 y 10: aplicación TODO List - Continuación de TODO List App V2. Se agregó, publicar, publicar y eliminar rutas. Ahora puede crear y eliminar la lista de TODO para hoy y para la lista personalizada. Se puede agregar una lista personalizada a la ruta de inicio (ex: /trabajo). Usando la base de datos de la nube MongoDB Altas se recopilan los datos. Aplicación alojada a través de Heroku. Echa un vistazo: https://tranquil-earth-77166.herokuapp.com/

• Proyecto 11: Sitio web de blog personal multipage: creó una aplicación de blog personal de varias páginas utilizando HTML, CSS, Bootstrap, JS, Node.js, Express.js, Body -Parser, API, EJS, Heroku, Mongoose, Mogodb Altas Cloud Cluster. Claro: https://morning-brook-32061.herokuapp.com/

Ejemplo de alambre de un proyecto

• Proyecto 2. Wireframing tindog.png

Temas cubiertos

HTML, CSS, JavaScript, Bootstrap 4, Dom & Dom Manipulation, jQuery, Node.js, Express, React EJS, Body-Parser, Nodemon, Lodash, MongoDB, MongoDB Atlas, Mongoose, Mongoose-Inscription, Dotenv, Md5, Bcrypp, Passport, Passportalocal, Passport-MongoNes Passport-Google-Path20, Mongoose-FindorCreate, Express-Session, API, JSON, Autenticación, API de MailChimp, Built REST API desde Scratch, Heroku.

Sección 9: Introducción a JavaScript ES6

• 116-117: Desafío: Cambiar la carcasa en el texto
• 118: Operador básico de aritmética y módulo en JavaScript
• 121-122: Funciones Parte 1: Desafío - The Karel Robot
• 124: Funciones Parte 2: Parámetros y argumentos

Sección 10: JavaScript intermedio

• 131: Generación de números aleatorios en JavaScript: Construyendo una calculadora de amor
• 132: Declaraciones de control: Uso de condicionales y lógica de IF-Else
• Ejercicio de codificación 5: Calculadora de IMC avanzada (si/else)
• Ejercicio de codificación 6: año bisiesto
• 138: Agregar elementos y técnicas de matriz intermedia

Sección 12: Boss Level Challenge 1 - El juego Dicee

• Crear un archivo js externo
• Agregar imágenes de dados
• Crear un número aleatorio
• Cambiar ambos IMG a un dado aleatorio
• Cambiar ambos elementos IMG
• Cambiar el título para mostrar un ganador

Sección 13: JavaScript avanzado y manipulación DOM

• 172: Desafío de función de orden superior

Sección 14: Kit de batería

• 171: Agregar recortadores de eventos a un botón
• 174: Cómo reproducir sonidos en un sitio web
• 176: Cómo usar declaraciones de conmutación en JavaScript
• 179: Uso de los oyentes de eventos de teclado para verificar las presiones de teclas
• 181: Agregar animación a los sitios web

Sección 15: Boss Level Challenge 2 - The Simon Game

• Agregar js y jQuery
• Crear un nuevo patrón
• Muestre la secuencia al usuario con animaciones y sonidos
• Verifique qué botón se presiona
• Agregar sonidos a los clics del botón
• Agregar animaciones a los clics del usuario
• Comienza el juego
• Verifique la respuesta del usuario contra la secuencia del juego
• Juego terminado
• Reiniciar el juego

Sección 19: Express.js con node.js

• 241: Creación de nuestro primer servidor con Express
• 242: Manejo de solicitudes y respuestas: la solicitud GET
• 244: Comprender y trabajar con rutas
• 246: Configuración del desafío de la calculadora
• 248: Responder a las solicitudes con archivos HTML
• 249: Procesamiento de solicitudes de publicación con analizador de carrocería
• 250: Desafío de enrutamiento del IMC

Sección 20: API - Interfaces de programación de aplicaciones

• 258: Hacer solicitudes de obtener con el módulo HTTPS de nodo
• 259: Cómo analizar JSON
• 260: Uso de Express para representar un sitio web con datos de API en vivo
• 261: Uso de Body Parser para analizar las solicitudes de publicación al proyecto del servidor: Proyecto meteorológico

Sección 21: Registro de boletín

• 263: Configuración de la página de registro
• 264: Publicar datos en los servidores de MailChimp a través de su API
• 265: Agregar páginas de éxito y fracaso
• 266: Implementar su servidor con Heroku

Proyecto: https://shrouded-river-17694.herokuapp.com/

Sección 22: EJS

• 282: ¿Plantillas? ¿Por qué necesitamos plantillas?
• 283: Creando su primera plantilla EJS
• 284: Ejecución de código dentro de la plantilla EJS
• 285: pasar datos de su página web a su servidor
• 287: Agregar hojas de estilo CSS prefabricadas a su sitio web
• 288: Comprensión de la plantilla vs diseños
• 289: Comprensión de las exportaciones del módulo de nodo: cómo aprobar funciones y datos entre archivos

Sección 23: Boss Level Challenge 3 - Sitio web del blog

• Obtenga la ruta de la casa y agregue contenido al hogar.egs
• Pase los datos de HomestartingContent a Home.EJS
• Agregue el encabezado y el pie de página parcials a casa.
• Miró el encabezado y el pie de página a la carpeta Parcials
• Agregar y contactar rutas, pasar contenido y contactar.
• Agregue Nav Href al encabezado
• Agregar forma de composición y ruta post
• Agregue campos de texto para componer el formulario y usar bootstrap
• Crear objeto JS para publicar
• Push Post en la matriz de publicaciones
• Agregar publicaciones a la matriz Render
• Recorrer todas las publicaciones
• Refactor para el bucle para usar foreach
• Renderiza cada publicación en casa
• Agregar parámetros de enrutamiento expreso /publicaciones /: BlogPost
• Grabación de publicaciones para verificar si coincide con el título en URL
• Agregue Lodash y use _.Lowercase en títulos
• Página separada para cada publicación de blog
• Truncate Post Body en la página de inicio a 100 caracteres
• Agregar Leer más a las publicaciones

Sección 27: Mongoose

• 357: Introducción a la mangosta
• 358: Lectura de su base de datos con mangosta
• 359: Validación de datos con mangosta
• 360: Actualización y eliminación de datos utilizando Mongoose
• 361: Establecer relaciones e incrustar documentos utilizando mangosta

Sección 28: Poner todo junto

• 364: Lleve el proyecto Todolist al siguiente nivel y conéctelo con Mongoose
• 365: Renderizar elementos de base de datos en la aplicación Todolista
• 366: Agregar nuevos elementos a nuestra base de datos Todolist
• 367: Eliminar elementos de nuestra base de datos Todolist
• 368: Creación de listas personalizadas utilizando parámetros de ruta expresa
• 369: Agregar nuevos elementos a los Todolistas personalizados
• 370: Revisando a Lodash y eliminando artículos de listas de tareas personalizadas

Sección 29 - Implementación de su aplicación web

• 374: cómo implementar aplicaciones web con una base de datos
• 374: Cómo configurar MongoDB Atlas
• 375: Implementar una aplicación con una base de datos a Heroku

Carpeta: Proyecto 9 y 10: Lista de TODO https://tranquil-earth-77166.herokuapp.com/

Sección 30 - Boss Level Challenge 4 - Actualización del sitio web del blog

• 381: Guardar publicaciones compuestas con MongoDB
• 382: Llegue la página de inicio para renderizar las publicaciones
• 383: la redirección a la página de inicio después de guardar () se completa sin errores
• 384: Renderiza la publicación de blog correcta basada en POST _ID

Carpeta: Proyecto 11: sitio web de blog completado https://morning-brook-32061.herokuapp.com/

Sección 31 - Construya su propia API relajante desde cero

• 389: Configurar el desafío del servidor
• 391: Obtenga todos los artículos
• 392: publicar un nuevo artículo
• 393: Eliminar todos los artículos
• 394: manejadores de ruta encadenados usando express
• 395: Obtenga un artículo específico
• 396: Pon un artículo específico
• 397: parche un artículo específico
• 398: eliminar un artículo específico

Carpeta: wiki-api

Sección 32 - Autenticación y seguridad

• 403: Establecer
• 404: Nivel 1: registre a los usuarios con nombre de usuario y contraseña
• 406: Nivel 2 - Cifrado de la base de datos
• 407: Uso de variables de entorno para mantener los secretos seguros
• 408: Nivel 3 - Contraseñas de hash
• 410: Nivel 4 - Contraseñas de sales y hash con BCrypt
• 412: Nivel 5 - Uso de Passport.js para agregar cookies y sesiones
• 413A: Nivel 6 - OAuth 2.0 y cómo implementar iniciar sesión con Google
• 413b: Nivel 6 - OAuth 2.0 con Facebook
• 414: dejar que los usuarios envíen secretos

Carpeta: secretos

Sección 33 - React.js

• 422: práctica del código JSX
• 423: Expresiones de JavaScript en literales de plantilla JSX & ES6
• 424: Expresiones de JavaScript en JSX Practice
• 425: Atributos y elementos reactivos de estilo
• 426: Estilización en línea para los elementos React
• 427: Práctica de estilo reaccionar
• 428: React Components
• 429: React Component Practice
• 431: JavaScript ES6 Importación, exportación y práctica de módulos
• 434: Proyecto de aplicación de guardianes - Parte 1
• 436: reaccionar los accesorios
• 437: Reaccionar la práctica de los accesorios
• 438: React DevTools - https://990sq.csb.app/
• 439: Mapeo de datos a componentes - https://0lrqy.csb.app/
• 440: Mapeo de datos a la práctica de componentes - https://1kzup.csb.app/
• 441: JavaScript ES6 Map/Filter/Reduce
• 442: Funciones de flecha JavaScript ES6
• 443: Proyecto de aplicación para el guardián - Parte 2
• 444: Reaccionar la representación condicional con el operador ternario y el operador
• 445: Práctica de representación condicional - https://pr7ow.csb.app/
• 447: React Hooks - Usestate
• 448: práctica de gancho usestate
• 449: JavaScript ES6 Objeto y destrucción de matriz
• 450: JavaScript ES6 Destructuring Challenge
• 451: Manejo de eventos en React
• 452: React Forms
• 454: Cambio de estado complejo
• 455: Cambio de práctica estatal compleja
• 456: JavaScript ES6 Spread Operator
• 457: JavaScript ES6 Spread Operator Practice
• 458: Administrar un árbol de componentes
• 459: Administrar una práctica de árbol de componentes
• 460: Proyecto de aplicación de guardia - Parte 3
• 461: React Dependencias y estilo la aplicación Keeper - https://pbt9b.csb.app/

Herramientas utilizadas

• codepen
• Átomo
• Cartero
• Hiper terminal
• Código de Visual Studio
• https://codesandbox.io/