--- title: Episode 17: Adding Categories to the Flutter Product Catalog description: Episode 17 of a Flutter tutorial series extends a product catalog app by adding category labels to the Product data model and redesigning product cards. A... canonical: https://daily.dev/posts/episode-17-adding-categories-to-the-flutter-product-catalog-eg6te6tkd twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: Episode 17: Adding Categories to the Flutter Product Catalog | daily.dev og:description: Episode 17 of a Flutter tutorial series extends a product catalog app by adding category labels to the Product data model and redesigning product cards. A... og:url: https://daily.dev/posts/episode-17-adding-categories-to-the-flutter-product-catalog-eg6te6tkd og:image: https://api.daily.dev/og/posts/Eg6tE6TKd.png og:image:alt: Episode 17: Adding Categories to the Flutter Product Catalog og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # Episode 17: Adding Categories to the Flutter Product Catalog **[Medium](https://daily.dev/sources/medium_js)** · 6 min read · 1 upvotes · 0 comments ## Summary Episode 17 of a Flutter tutorial series extends a product catalog app by adding category labels to the Product data model and redesigning product cards. A Python script patches main.dart to add a category field to the Product class, assign categories (Audio, Wearables, Photography) to each product, and update the card builder with improved layout including styled category badges, icon containers, and better spacing. The reusable card structure from the previous episode is preserved while the UI becomes more informative. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Similar posts on daily.dev - [Episode 18: Building a Searchable and Filterable Product Grid in Flutter](https://daily.dev/posts/episode-18-building-a-searchable-and-filterable-product-grid-in-flutter-eu54rjay6) · Medium · 0 upvotes · 0 comments - [Episode 24: Editing and Deleting Saved Products in Flutter](https://daily.dev/posts/episode-24-editing-and-deleting-saved-products-in-flutter-foq4chiqk) · Medium · 1 upvotes · 0 comments - [Episode 19: Opening a Product Detail Page From the Flutter Grid](https://daily.dev/posts/episode-19-opening-a-product-detail-page-from-the-flutter-grid-naw7hhi4f) · Medium · 0 upvotes · 0 comments - [Episode 20: Adding Favorites and Bottom Navigation to the Flutter Catalog](https://daily.dev/posts/episode-20-adding-favorites-and-bottom-navigation-to-the-flutter-catalog-gynquujmo) · Medium · 0 upvotes · 0 comments - [Mobile App Development with Dart and Flutter](https://daily.dev/posts/mobile-app-development-with-dart-and-flutter-aqc5yr6tj) · freeCodeCamp · 16 upvotes · 1 comments --- Tags: [#mobile](https://daily.dev/tags/mobile), [#flutter](https://daily.dev/tags/flutter), [#dart](https://daily.dev/tags/dart) [View this post on daily.dev](https://daily.dev/posts/episode-17-adding-categories-to-the-flutter-product-catalog-eg6te6tkd) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"Episode 17: Adding Categories to the Flutter Product Catalog","url":"https://daily.dev/posts/episode-17-adding-categories-to-the-flutter-product-catalog-eg6te6tkd","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/episode-17-adding-categories-to-the-flutter-product-catalog-eg6te6tkd"},"datePublished":"2026-07-20T07:32:23.691Z","dateModified":"2026-09-13T18:27:11.813Z","description":"Episode 17 of a Flutter tutorial series extends a product catalog app by adding category labels to the Product data model and redesigning product cards. A...","image":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/5504c9de01650db1281f98a71d459118?_a=AQAEuop","thumbnailUrl":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/5504c9de01650db1281f98a71d459118?_a=AQAEuop","isAccessibleForFree":true,"articleSection":"Medium","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"Medium","logo":"https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/medium","url":"https://daily.dev/sources/medium_js"},"commentCount":0,"discussionUrl":"https://daily.dev/posts/episode-17-adding-categories-to-the-flutter-product-catalog-eg6te6tkd","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":1},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"mobile,flutter,dart","timeRequired":"PT6M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Medium","item":"https://daily.dev/sources/medium_js"},{"@type":"ListItem","position":3,"name":"Episode 17: Adding Categories to the Flutter Product Catalog"}]} ```