Django 5 + Integración con Vue 3 y Bootstrap 5

U1: Introducción a Django

• Introducción
• Software necesario
• Verificar el comando de acceso a Python 3 y Pip
• Preparar el entorno
• Instalar Django
• Proyecto vs aplicación
• Estructura del proyecto
• Hola Mundo
• Línea de comandos en Django
• MTV
• Opcional: Seleccionar el intérprete de Python en VSC y/o crear venv

U2: Primeros pasos con Python (Reforzamiento)

• Introducción
• Consola interactiva/consola de Python
• Archivos de Python
• Variables y tipo de datos
• Operaciones matemáticas
• Concatenación de String
• Casteos
• Listas
• Condicionales
• Ciclos
• Funciones
• Funciones parte 2
• Diccionarios
• Clases, Primeros pasos
• Clases, Primeras clases
• Clases, Método constructor
• Clases, Herencia

 U3: Crear una aplicación tipo CRUD

• Introducción
• Modelos
• Reto: Crear modelo de comentario
• Introducción a las migraciones
• Visualizar base de datos
• Revertir migraciones
• Renderizar un template
• Pase de parámetros al template
• Carpetas contenedoras para los templates
• Shortcut, funciones de ayuda
• Formularios y manejo de las peticiones desde la vista/controlador
• Crear un objeto modelo y registrar en la base de datos
• Modelos para los formularios
• Operaciones a la base de datos
• Shell
• CRUD: Listado
• CRUD: Editar
• CRUD: Eliminar
• Redirecciones
• Paginación
• Encontrar o 404: Detalle
• Encontrar o 404: Listados
• Faker: Primeras pruebas
• Faker: Crear script
• Publicar en Github

 U4: Django Admin

• Introducción
• Presentación
• Crear superusuario
• Agregar nuestras propias relaciones
• Personalizar opciones de consulta
• Personalizar opciones de guardado
• Registrar clases mediante un decorador
• Registrar el modelo para los tipos y categorías
• Registrar el modelo para los elements
• Agrupar los campos de gestión, fields
• Agrupar los campos de gestión, fieldset
• Personalizar campos del formulario
• Crear campos personalizables
• Opciones de guardado
• Modelos en línea
• Personalizar métodos de gestión CRUD
• Validaciones personalizadas
• Crear el slug de los elementos automáticamente en → Django admin
• Tema y archivos estáticos CSS, JS...
• Publicar en Github

U5: Formularios

• Introducción
• Presentación
• Form para los elementos
• Vista para procesar el formulario
• Reto: Crea un ModelForm para los elementos
• Listado
• Validaciones: Introducción
• Mostrar los errores de validación
• Extra: Corrección de rutas
• Validaciones personalizadas
• Referenciar los campos y labels del formulario individualmente
• Form Assets (Media class): Introducción
• Form Assets (Media class): Atributo widget
• Form Assets (Media class): Clase widget
• Form Assets (Media class): Clase widget parte 2
• Form Assets (Media class): Tipos de campos
• Form Assets (Media class): Modificar atributos
• Form Assets (Media class): Django widgets
• field group
• Publicar en github

U6: Templates: Plantillas maestras, etiquetas y filtros

• Introducción
• Presentación
• Template maestro
• Reutilizar plantillas desde otras aplicaciones
• Incluir templates o fragmentos
• Fragmentos de templates y parámetros
• Otros usos de los bloques en los templates
• Etiquetas lógicas: if y for, presentación
• Programar nuestras propias etiquetas
• Filtros: Presentación
• Filtros: cut
• Filtros: date
• Filtros: now
• Filtros: lower
• Filtros: upper
• Filtros: add
• Filtros: with
• Filtros: cycle
• Filtros: default
• Filtros: length
• Filtros: safe
• Filtros: join
• Filtros anidados
• Programar nuestros propios filtros
• Cambiar de motor de plantilla - Jinja2
• Publicar en Github

U7: Trabajando con QuerySets

• Introducción
• Crear un objeto
• Obtener un objeto
• Actualizar un objeto
• Recuperando objetos
• Filtrar objetos
• Excluir resultados
• Ordenar
• Eliminación de objetos

U8: Crear una Api Rest con Django Rest Framework

