Full-Stack Web Development with Django and Angular

Syllabus

Toggle Themes Toggle sub-themes

Introduction

Course Intro

  1. About the course
  2. What you have to know and what you'll learn
  3. Prerequisites: setup python, pipenv, git

Git Overview

  1. Installing and configuring git
  2. Distributed VCS - Basic Concepts
  3. Create and configure a git repository
  4. Adding files to repository and committing changes
  5. Connect your local git repository to your GitHub/GitLab repository

Web Development Concepts - Overview

  1. Client-Server Communication. HTTP Basics.
  2. Client-Side vs Server-Side Rendering (or SPA vs. MPA)
  3. Web Services, RESTfull APIs.

Client-Side (Front-End) Programming in a Nutshell

  1. Structuring content with HTML5
  2. CSS: selectors, basic properties.
  3. JavaScript and DOM Overview.
  4. AJAX with XMLHttpRequest (and with jQuery)

Server-Side (Back-End) Programming Overview

  1. Overview. CGI and modern equivalents.
  2. Build a simple Web App without a Framework
  3. Popular Server-Side Frameworks

The Django Framework - Fundamentals

Django - introduction and architecture overview

  1. What is Django and what problem it solves? A brief history.
  2. Applications made with Django.
  3. Django versions.
  4. The MVC Pattern in Django - MTV (Model Template View)
  5. Project and Apps.
  6. Django - database tools overview
  7. Frame the "Demo App" in Django terms
  8. Create a skeleton Django Project

The Django Template System

  1. How Django Template System works?
  2. Templates Configuration
  3. Django Template Language Syntax
  4. Built-In Tags
  5. Filters
  6. Template inheritance - extend and reuse templates

Django and static resources (images, JavaScript, CSS, etc.)

  1. Access Static Resources in Django Templates

Views and Routing

  1. How Django Process a Request
  2. Views and URL configuration
  3. Path converters
  4. URL patterns
  5. URL parameters and query strings
  6. URL names and namespaces
  7. Class-based Views Introduction

HTML and Django Forms

  1. Overview of HTML Forms
  2. Embed Pure HTML Forms in Django - live demo
  3. Style HTML Forms with BS4 - live demo
  4. Common Security Issues
  5. Building a form in Django

Django ORM

Configure and connect to a Database

  1. Configure a DB for Django Project

Django ORM Overview

  1. Django ORM Overview
  2. The Migrations Workflow
  3. Model Fileds
  4. Models Relationships
  5. The Model Methods
  6. Model Transactions
  7. Initial Data Setup (fixtures)

Django ORM Model Queries

  1. Field lookup with Django ORM
  2. Merge and aggregate queries
  3. Expression and Function Queries
  4. Model Queries with Raw SQL
  5. Django ORM CRUD operations

Using Django ORM with MySQL/Oracle

  1. Connecting to and configuring the Database
  2. Common issues

Django Advanced Forms and CRUD Operations

Django Model Forms and Class Views

  1. Overview and workflow
  2. Create Django Model Forms
  3. Model Forms and Field Mapping
  4. Model Forms with relationships
  5. Model Forms initialization and validation
  6. Class-Based Views with Models

File Upload With Django

  1. Overview and settings
  2. the upload_to parameter

Form validation and cleaning

  1. Overview
  2. Validate forms with Django

CRUD Operations

  1. Configure a DB for Django Project

Advanced DB and ORM

Using Django with legacy DB

  1. Create the demo project
  2. The database
  3. Introspect the database tables with inspectdb
  4. Using more than one database

Access a database directly and execute SQL queries

  1. Connections and Cursors
  2. Using more than one database

Django middleware

Django’s middleware framework

  1. Overview
  2. Writing custom middlewares

Users, Authentication and Admin Management

Django User System

  1. Overview
  2. Create and manage Users
  3. Create and manage Groups
  4. User Permissions
  5. Model Permissions
  6. Enforce Django permissions in views, urls, templates, models

Django Session Framework

  1. Setup the Session Middleware
  2. Using Sessions in Views
  3. Setup Cookies
  4. Saving Sessions

Web Services, Web Sockets and Django

Django REST Framework

  1. Overview of REST Services with Django
  2. Introduction to Django REST Framework (DRF)
  3. Serializers and Views
  4. View Sets and Routers

[Optional] Django and Web Sockets

  1. WebSockets Overview
  2. WebSockets vs. REST APIs
  3. WebSockets with Django Channels

Building Full-Stack Applications with Django and Angular

Angular Crash Course

  1. Overview
  2. Getting started with Angular
  3. ES6 and Type Script concepts used in Angular
  4. Angular Components Basics
  5. Angular Directives
  6. Angular Data and Events Bindings
  7. Angular Services and Dependency Injection
  8. Angular Routers

Build a Full-Stack REST API App with Django and Angular

  1. Build the Django API Endpoints with DRF.
  2. Consuming the REST API Using Angular 6 HttpClient
  3. Deploy to production server

Build a Real time Web application with WebSockets, Django and Angular

  1. Setup the WebSockets in server (Django Channels)
  2. Setup the client-side with Angular WebSockets
  3. Deploy to production server

[Optional] Data Visualization with Angular and D3

  1. D3.js overview
  2. Using D3.js with Angular

Deployment and testing of Django Applications

Deploy a Django App to production server

  1. Separate project settings
  2. Setting up the (nginx/Apache) server (for demo/test purposes)