loading...
Cover image for Use Tailwind On A Template - Building SaaS #43

Use Tailwind On A Template - Building SaaS #43

mblayman profile image Matt Layman Originally published at mattlayman.com ・1 min read

Building SaaS (48 Part Series)

1) Building SaaS with Python and Django #1 2) Reporting scraped data - Building SaaS #2 3 ... 46 3) Multiple Stripe plans - Building SaaS #3 4) Using a background scheduler - Building SaaS #4 5) Updating data models - Building SaaS #5 6) Third party integration modeling - Building SaaS #6 7) Displaying third party data - Building SaaS #7 8) Connecting third party services - Building SaaS #8 9) Finishing third party integration - Building SaaS #9 10) Admin dashboards - Building SaaS #10 11) Semi-automated tasks - Building SaaS #11 12) Automation aides - Building SaaS #12 13) Deploying with Ansible - Building SaaS #13 14) Ansible Cranked to 11 - Building SaaS #14 15) Feature Flags with Django Waffle - Building SaaS #15 16) Feature Flags in Action - Building SaaS #16 17) Canceling Stripe Subscriptions - Building SaaS #17 18) Completing Account Deactivation - Building SaaS #18 19) Pip-tools and App Packaging - Building SaaS #19 20) Making a Shiv App - Building SaaS #20 21) Shiv zipapps and CI - Building SaaS #21 22) Upload to S3 with CircleCI orbs - Building SaaS #22 23) It's Alive! A Django Shiv app - Building SaaS #23 24) In the Guts of a Shiv App - Building SaaS #24 25) It's Permissions, Dummy! - Building SaaS #25 26) Connecting Shiv Apps with Ansible - Building SaaS #26 27) Plug the Shiv App Into Nginx - Building SaaS #27 28) Webpack and collectstatic in CI - Building SaaS #28 29) Add Static Assets to Deployment - Building SaaS #29 30) Ripping Out Node.js - Building SaaS #30 31) Celery In A Shiv App - Building SaaS #31 32) wal-e Postgres Backups - Building SaaS #32 33) Get Out, Git! - Building SaaS #33 34) Bring in the WhiteNoise, Bring in Da Funk - Building SaaS #34 35) Deploying WhiteNoise - Building SaaS #35 36) Configurama - Building SaaS #36 37) Lessons From A Failed SaaS - Building SaaS #37 38) New Project, Who Dis? - Building SaaS #38 39) django-environ and django-debug-toolbar - Building SaaS #39 40) Make A Custom User Model - Building SaaS #40 41) User Accounts With django-allauth - Building SaaS #41 42) Add Styles To Templates - Building SaaS #42 43) Use Tailwind On A Template - Building SaaS #43 44) Fast Forms With UpdateView - Building SaaS #44 45) Templates and Logic - Building SaaS #45 46) A Week At A Time - Building SaaS #46 47) How To Style Sign Up - Building SaaS #47 48) Onboarding - Building SaaS #48

In this episode, we worked on the template styles of a tabular view. We also made some context data adjustments to include header rows and column highlighting.

I started by showing the template that I already created. It was rough.

Before changing anything, I took the time to explain the modeling in use for this project and the context passed to the view. The models mostly form a tree in the a hierarchy. Here is the top to bottom list of the models in use:

SchoolYear -> GradeLevel -> Course -> CourseTask -> Coursework

The view is showing a lot of data in a tabular structure so I walked through the logic to put that together in the view.

After explaining the data, I added week date headers to the table. Then we used Tailwind to set some styling on them.

The next task was to make the table aware of week dates to show column highlighting of the current day. We added the date to each cell to make it possible to test if it should be highlighted. I also made some style changes to round off the corners of the columns. This small detail actually required a suprising amount of template adjustment.

At the end, I discussed the next pieces that will be going into the app.

This article first appeared on mattlayman.com.

Building SaaS (48 Part Series)

1) Building SaaS with Python and Django #1 2) Reporting scraped data - Building SaaS #2 3 ... 46 3) Multiple Stripe plans - Building SaaS #3 4) Using a background scheduler - Building SaaS #4 5) Updating data models - Building SaaS #5 6) Third party integration modeling - Building SaaS #6 7) Displaying third party data - Building SaaS #7 8) Connecting third party services - Building SaaS #8 9) Finishing third party integration - Building SaaS #9 10) Admin dashboards - Building SaaS #10 11) Semi-automated tasks - Building SaaS #11 12) Automation aides - Building SaaS #12 13) Deploying with Ansible - Building SaaS #13 14) Ansible Cranked to 11 - Building SaaS #14 15) Feature Flags with Django Waffle - Building SaaS #15 16) Feature Flags in Action - Building SaaS #16 17) Canceling Stripe Subscriptions - Building SaaS #17 18) Completing Account Deactivation - Building SaaS #18 19) Pip-tools and App Packaging - Building SaaS #19 20) Making a Shiv App - Building SaaS #20 21) Shiv zipapps and CI - Building SaaS #21 22) Upload to S3 with CircleCI orbs - Building SaaS #22 23) It's Alive! A Django Shiv app - Building SaaS #23 24) In the Guts of a Shiv App - Building SaaS #24 25) It's Permissions, Dummy! - Building SaaS #25 26) Connecting Shiv Apps with Ansible - Building SaaS #26 27) Plug the Shiv App Into Nginx - Building SaaS #27 28) Webpack and collectstatic in CI - Building SaaS #28 29) Add Static Assets to Deployment - Building SaaS #29 30) Ripping Out Node.js - Building SaaS #30 31) Celery In A Shiv App - Building SaaS #31 32) wal-e Postgres Backups - Building SaaS #32 33) Get Out, Git! - Building SaaS #33 34) Bring in the WhiteNoise, Bring in Da Funk - Building SaaS #34 35) Deploying WhiteNoise - Building SaaS #35 36) Configurama - Building SaaS #36 37) Lessons From A Failed SaaS - Building SaaS #37 38) New Project, Who Dis? - Building SaaS #38 39) django-environ and django-debug-toolbar - Building SaaS #39 40) Make A Custom User Model - Building SaaS #40 41) User Accounts With django-allauth - Building SaaS #41 42) Add Styles To Templates - Building SaaS #42 43) Use Tailwind On A Template - Building SaaS #43 44) Fast Forms With UpdateView - Building SaaS #44 45) Templates and Logic - Building SaaS #45 46) A Week At A Time - Building SaaS #46 47) How To Style Sign Up - Building SaaS #47 48) Onboarding - Building SaaS #48

Posted on Jun 4 by:

mblayman profile

Matt Layman

@mblayman

Matt Layman is a software engineer from Frederick, MD. He is an open source software maintainer and advocate for Python.

Discussion

markdown guide