• Introducción
• Presentación
• Instalar paquete y configurar
• Definir serialización
• Definir viewset (view)
• Rutas
• Pruebas con la Rest Api
• Problemas al momento de crear/actualizar un elemento
• Personalizar clases ViewSets
• Habilitar la paginación
• many=true, relación inversa
• Métodos personalizados para las serializaciones
• Métodos personalizados para los viewset
• Métodos hooks en los viewsets
• Autenticación: Presentación
• Autenticación: Sesión y básica
• Autenticación: Token: Configuración base
• Autenticación: Token: Función login
• Autenticación: Token: Función login
• Configurar los CORS
• Publicar en github

U9: Aplicación con Vue 3, NaiveUI, consumir Api Rest

• Introducción
• Vue CLI
• Crear el proyecto
• Instalar y configurar Vue Router
• Instalar axios y primera petición
• Crear un repositorio en git
• Crear un listado de categorías
• Tarea: crear un listado de tipos
• Navegación entre páginas
• Sobre, Instalar, configurar y primeras pruebas con naive UI
• Componente de tabla para las categorías y tipos
• Space: Contenedor
• Layout: Esqueleto básico
• Menú: con componente menu
• Menú: Establecer el RouterLink
• Adaptar menú en un componente aparte
• Menú: Opciones de listado dinámicas
• Header para las categorías y tipos
• Botones para los RouterLink
• Integrar Tailwinds.css
• Adaptar detalles visuales
• Listado de elementos
• Extra: Agrupar rutas
• Listado de elementos por categoría
• Tarea: Listado de elementos por tipo
• Extra: Introducción a sobrescribir el tema de NaiveUI
• Vista de detalle de los elementos
• Publicar en git

U10: Aplicación en Vue 3: CRUD y formularios

• Introducción
• Formulario para categorías, estructura inicial
• Formulario para categorías, crear
• Formulario para categorías, manejo de errores
• Formulario para categorías, editar
• Tarea: Formulario para tipos
• Formulario para los elementos, esquema inicial
• Formulario para los elementos, armar listados
• Integrar CKEditor
• Habilitar el CSS de CKEditor
• Publicar en git

U11: Vue 3: Ajuste

• Activar opciones del menú de categorías y tipos
• Acomodar fecha elementos
• Redireccionar en Vue Router
• Cambios visuales
• Múltiples router-views: Título en el base

U12: Vistas basadas en clases (CBV): Web de libros

• Introducción
• Crear proyecto y aplicación
• Crear modelo inicial
• Crear formulario inicial
• Crear las primeras CBV para manejar el formulario y de éxito
• UpdateView: Actualizar
• CreateView: Crear
• DeleteView: Borrar
• DetailView: Detalle
• IndexView: Listado
• Publicar en git

U13: Vistas basadas en clases (CBV): Autenticación

• Introducción
• LoginView: Vista para el login
• LogoutView: Vista para el logout
• PasswordChangeView: Vista para cambiar la contraseña
• PasswordChangeRest: Vista para cambiar restablecer la contraseña
• Publicar en github

U14: Manejar archivos

• Introducción
• Presentación
• Crear un proyecto y aplicación
• CSV: Primeros pasos
• CSV: Leer
• CSV: Leer, Diccionario
• CSV: Escribir un archivo
• CSV: Escribir un archivo
• Cerrar archivo y palabra reservada with
• XLSX: Crear aplicación
• XLSX: Leer
• XLSX: Escribir
• Generar PDFs: Crear aplicación
• Generar PDFs: Generar un PDF a partir de una página HTML
• Generar PDFs: Weasyprint otras opciones
• Generar PDFs: Generar un PDF a partir de un Canvas
• Círculos, rectángulos y líneas, colores...
• Descargar, cualquier archivo existente
• Descargar PDF, reporlab
• Publicar en github

U15: Django Channels: Single Channel

• Introducción
• Django Channels, Presentación
• Crear proyecto e instalar dependencias
• Configurar proyecto y servidor con channels[daphne]
• Crear modelos de ejemplo y data de ejemplo
• Consumer: Primeros pasos y creación
• Cliente (Vista y Template): Estructura base
• Cliente (Vista y Template): WebSocket, Abrir canal
• Cliente (Vista y Template): WebSocket, Terminal  implementación 
• Instalar Bootstrap 5
• Configurar aplicación con B5
• Publicar en github

U16: Django Channels: Multiple Channels

• Introducción
• Presentación
• Redis: MacOS
• Channels Redis: Instalar
• Channels Redis: Configurar
• Modificaciones en la aplicación de chat: Primera parte
• Modificaciones en la aplicación de chat: Enviar mensajes
• Cambios en el cliente
• Convertir el consumer a código asíncrono
• Publicar en Github

