Real Python Part 3: Advanced Web Development

with Django
Jeremy Johnson

Contents

Preface

Thank you . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

License . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

Conventions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

Course Repository . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

10

Errata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

11

2 Introduction

12

Welcome to Advanced Web Programming! . . . . . . . . . . . . . . . . . . . . .

12

Why this course? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

14

What is Software Craftsmanship? . . . . . . . . . . . . . . . . . . . . . . . . . .

15

What will you learn? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

16

What will you build? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

17

3 Software Craftsmanship

20

Testing Routes and Views . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

26

Refactoring our Tests . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

40

Testing Models . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

45

Testing Forms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

53

Testing Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

57

4 Test Driven Development

60

The TDD Workflow . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

61

Implementing TDD with Existing Code . . . . . . . . . . . . . . . . . . . . . . .

63

Django Ecommerce Project . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

64

Offense is only as good as your worst defense . . . . . . . . . . . . . . . . . . . .

74

Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

80

Exercises . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

81

5 Git Branching at a Glance

82

Git Branching . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

83

Branching Models . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

84

Enough about git branching . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

94

Exercises . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

95

6 Upgrade, Upgrade, and Upgrade some more

96

Django 1.7 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

96

The Upgrade . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

97

DiscoverRunner . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

101

Update Project Structure

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 103

Upgrading to Python 3 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 105

Python 3 Changes Things Slightly . . . . . . . . . . . . . . . . . . . . . . . . . .

119

Upgrading to PostgreSQL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 120

Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

125

Exercises . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 126
7 Graceful Degradation and Database Transactions with Django 1.7

127

What is Graceful Degradation? . . . . . . . . . . . . . . . . . . . . . . . . . . . 128

User Registration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 129
Handling Unpaid Users . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134
Improved Transaction Management

. . . . . . . . . . . . . . . . . . . . . . . .
2

137

What is a transaction? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 138

Whats wrong with transaction management prior to Django 1.6? . . . . . . . . .

139

Whats right about transaction management in Django 1.6 and above? . . . . . . .

141

SavePoints . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

147

Nested Transactions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 150

Completing the Front-end . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

152

Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

154

Exercises. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

156

8 Building a Membership Site

158

Its time to make something cool . . . . . . . . . . . . . . . . . . . . . . . . . .

A Membership Site

159

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 160

The User Stories . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

9 Bootstrap 3 and Best Effort Design

Start with the User Story

161
163

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 164

Overview of what we have . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

165

Installing Bootstrap 3 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 166

Making Bootstrap your own . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

172

HTML5 Sections and the Semantic Web

179

. . . . . . . . . . . . . . . . . . . . . .

More Bootstrap Customizations . . . . . . . . . . . . . . . . . . . . . . . . . . . 185

Custom template tags . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 192
A Note on Structure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

197

Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 201
Exercises . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 202
10 Building the Members Page

204

User Story . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 205

Update Main Template . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 206
Template 1: Showing User Info for the Current User . . . . . . . . . . . . . . . . 208
3

Gravatar Support

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 213

Template 2: Status Updating and Reporting . . . . . . . . . . . . . . . . . . . . 216

Template 3: Displaying Status Updates . . . . . . . . . . . . . . . . . . . . . . . 222
Exercises . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 225
11 REST

226

Structuring a REST API . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 227

REST for MEC . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 230
Django REST Framework (DRF)
Now Serving JSON

. . . . . . . . . . . . . . . . . . . . . . . . . .

231

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 243

Using Class-Based Views

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 250

Authentication . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 253
Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 258
Exercises . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 259
Bonus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 260
12 Django Migrations

262

The problems that Migrations Solve . . . . . . . . . . . . . . . . . . . . . . . . . 263

Getting Started with Migrations . . . . . . . . . . . . . . . . . . . . . . . . . . . 264
The Migration File . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 265
When Migrations Dont Work . . . . . . . . . . . . . . . . . . . . . . . . . . . . 269
Data Migrations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 273
Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 279
Exercises . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 280
13 AngularJS Primer

281

What we are covering . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 283

Angular for Pony Fliers (aka Django Devs) . . . . . . . . . . . . . . . . . . . . . 284
Angular vs Django - re: template tags . . . . . . . . . . . . . . . . . . . . . . . . 287
Angular Data Binding Explained

. . . . . . . . . . . . . . . . . . . . . . . . . . 288
4

Building User Polls

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 292

Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 304
Exercises . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 305
14 Djangular: Integrating Django and Angular

306

The User Polls Backend Data Model . . . . . . . . . . . . . . . . . . . . . . . . . 307

A REST Interface for User Polls . . . . . . . . . . . . . . . . . . . . . . . . . . . 309
Structural Concerns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 314
Building the Template . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 316
Loading Poll Items Dynamically . . . . . . . . . . . . . . . . . . . . . . . . . . . 323
Refactoring - progress bars . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 328
Refactoring - multiple users . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 330
Using Angular Factories . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 335
Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 339
Exercises . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 340
15 Appendix A - Solutions to Exercises

341

Software Craftsmanship . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 341

Test Driven Development . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 347
Bootstrap 3 and Best Effort Design . . . . . . . . . . . . . . . . . . . . . . . . . 354
Building the Members Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 369
REST . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 379
Django Migrations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 385
AngularJS Primer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 393
Djangular: Integrating Django and Angular . . . . . . . . . . . . . . . . . . . . . 396