How to display dynamic data tables with Python, Flask, and Jinja2

Показать описание

Learn how to render HTML tables dynamically using Python and Flask! In this video, you'll learn how to take data from your Flask app and create HTML tables with it.

-- Links --

Рекомендации по теме

Комментарии

Thanks! for some reason I had a really hard time figuring out how to do this, and an even harder time finding a useful resource explaining it. This is exactly what I needed.

alicejbbennett

Here is the body code:

<body>
<table>
<tr>
{% for header in headings %}
<th>{{ header }}</th>
{% endfor %}
</tr>

{% for row in data %}
<tr>
{% for cell in row %}
<td>{{cell}}</td>
{% endfor %}
</tr>
{% endfor %}

</table>
</body>

bilalkhann

Exactly what I wanted. I was thinking it will be extremely tricky. But you made it seem so easy. Loads of Thanks.

varunsagartheegala

finally, someone who speaks clearly and precisely !!! Thank you very much !!!!

avendanod

I’m really loving Flask even more after watching this video. This was a great intro and helped me understand Jinja2 templates. I love how they work with Flask. Now I want to implement with a database. Thank you! 🙏

pgallovich

aún no entiendo como este tipo no tiene más susbcriptores! pero con el tiempo e de esperar que este canal estalle!!!

Que buenos videos.

tapioms

Great video. Exactly, for what I was looking for! Thankyou.

bilalkhann

Hope you guys enjoyed the video! Some questions were left unanswered, so here goes:

--- Why use classes instead of targeting elements directly in CSS?

It's to do with specificity. By always using classes instead of element or id selectors, we can make sure our CSS can be overridden easily.

--- How did I create the HTML boilerplate so quickly?

In VSCode, type ! and press tab, you'll get the default boilerplate.

--- What does {% and {{ mean in Jinja2?

{% is used to create statements, like if statements, for loops. {{ is used for interpolation (to put values into the resultant string or HTML).

--- I mentioned Jinja2 macros at the end. I'll be making a video on them really soon!

tecladocode

Thanks a lot for this video. Exactly what I was looking for!

godspeed

Another great video, really like the new format. The content is straight to the point and well presented. Good work Jose.

dzheyms

You speak very clearly, thank you for this tutorial. I just subscribed 🙂

mervecengiz

Yes thanks a lot. I understand Jinja2 better now

winnieip

Thanks it's really nice and solved my problem.... you are just awesome man! explained very well.

SonuPandey-mefs

very helpful for who are from backend lol
Thank you a lot!

diogodallorto

It's not a cliché, that was an awesome video!, didn't comment immediately, had to watch again before dropping this comment.

In 11mins, you taught us this so powerful!

Awesome work Jose.
Sincerely want to be like you when I grow up 😀💪

reghaabraham

Wow, thank you so much, helped me a lot

GabrielM

absolutely brilliant! the next step is sqlalchemy methods to determine the headers/columns for a table

rje

Thanks pal, go ahead, nice and useful tutorial. I will goto search next about retrieve data from a mysql/mariadb database, and next somthing about using asynchronous events.

soldadopreciso

I have an assignment due tomorrow and ur literally saving my ass. Like you are saving my ass. Thanks

rfvcmtd

Thank you for a great video. I was finally able to make my table. But I wondering how can I make the content editable given that I am using flask and jinga. What do I need to add or learn? Thanks in advance for your response.

robertpfaff

How to display dynamic data tables with Python, Flask, and Jinja2

How to display dynamic data tables with Python, Flask, and Jinja2

Oxygen's Dynamic Data - Automatically Display Data From ACF And More

SICK Dynamic Data Display - Build your own custom dashboards

#12 Django tutorials | Passing Dynamic Data in Html part 1

The Basics of Dynamic Content in 15 Minutes

Display Dynamic Data in a Bootstrap Modal using PHP and Ajax | Pass data to the Modal example.

How to Display Dynamic Data in WP List Table on WordPress | Zeeshan Web

Fetch and Display Data Dynamically in React JS | Create dynamic table from JSON in React

Power BI Dynamic Column Naming and Display Selections #bbdevdays

How To Display Dynamic Narratives For Interactive Data - Power BI

Create Dynamic Table from JSON Data using JavaScript | Dynamically Display Data with JavaScript

Shopify Store 2.0 Dynamic Data Source For Section (Part 9)

How to create Dynamic Html Cards With JavaScript. HTML CSS new beginner project. javascript project

Visualize Your Data Like a Pro: Creating Dynamic Graphs in Google Sheets: A Step-by-Step Tutorial

How To Display Dynamic Columns Using - Pivot Table - RTF Template - Oracle Fusion SaaS - BI

Load Dynamic Data into Datatable with ajax | JQuery Datatable

How to Make Django Pages Dynamic (pass model data to templates)

How to Setup Dynamic Data Attachments in KoBoToolbox

how to create dynamic chart in php using mysql

HOW TO DISPLAY DYNAMIC IMAGE AND TEXT in Microsoft Power Apps

React JS 👉 Creating a Dynamic Table with Data Fetched from an API

Building a software part 5 - How to display dynamic values from Firebase in Flutterflow

#4 Display Dynamic Data like a Clock and Real-time Weather — Mastering Framer Code Overrides

ChartJS in React (Dynamic Data using API) | Line Chart