Modern apps with Django, HTMX, Tailwind CSS and Alpine.js with Andrej Baranovskij - DCUS 2022

Django

Discover how to build modern web applications with Django, HTMX, Tailwind CSS, and Alpine.js in this hands-on talk, covering models, forms, partial requests, and more.

Key takeaways

Modern web applications with Django, HTMX, Tailwind CSS, and Alpine.js: Web applications are becoming increasingly interactive, and we need libraries like HTMX to facilitate this interaction.
Defining models in Django: Models are the foundation of Django applications. The Employee model is defined with fields like first_name, last_name, email, hire_date, and salary.
Check constraints and validation: Check constraints are used to validate data against a set of rules. In this case, the email field must be unique.
Forms in Django: Forms are used to interact with the user and validate input data. The EmployeeForm is defined with fields like first_name, last_name, email, and salary.
Use of HTMX for partial requests: HTMX is used to execute partial requests without reloading the whole page. This is achieved by defining an event on the form and the target where the response should be inserted.
Use of Tailwind CSS for styling: Tailwind CSS is used for styling the UI components. It provides a utility-first approach to styling.
Use of Alpine.js for interactivity: Alpine.js is used to implement interactivity in the UI components, such as hiding and showing elements.
Error handling: Error handling is implemented using Django’s validation mechanisms. If an error occurs, the response will include the error message.
Refreshing table data: HTMX is used to refresh the table data when an update is made.
Using Flowbyte for UI components: Flowbyte is used to create reusable UI components, such as tables and forms.
Everyday practicality: The application is designed to be simple and practical, making it easy to use and maintain.

Modern apps with Django, HTMX, Tailwind CSS and Alpine.js with Andrej Baranovskij - DCUS 2022

More talks