This course is in super-early-bird mode. We're writing and recording the course as we speak!
Learn how to build websites using HTML and TailwindCSS. Add interactivity with JavaScript and AlpineJS. Dynamically replace content with HTMX. Serve with Django, and store data in PostgreSQL.
You'll also learn about background tasks using Celery, and you'll learn to orchestrate the entire app using Docker and Docker Compose.
The app we build in this course uses 5 services:
The Django app
The Celery runner
A PostgreSQL database
A Redis database as a task queue
Flower for inspecting the Celery queue and workers
This is the complete full stack web development course, using Django 5.
If you want to build complete web projects, simply and efficiently, using modern technologies, this course is what you're looking for.
Build your back-end using Django 5
Design beautiful pages and code them with TailwindCSS
Add interactivity with AlpineJS
Dynamically change page content using HTMX
Add user authentication and email confirmation with django-allauth
Store data using PostgreSQL and understand database migrations
Implement background tasks with Celery
Use Docker and Docker Compose for local development
Deploy the complete app to Railway
Introduction
3 LESSONS
Basic HTML Structure
2 LESSONS
Common HTML Elements
6 LESSONS
HTML Forms
7 LESSONS
Semantic HTML
4 LESSONS
CSS Fundamentals
9 LESSONS
Introduction to CSS and Selectors
CSS Fundamentals: units
The Box Model: Margin, Padding, Border
What does box-sizing do?
CSS Selector Specificity
Positioning: Relative, Absolute, Fixed, Sticky
Colors, Backgrounds, and Gradients
Typography: Font Properties and Text Styling
Pseudo-classes and Pseudo-elements
CSS Flexbox and Grid
9 LESSONS
A Full Python Refresher
47 LESSONS
Introduction to this section
Variables in Python
Coding Exercise 1: variables
String formatting in Python
Getting user input
Writing our first Python app
Lists, tuples, and sets
Advanced set operations
Coding Exercise 2: lists, tuples and sets
Booleans in Python
If statements
The 'in' keyword in Python
If statements with the 'in' keyword
Loops in Python
Coding Exercise 3: flow control-loops and ifs
List comprehensions in Python
Dictionaries
Destructuring variables
Functions in Python
Function arguments and parameters
Default parameter values
Functions returning values
Coding Exercise 4: functions
Lambda functions in Python
Dictionary comprehensions
Coding Exercise 5: dictionaries and students
Unpacking arguments
Unpacking keyword arguments
Object-Oriented Programming in Python
Magic methods: str and repr
Coding Exercise 6: classes and objects
@classmethod and @staticmethod
Coding Exercise 7: @classmethod and @staticmethod
Class inheritance
Class composition
Type hinting in Python 3.5+
Imports in Python
Relative imports in Python
Errors in Python
Custom error classes
First-class functions
Simple decorators in Python
The 'at' syntax for decorators
Decorating functions with parameters
Decorators with parameters
Mutability in Python
Mutable default parameters (and why they're a bad idea)
Django Project Configuration
15 LESSONS
Introduction to this section
How to install pyenv and Python on Windows
How to install pyenv and Python on Mac
How to install Poetry on Windows
How to install Poetry on Mac
How to install VSCode on Windows
How to install VSCode on Mac
How to install dependencies on Windows
How to install dependencies on Mac
How to start a Django project on Windows
How to start a Django project on Mac
Migrations, superusers, and admin panel on Windows
Migrations, superusers, and admin panel on Mac
How to create a Django app on Windows
How to create a Django app on Mac
A Hello World App
3 LESSONS
The Course App
12 LESSONS
Intro to this section
How to create and register Django models
How to create and run database migrations
Showing all our articles in the homepage
Introduction to Django forms
What are cookies?
What are CSRF attacks?
Creating a view that uses a form
Creating articles with Class-Based Views
Adding the other endpoints with CBVs
Cleaning up our article URLs
HTML Escaping in Django
The Course App — Part 2
9 LESSONS
Intro to this section
Creating a base template
Updating our templates to extend the base template
What are Django filters?
Adding navigation between templates
Rendering things conditionally
Calculating word count dynamically
Adding the word count to the templates
How to customize the Django admin panel
Running with Docker
3 LESSONS
App Setup Improvements
3 LESSONS
Django authentication and social-sign on with django-allauth
15 LESSONS
Introduction to django-allauth
How to add a user relationship to a Django model
How to set the article creator in the form of a Class-Based View
How to add log in and log out pages with Django
How to require login in Django CBVs
How to set up django-allauth
How to use django-allauth URLs in our project
How to set up social authentication with django-allauth
How to create a GitHub OAuth app
How to add new social apps with django-allauth
How to set up Django to log in with email instead of username with allauth
How to customize the UserProfile admin page
How do translations and localization work in Django?
How to add translations to our Django admin panel
Create a custom UserManager to use the email field in Django
More article features and markdown editor
5 LESSONS
Running with Docker Compose
5 LESSONS
Styling with TailwindCSS
31 LESSONS
How to install NodeJS on macOS
How to install NodeJS on Windows
How to install and set up TailwindCSS
Optional TailwindCSS plugins
Automatic browser reloading with django-browser-reload
Adding django_widget_tweaks
Creating button styles with TailwindCSS
Styling our navigation bar with TailwindCSS
Customize your TailwindCSS theme by creating a box shadow underline
Changing menu styles depending on which page we're on
Styling the user's dashboard
Styling the article delete form
Refactoring the base_form layout template
Styling the article form templates
Styling the log in page
A look at the django-allauth element structure
Styling the social sign on provider element
Styling the errors list in our login page
The key features of our landing and signup page
Creating a responsive structure for our sigding page
Styling the signup form in our landing page
Styling form errors in the signup page
HTML detail element for disclosures with styling
Improvements to our base.html to work across apps
Styling the main allauth layout
Allauth elements: styling the button element
Allauth elements: styling the form and fields
Allauth elements: styling the titles
Some final improvements and styles in base.html
Making the landing page our signup page
Where we are at the end of this section
Getting started with AlpineJS
5 LESSONS
Message flashing with Django
4 LESSONS
Search and pagination
7 LESSONS
Django and HTMX
8 LESSONS
Introduction to this section
What is HTMX?
How to implement modal windows
Active search with a ListView in 4 lines of code
Adding a request indicator with HTMX, SVGs, and TailwindCSS
How to add animations using TailwindCSS
How to disable elements while requests are happening
Handling browser history changes with HTMX
19 More Sections
Jose Salvatierra
Hi, I'm Jose! I love helping students learn to code and master software development. I've been teaching online for over 7 years, and I founded Teclado to bring software development to everyone—my objective is for you to truly understand everything that goes on behind the scenes.
Basic
- Lifetime access
-
25 course sections covering HTML, CSS, Python, and Django
Complete
- Lifetime access
-
Python project set-up with pyenv and Poetry
-
Foundational web development knowledge (HTML, CSS, and JS)
-
Painless Django project configuration and settings
-
Run the app and database with Docker and Docker Compose
-
Add user authentication with email confirmation
-
Model relationships and run database migrations
-
Deploy all your web app services so anybody can access them
-
Integrate AI tools to produce content for your users
-
Improve the responsiveness and performance of your app with background tasks using Celery
-
Test your web app using browser testing with Playright
-
Add Continuous Integration using GitHub Actions to make sure your app works before deploying
All courses
-
All complete course sections, including AI integration, background tasks, automated tests, and continuous integration
-
Access to our full collection of premium courses
-
Over 140 hours of video content and hundreds of lectures
-
Access new courses when they are published
What does 'early access' mean?
Is there a free trial available?
How does the course work? When does it start and end?
Do I get lifetime access if I buy the course?
Is this course suitable for beginners?
What support is available while taking the course?