U17: DRF, Django Channels y Vue: Aplicación de mensajes de alertas

• Introducción
• Presentación
• Instalaciones y configuraciones necesarias
• Modelo de alerta
• Serialización de alerta
• Autenticación mediante tokens
• Verificar métodos anteriores
• Consumer
• Crear proyecto en Vue
• Instalar y configurar dependencias en Vue
• Componente Vue: Login
• Componente Vue: Logout
• Componente para enviar y recibir mensajes
• Middleware para la autenticación por token en el consumer: Teoría
• Middleware para la autenticación por token en el consumer: Estructura base
• Middleware para la autenticación por token en el consumer
• Mostrar mensajes de alerta por usuario
• Diseño aplicado
• Selección de habitaciones
• Toques finales
• Publicar en github
• Extra: Bloquear el textarea al conectarse al websocket y mostrar mensaje de carga
• Extra: Destruir token de autenticación en el servidor

U18: Pruebas

• Introducción
• Presentación
• Pruebas matemáticas
• Preparar entornos
• ¿Qué vamos a probar?
• Test Client en Django, primeros pasos
• Test Client en Django mediante clases
• TestCase: setUp
• Herramientas para realizar las pruebas
• Contexto de las pruebas unitarias
• Crud de Comentarios: Index
• Repaso
• Crud de Comentarios: Crear - Get
• Crud de Comentarios: Crear - Post
• Reto: Crud de Comentarios: Actualizar
• Reto: Crud de Comentarios: Eliminar
• Otros métodos de aserción: assertRedirects
• Otros métodos de aserción: assertTemplateUsed
• Otros métodos de aserción: assertHTMLEqual
• Formularios: Campos
• Formularios: Válido
• Formularios: Inválido
• Formularios: Crear
• Formularios: Actualizar
• Mejorar la estructuras de archivos y carpetas de las pruebas
• Ejecutar determinadas pruebas
• Api: Paginados
• Api: Detalle
• Api: Detalle con Serialización
• Api: Crear
• Api: Actualizar
• Api: Eliminar
• Probar CommentSerializer
• Api: Formulario con errores de validación
• Api: Preparar clase
• Api: Paginados
• Api: Formatear el JSON
• Api: Crear Elemento
• Api: Actualizar Elemento
• Api: Formulario con errores de validación
• Api: Eliminar Elemento
• Probar ElementSerializer
• Autenticación
• Factory
• Publicar en github

U19: Autenticación personalizada

• Introducción
• Crear proyecto y aplicación
• Exponer rutas de autenticación
• Sobrescribir template de login
• Ejecutar migraciones y crear superusuario
• Parámetro next
• Habilitar archivos estáticos
• Instalar Bootstrap y Fontawesome
• Crear un template maestro
• Especificación de atributos HTML con django-widget-tweaks
• login.html
• Mensaje de alerta
• password_change_form.html
• password_change_done.html
• password_reset_form.html
• password_reset_done.html
• Extra: Envio de correos, configurar Mailtrap
• password_reset_confirm.html
• password_reset_complete.html
• Registrar: Estructura inicial de la vista
• Registrar: Formulario
• Registrar: Estructura inicial de la vista
• Demo: Registrar: Formulario personalizado
• Perfil: Estructura base
• Cargar el avatar: Modelo
• Cargar el avatar: Definir formulario
• Cargar el avatar: Emplear formulario
• Cargar el avatar: Buscar userprofile existente
• Cargar el avatar: Configurar MEDIA_ROOT
• Cargar el avatar: Eliminar imagen del avatar anterior
• Cargar el avatar: Validaciones de archivo (avatar)
• Otros campos: Modelo, Formulario y migración
• Otros campos: Template
• Mostrar información de perfil: Usuario autenticado
• Mostrar información de perfil: Avatar
• Publicar en github

U20: Signals

• Introducción
• Presentación
• Implementar un signal
• Publicar en github

Evaluación del curso

• Este curso contiene un examen final

G-Tools: Para estudiantes

• Acceso exclusivo a herramientas de vanguardia para estudiantes: mejora tu empleabilidad, participa en eventos exclusivos, aprovecha nuestro asistente virtual inteligente y más.

⚑ Certificado de finalización

• Tu certificado digital personalizado, una insignia única de tus logros, con validez internacional, duración del curso y código QR para verificación instantánea.