flutter-pro-max-cli 1.0.0

package/assets/.shared/data/icons.csv

@@ -0,0 +1,101 @@
+STT,Category,Icon Name,Keywords,Library,Import Code,Usage,Best For,Style
+1,Navigation,menu,hamburger menu navigation toggle bars,Lucide,import { Menu } from 'lucide-react',<Menu />,Mobile navigation drawer toggle sidebar,Outline
+2,Navigation,arrow-left,back previous return navigate,Lucide,import { ArrowLeft } from 'lucide-react',<ArrowLeft />,Back button breadcrumb navigation,Outline
+3,Navigation,arrow-right,next forward continue navigate,Lucide,import { ArrowRight } from 'lucide-react',<ArrowRight />,Forward button next step CTA,Outline
+4,Navigation,chevron-down,dropdown expand accordion select,Lucide,import { ChevronDown } from 'lucide-react',<ChevronDown />,Dropdown toggle accordion header,Outline
+5,Navigation,chevron-up,collapse close accordion minimize,Lucide,import { ChevronUp } from 'lucide-react',<ChevronUp />,Accordion collapse minimize,Outline
+6,Navigation,home,homepage main dashboard start,Lucide,import { Home } from 'lucide-react',<Home />,Home navigation main page,Outline
+7,Navigation,x,close cancel dismiss remove exit,Lucide,import { X } from 'lucide-react',<X />,Modal close dismiss button,Outline
+8,Navigation,external-link,open new tab external link,Lucide,import { ExternalLink } from 'lucide-react',<ExternalLink />,External link indicator,Outline
+9,Action,plus,add create new insert,Lucide,import { Plus } from 'lucide-react',<Plus />,Add button create new item,Outline
+10,Action,minus,remove subtract decrease delete,Lucide,import { Minus } from 'lucide-react',<Minus />,Remove item quantity decrease,Outline
+11,Action,trash-2,delete remove discard bin,Lucide,import { Trash2 } from 'lucide-react',<Trash2 />,Delete action destructive,Outline
+12,Action,edit,pencil modify change update,Lucide,import { Edit } from 'lucide-react',<Edit />,Edit button modify content,Outline
+13,Action,save,disk store persist save,Lucide,import { Save } from 'lucide-react',<Save />,Save button persist changes,Outline
+14,Action,download,export save file download,Lucide,import { Download } from 'lucide-react',<Download />,Download file export,Outline
+15,Action,upload,import file attach upload,Lucide,import { Upload } from 'lucide-react',<Upload />,Upload file import,Outline
+16,Action,copy,duplicate clipboard paste,Lucide,import { Copy } from 'lucide-react',<Copy />,Copy to clipboard,Outline
+17,Action,share,social distribute send,Lucide,import { Share } from 'lucide-react',<Share />,Share button social,Outline
+18,Action,search,find lookup filter query,Lucide,import { Search } from 'lucide-react',<Search />,Search input bar,Outline
+19,Action,filter,sort refine narrow options,Lucide,import { Filter } from 'lucide-react',<Filter />,Filter dropdown sort,Outline
+20,Action,settings,gear cog preferences config,Lucide,import { Settings } from 'lucide-react',<Settings />,Settings page configuration,Outline
+21,Status,check,success done complete verified,Lucide,import { Check } from 'lucide-react',<Check />,Success state checkmark,Outline
+22,Status,check-circle,success verified approved complete,Lucide,import { CheckCircle } from 'lucide-react',<CheckCircle />,Success badge verified,Outline
+23,Status,x-circle,error failed cancel rejected,Lucide,import { XCircle } from 'lucide-react',<XCircle />,Error state failed,Outline
+24,Status,alert-triangle,warning caution attention danger,Lucide,import { AlertTriangle } from 'lucide-react',<AlertTriangle />,Warning message caution,Outline
+25,Status,alert-circle,info notice information help,Lucide,import { AlertCircle } from 'lucide-react',<AlertCircle />,Info notice alert,Outline
+26,Status,info,information help tooltip details,Lucide,import { Info } from 'lucide-react',<Info />,Information tooltip help,Outline
+27,Status,loader,loading spinner processing wait,Lucide,import { Loader } from 'lucide-react',<Loader className="animate-spin" />,Loading state spinner,Outline
+28,Status,clock,time schedule pending wait,Lucide,import { Clock } from 'lucide-react',<Clock />,Pending time schedule,Outline
+29,Communication,mail,email message inbox letter,Lucide,import { Mail } from 'lucide-react',<Mail />,Email contact inbox,Outline
+30,Communication,message-circle,chat comment bubble conversation,Lucide,import { MessageCircle } from 'lucide-react',<MessageCircle />,Chat comment message,Outline
+31,Communication,phone,call mobile telephone contact,Lucide,import { Phone } from 'lucide-react',<Phone />,Phone contact call,Outline
+32,Communication,send,submit dispatch message airplane,Lucide,import { Send } from 'lucide-react',<Send />,Send message submit,Outline
+33,Communication,bell,notification alert ring reminder,Lucide,import { Bell } from 'lucide-react',<Bell />,Notification bell alert,Outline
+34,User,user,profile account person avatar,Lucide,import { User } from 'lucide-react',<User />,User profile account,Outline
+35,User,users,team group people members,Lucide,import { Users } from 'lucide-react',<Users />,Team group members,Outline
+36,User,user-plus,add invite new member,Lucide,import { UserPlus } from 'lucide-react',<UserPlus />,Add user invite,Outline
+37,User,log-in,signin authenticate enter,Lucide,import { LogIn } from 'lucide-react',<LogIn />,Login signin,Outline
+38,User,log-out,signout exit leave logout,Lucide,import { LogOut } from 'lucide-react',<LogOut />,Logout signout,Outline
+39,Media,image,photo picture gallery thumbnail,Lucide,import { Image } from 'lucide-react',<Image />,Image photo gallery,Outline
+40,Media,video,movie film play record,Lucide,import { Video } from 'lucide-react',<Video />,Video player media,Outline
+41,Media,play,start video audio media,Lucide,import { Play } from 'lucide-react',<Play />,Play button video audio,Outline
+42,Media,pause,stop halt video audio,Lucide,import { Pause } from 'lucide-react',<Pause />,Pause button media,Outline
+43,Media,volume-2,sound audio speaker music,Lucide,import { Volume2 } from 'lucide-react',<Volume2 />,Volume audio sound,Outline
+44,Media,mic,microphone record voice audio,Lucide,import { Mic } from 'lucide-react',<Mic />,Microphone voice record,Outline
+45,Media,camera,photo capture snapshot picture,Lucide,import { Camera } from 'lucide-react',<Camera />,Camera photo capture,Outline
+46,Commerce,shopping-cart,cart checkout basket buy,Lucide,import { ShoppingCart } from 'lucide-react',<ShoppingCart />,Shopping cart e-commerce,Outline
+47,Commerce,shopping-bag,purchase buy store bag,Lucide,import { ShoppingBag } from 'lucide-react',<ShoppingBag />,Shopping bag purchase,Outline
+48,Commerce,credit-card,payment card checkout stripe,Lucide,import { CreditCard } from 'lucide-react',<CreditCard />,Payment credit card,Outline
+49,Commerce,dollar-sign,money price currency cost,Lucide,import { DollarSign } from 'lucide-react',<DollarSign />,Price money currency,Outline
+50,Commerce,tag,label price discount sale,Lucide,import { Tag } from 'lucide-react',<Tag />,Price tag label,Outline
+51,Commerce,gift,present reward bonus offer,Lucide,import { Gift } from 'lucide-react',<Gift />,Gift reward offer,Outline
+52,Commerce,percent,discount sale offer promo,Lucide,import { Percent } from 'lucide-react',<Percent />,Discount percentage sale,Outline
+53,Data,bar-chart,analytics statistics graph metrics,Lucide,import { BarChart } from 'lucide-react',<BarChart />,Bar chart analytics,Outline
+54,Data,pie-chart,statistics distribution breakdown,Lucide,import { PieChart } from 'lucide-react',<PieChart />,Pie chart distribution,Outline
+55,Data,trending-up,growth increase positive trend,Lucide,import { TrendingUp } from 'lucide-react',<TrendingUp />,Growth trend positive,Outline
+56,Data,trending-down,decline decrease negative trend,Lucide,import { TrendingDown } from 'lucide-react',<TrendingDown />,Decline trend negative,Outline
+57,Data,activity,pulse heartbeat monitor live,Lucide,import { Activity } from 'lucide-react',<Activity />,Activity monitor pulse,Outline
+58,Data,database,storage server data backend,Lucide,import { Database } from 'lucide-react',<Database />,Database storage,Outline
+59,Files,file,document page paper doc,Lucide,import { File } from 'lucide-react',<File />,File document,Outline
+60,Files,file-text,document text page article,Lucide,import { FileText } from 'lucide-react',<FileText />,Text document article,Outline
+61,Files,folder,directory organize group files,Lucide,import { Folder } from 'lucide-react',<Folder />,Folder directory,Outline
+62,Files,folder-open,expanded browse files view,Lucide,import { FolderOpen } from 'lucide-react',<FolderOpen />,Open folder browse,Outline
+63,Files,paperclip,attachment attach file link,Lucide,import { Paperclip } from 'lucide-react',<Paperclip />,Attachment paperclip,Outline
+64,Files,link,url hyperlink chain connect,Lucide,import { Link } from 'lucide-react',<Link />,Link URL hyperlink,Outline
+65,Files,clipboard,paste copy buffer notes,Lucide,import { Clipboard } from 'lucide-react',<Clipboard />,Clipboard paste,Outline
+66,Layout,grid,tiles gallery layout dashboard,Lucide,import { Grid } from 'lucide-react',<Grid />,Grid layout gallery,Outline
+67,Layout,list,rows table lines items,Lucide,import { List } from 'lucide-react',<List />,List view rows,Outline
+68,Layout,columns,layout split dual sidebar,Lucide,import { Columns } from 'lucide-react',<Columns />,Column layout split,Outline
+69,Layout,maximize,fullscreen expand enlarge zoom,Lucide,import { Maximize } from 'lucide-react',<Maximize />,Fullscreen maximize,Outline
+70,Layout,minimize,reduce shrink collapse exit,Lucide,import { Minimize } from 'lucide-react',<Minimize />,Minimize reduce,Outline
+71,Layout,sidebar,panel drawer navigation menu,Lucide,import { Sidebar } from 'lucide-react',<Sidebar />,Sidebar panel,Outline
+72,Social,heart,like love favorite wishlist,Lucide,import { Heart } from 'lucide-react',<Heart />,Like favorite love,Outline
+73,Social,star,rating review favorite bookmark,Lucide,import { Star } from 'lucide-react',<Star />,Star rating favorite,Outline
+74,Social,thumbs-up,like approve agree positive,Lucide,import { ThumbsUp } from 'lucide-react',<ThumbsUp />,Like approve thumb,Outline
+75,Social,thumbs-down,dislike disapprove disagree negative,Lucide,import { ThumbsDown } from 'lucide-react',<ThumbsDown />,Dislike disapprove,Outline
+76,Social,bookmark,save later favorite mark,Lucide,import { Bookmark } from 'lucide-react',<Bookmark />,Bookmark save,Outline
+77,Social,flag,report mark important highlight,Lucide,import { Flag } from 'lucide-react',<Flag />,Flag report,Outline
+78,Device,smartphone,mobile phone device touch,Lucide,import { Smartphone } from 'lucide-react',<Smartphone />,Mobile smartphone,Outline
+79,Device,tablet,ipad device touch screen,Lucide,import { Tablet } from 'lucide-react',<Tablet />,Tablet device,Outline
+80,Device,monitor,desktop screen computer display,Lucide,import { Monitor } from 'lucide-react',<Monitor />,Desktop monitor,Outline
+81,Device,laptop,notebook computer portable device,Lucide,import { Laptop } from 'lucide-react',<Laptop />,Laptop computer,Outline
+82,Device,printer,print document output paper,Lucide,import { Printer } from 'lucide-react',<Printer />,Printer print,Outline
+83,Security,lock,secure password protected private,Lucide,import { Lock } from 'lucide-react',<Lock />,Lock secure,Outline
+84,Security,unlock,open access unsecure public,Lucide,import { Unlock } from 'lucide-react',<Unlock />,Unlock open,Outline
+85,Security,shield,protection security safe guard,Lucide,import { Shield } from 'lucide-react',<Shield />,Shield protection,Outline
+86,Security,key,password access unlock login,Lucide,import { Key } from 'lucide-react',<Key />,Key password,Outline
+87,Security,eye,view show visible password,Lucide,import { Eye } from 'lucide-react',<Eye />,Show password view,Outline
+88,Security,eye-off,hide invisible password hidden,Lucide,import { EyeOff } from 'lucide-react',<EyeOff />,Hide password,Outline
+89,Location,map-pin,location marker place address,Lucide,import { MapPin } from 'lucide-react',<MapPin />,Location pin marker,Outline
+90,Location,map,directions navigate geography location,Lucide,import { Map } from 'lucide-react',<Map />,Map directions,Outline
+91,Location,navigation,compass direction pointer arrow,Lucide,import { Navigation } from 'lucide-react',<Navigation />,Navigation compass,Outline
+92,Location,globe,world international global web,Lucide,import { Globe } from 'lucide-react',<Globe />,Globe world,Outline
+93,Time,calendar,date schedule event appointment,Lucide,import { Calendar } from 'lucide-react',<Calendar />,Calendar date,Outline
+94,Time,refresh-cw,reload sync update refresh,Lucide,import { RefreshCw } from 'lucide-react',<RefreshCw />,Refresh reload,Outline
+95,Time,rotate-ccw,undo back revert history,Lucide,import { RotateCcw } from 'lucide-react',<RotateCcw />,Undo revert,Outline
+96,Time,rotate-cw,redo forward repeat history,Lucide,import { RotateCw } from 'lucide-react',<RotateCw />,Redo forward,Outline
+97,Development,code,develop programming syntax html,Lucide,import { Code } from 'lucide-react',<Code />,Code development,Outline
+98,Development,terminal,console cli command shell,Lucide,import { Terminal } from 'lucide-react',<Terminal />,Terminal console,Outline
+99,Development,git-branch,version control branch merge,Lucide,import { GitBranch } from 'lucide-react',<GitBranch />,Git branch,Outline
+100,Development,github,repository code open source,Lucide,import { Github } from 'lucide-react',<Github />,GitHub repository,Outline

package/assets/.shared/data/landing.csv

@@ -0,0 +1,31 @@
+No,Pattern Name,Keywords,Section Order,Primary CTA Placement,Color Strategy,Recommended Effects,Conversion Optimization
+1,Hero + Features + CTA,"hero, hero-centric, features, feature-rich, cta, call-to-action","1. Hero with headline/image, 2. Value prop, 3. Key features (3-5), 4. CTA section, 5. Footer",Hero (sticky) + Bottom,Hero: Brand primary or vibrant. Features: Card bg #FAFAFA. CTA: Contrasting accent color,"Hero parallax, feature card hover lift, CTA glow on hover",Deep CTA placement. Use contrasting color (at least 7:1 contrast ratio). Sticky navbar CTA.
+2,Hero + Testimonials + CTA,"hero, testimonials, social-proof, trust, reviews, cta","1. Hero, 2. Problem statement, 3. Solution overview, 4. Testimonials carousel, 5. CTA",Hero (sticky) + Post-testimonials,"Hero: Brand color. Testimonials: Light bg #F5F5F5. Quotes: Italic, muted color #666. CTA: Vibrant","Testimonial carousel slide animations, quote marks animations, avatar fade-in",Social proof before CTA. Use 3-5 testimonials. Include photo + name + role. CTA after social proof.
+3,Product Demo + Features,"demo, product-demo, features, showcase, interactive","1. Hero, 2. Product video/mockup (center), 3. Feature breakdown per section, 4. Comparison (optional), 5. CTA",Video center + CTA right/bottom,Video surround: Brand color overlay. Features: Icon color #0080FF. Text: Dark #222,"Video play button pulse, feature scroll reveals, demo interaction highlights",Embedded product demo increases engagement. Use interactive mockup if possible. Auto-play video muted.
+4,Minimal Single Column,"minimal, simple, direct, single-column, clean","1. Hero headline, 2. Short description, 3. Benefit bullets (3 max), 4. CTA, 5. Footer","Center, large CTA button",Minimalist: Brand + white #FFFFFF + accent. Buttons: High contrast 7:1+. Text: Black/Dark grey,Minimal hover effects. Smooth scroll. CTA scale on hover (subtle),Single CTA focus. Large typography. Lots of whitespace. No nav clutter. Mobile-first.
+5,Funnel (3-Step Conversion),"funnel, conversion, steps, wizard, onboarding","1. Hero, 2. Step 1 (problem), 3. Step 2 (solution), 4. Step 3 (action), 5. CTA progression",Each step: mini-CTA. Final: main CTA,"Step colors: 1 (Red/Problem), 2 (Orange/Process), 3 (Green/Solution). CTA: Brand color","Step number animations, progress bar fill, step transitions smooth scroll",Progressive disclosure. Show only essential info per step. Use progress indicators. Multiple CTAs.
+6,Comparison Table + CTA,"comparison, table, compare, versus, cta","1. Hero, 2. Problem intro, 3. Comparison table (product vs competitors), 4. Pricing (optional), 5. CTA",Table: Right column. CTA: Below table,Table: Alternating rows (white/light grey). Your product: Highlight #FFFACD (light yellow) or green. Text: Dark,"Table row hover highlight, price toggle animations, feature checkmark animations",Use comparison to show unique value. Highlight your product row. Include 'free trial' in pricing row.
+7,Lead Magnet + Form,"lead, form, signup, capture, email, magnet","1. Hero (benefit headline), 2. Lead magnet preview (ebook cover, checklist, etc), 3. Form (minimal fields), 4. CTA submit",Form CTA: Submit button,Lead magnet: Professional design. Form: Clean white bg. Inputs: Light border #CCCCCC. CTA: Brand color,"Form focus state animations, input validation animations, success confirmation animation",Form fields ≤ 3 for best conversion. Offer valuable lead magnet preview. Show form submission progress.
+8,Pricing Page + CTA,"pricing, plans, tiers, comparison, cta","1. Hero (pricing headline), 2. Price comparison cards, 3. Feature comparison table, 4. FAQ section, 5. Final CTA",Each card: CTA button. Sticky CTA in nav,"Free: Grey, Starter: Blue, Pro: Green/Gold, Enterprise: Dark. Cards: 1px border, shadow","Price toggle animation (monthly/yearly), card comparison highlight, FAQ accordion open/close",Recommend starter plan (pre-select/highlight). Show annual discount (20-30%). Use FAQs to address concerns.
+9,Video-First Hero,"video, hero, media, visual, engaging","1. Hero with video background, 2. Key features overlay, 3. Benefits section, 4. CTA",Overlay on video (center/bottom) + Bottom section,Dark overlay 60% on video. Brand accent for CTA. White text on dark.,"Video autoplay muted, parallax scroll, text fade-in on scroll",86% higher engagement with video. Add captions for accessibility. Compress video for performance.
+10,Scroll-Triggered Storytelling,"storytelling, scroll, narrative, story, immersive","1. Intro hook, 2. Chapter 1 (problem), 3. Chapter 2 (journey), 4. Chapter 3 (solution), 5. Climax CTA",End of each chapter (mini) + Final climax CTA,Progressive reveal. Each chapter has distinct color. Building intensity.,"ScrollTrigger animations, parallax layers, progressive disclosure, chapter transitions",Narrative increases time-on-page 3x. Use progress indicator. Mobile: simplify animations.
+11,AI Personalization Landing,"ai, personalization, smart, recommendation, dynamic","1. Dynamic hero (personalized), 2. Relevant features, 3. Tailored testimonials, 4. Smart CTA",Context-aware placement based on user segment,Adaptive based on user data. A/B test color variations per segment.,"Dynamic content swap, fade transitions, personalized product recommendations",20%+ conversion with personalization. Requires analytics integration. Fallback for new users.
+12,Waitlist/Coming Soon,"waitlist, coming-soon, launch, early-access, notify","1. Hero with countdown, 2. Product teaser/preview, 3. Email capture form, 4. Social proof (waitlist count)",Email form prominent (above fold) + Sticky form on scroll,Anticipation: Dark + accent highlights. Countdown in brand color. Urgency indicators.,"Countdown timer animation, email validation feedback, success confetti, social share buttons",Scarcity + exclusivity. Show waitlist count. Early access benefits. Referral program.
+13,Comparison Table Focus,"comparison, table, versus, compare, features","1. Hero (problem statement), 2. Comparison matrix (you vs competitors), 3. Feature deep-dive, 4. Winner CTA",After comparison table (highlighted row) + Bottom,Your product column highlighted (accent bg or green). Competitors neutral. Checkmarks green.,"Table row hover highlight, feature checkmark animations, sticky comparison header",Show value vs competitors. 35% higher conversion. Be factual. Include pricing if favorable.
+14,Pricing-Focused Landing,"pricing, price, cost, plans, subscription","1. Hero (value proposition), 2. Pricing cards (3 tiers), 3. Feature comparison, 4. FAQ, 5. Final CTA",Each pricing card + Sticky CTA in nav + Bottom,Popular plan highlighted (brand color border/bg). Free: grey. Enterprise: dark/premium.,"Price toggle monthly/annual animation, card hover lift, FAQ accordion smooth open",Annual discount 20-30%. Recommend mid-tier (most popular badge). Address objections in FAQ.
+15,App Store Style Landing,"app, mobile, download, store, install","1. Hero with device mockup, 2. Screenshots carousel, 3. Features with icons, 4. Reviews/ratings, 5. Download CTAs",Download buttons prominent (App Store + Play Store) throughout,Dark/light matching app store feel. Star ratings in gold. Screenshots with device frames.,"Device mockup rotations, screenshot slider, star rating animations, download button pulse",Show real screenshots. Include ratings (4.5+ stars). QR code for mobile. Platform-specific CTAs.
+16,FAQ/Documentation Landing,"faq, documentation, help, support, questions","1. Hero with search bar, 2. Popular categories, 3. FAQ accordion, 4. Contact/support CTA",Search bar prominent + Contact CTA for unresolved questions,"Clean, high readability. Minimal color. Category icons in brand color. Success green for resolved.","Search autocomplete, smooth accordion open/close, category hover, helpful feedback buttons",Reduce support tickets. Track search analytics. Show related articles. Contact escalation path.
+17,Immersive/Interactive Experience,"immersive, interactive, experience, 3d, animation","1. Full-screen interactive element, 2. Guided product tour, 3. Key benefits revealed, 4. CTA after completion",After interaction complete + Skip option for impatient users,Immersive experience colors. Dark background for focus. Highlight interactive elements.,"WebGL, 3D interactions, gamification elements, progress indicators, reward animations",40% higher engagement. Performance trade-off. Provide skip option. Mobile fallback essential.
+18,Event/Conference Landing,"event, conference, meetup, registration, schedule","1. Hero (date/location/countdown), 2. Speakers grid, 3. Agenda/schedule, 4. Sponsors, 5. Register CTA",Register CTA sticky + After speakers + Bottom,Urgency colors (countdown). Event branding. Speaker cards professional. Sponsor logos neutral.,"Countdown timer, speaker hover cards with bio, agenda tabs, early bird countdown",Early bird pricing with deadline. Social proof (past attendees). Speaker credibility. Multi-ticket discounts.
+19,Product Review/Ratings Focused,"reviews, ratings, testimonials, social-proof, stars","1. Hero (product + aggregate rating), 2. Rating breakdown, 3. Individual reviews, 4. Buy/CTA",After reviews summary + Buy button alongside reviews,Trust colors. Star ratings gold. Verified badge green. Review sentiment colors.,"Star fill animations, review filtering, helpful vote interactions, photo lightbox",User-generated content builds trust. Show verified purchases. Filter by rating. Respond to negative reviews.
+20,Community/Forum Landing,"community, forum, social, members, discussion","1. Hero (community value prop), 2. Popular topics/categories, 3. Active members showcase, 4. Join CTA",Join button prominent + After member showcase,"Warm, welcoming. Member photos add humanity. Topic badges in brand colors. Activity indicators green.","Member avatars animation, activity feed live updates, topic hover previews, join success celebration","Show active community (member count, posts today). Highlight benefits. Preview content. Easy onboarding."
+21,Before-After Transformation,"before-after, transformation, results, comparison","1. Hero (problem state), 2. Transformation slider/comparison, 3. How it works, 4. Results CTA",After transformation reveal + Bottom,Contrast: muted/grey (before) vs vibrant/colorful (after). Success green for results.,"Slider comparison interaction, before/after reveal animations, result counters, testimonial videos",Visual proof of value. 45% higher conversion. Real results. Specific metrics. Guarantee offer.
+22,Marketplace / Directory,"marketplace, directory, search, listing","1. Hero (Search focused), 2. Categories, 3. Featured Listings, 4. Trust/Safety, 5. CTA (Become a host/seller)",Hero Search Bar + Navbar 'List your item',Search: High contrast. Categories: Visual icons. Trust: Blue/Green.,"Search autocomplete animation, map hover pins, card carousel","Search bar is the CTA. Reduce friction to search. Popular searches suggestions."
+23,Newsletter / Content First,"newsletter, content, writer, blog, subscribe","1. Hero (Value Prop + Form), 2. Recent Issues/Archives, 3. Social Proof (Subscriber count), 4. About Author",Hero inline form + Sticky header form,Minimalist. Paper-like background. Text focus. Accent color for Subscribe.,"Text highlight animations, typewriter effect, subtle fade-in","Single field form (Email only). Show 'Join X,000 readers'. Read sample link."
+24,Webinar Registration,"webinar, registration, event, training, live","1. Hero (Topic + Timer + Form), 2. What you'll learn, 3. Speaker Bio, 4. Urgency/Bonuses, 5. Form (again)",Hero (Right side form) + Bottom anchor,Urgency: Red/Orange. Professional: Blue/Navy. Form: High contrast white.,"Countdown timer, speaker avatar float, urgent ticker","Limited seats logic. 'Live' indicator. Auto-fill timezone."
+25,Enterprise Gateway,"enterprise, corporate, gateway, solutions, portal","1. Hero (Video/Mission), 2. Solutions by Industry, 3. Solutions by Role, 4. Client Logos, 5. Contact Sales",Contact Sales (Primary) + Login (Secondary),Corporate: Navy/Grey. High integrity. Conservative accents.,"Slow video background, logo carousel, tab switching for industries","Path selection (I am a...). Mega menu navigation. Trust signals prominent."
+26,Portfolio Grid,"portfolio, grid, showcase, gallery, masonry","1. Hero (Name/Role), 2. Project Grid (Masonry), 3. About/Philosophy, 4. Contact",Project Card Hover + Footer Contact,Neutral background (let work shine). Text: Black/White. Accent: Minimal.,"Image lazy load reveal, hover overlay info, lightbox view","Visuals first. Filter by category. Fast loading essential."
+27,Horizontal Scroll Journey,"horizontal, scroll, journey, gallery, storytelling, panoramic","1. Intro (Vertical), 2. The Journey (Horizontal Track), 3. Detail Reveal, 4. Vertical Footer","Floating Sticky CTA or End of Horizontal Track","Continuous palette transition. Chapter colors. Progress bar #000000.","Scroll-jacking (careful), parallax layers, horizontal slide, progress indicator","Immersive product discovery. High engagement. Keep navigation visible."
+28,Bento Grid Showcase,"bento, grid, features, modular, apple-style, showcase","1. Hero, 2. Bento Grid (Key Features), 3. Detail Cards, 4. Tech Specs, 5. CTA","Floating Action Button or Bottom of Grid","Card backgrounds: #F5F5F7 or Glass. Icons: Vibrant brand colors. Text: Dark.","Hover card scale (1.02), video inside cards, tilt effect, staggered reveal","Scannable value props. High information density without clutter. Mobile stack."
+29,Interactive 3D Configurator,"3d, configurator, customizer, interactive, product","1. Hero (Configurator), 2. Feature Highlight (synced), 3. Price/Specs, 4. Purchase","Inside Configurator UI + Sticky Bottom Bar","Neutral studio background. Product: Realistic materials. UI: Minimal overlay.","Real-time rendering, material swap animation, camera rotate/zoom, light reflection","Increases ownership feeling. 360 view reduces return rates. Direct add-to-cart."
+30,AI-Driven Dynamic Landing,"ai, dynamic, personalized, adaptive, generative","1. Prompt/Input Hero, 2. Generated Result Preview, 3. How it Works, 4. Value Prop","Input Field (Hero) + 'Try it' Buttons","Adaptive to user input. Dark mode for compute feel. Neon accents.","Typing text effects, shimmering generation loaders, morphing layouts","Immediate value demonstration. 'Show, don't tell'. Low friction start."

package/assets/.shared/data/name_convention.csv

@@ -0,0 +1,16 @@
+element_type,file_naming_rule,class_naming_rule,example_file,example_class,note
+Folder,snake_case,N/A,user_profile,N/A,Toàn bộ thư mục phải viết thường
+Entity,snake_case.dart,PascalCase,user.dart,User,Không dùng hậu tố Entity
+Repository (Interface),snake_case_repository.dart,PascalCaseRepository,auth_repository.dart,AuthRepository,Nằm trong Domain Layer
+Repository (Implementation),snake_case_repository_impl.dart,PascalCaseRepositoryImpl,auth_repository_impl.dart,AuthRepositoryImpl,Nằm trong Data Layer
+Use Case,verb_noun_usecase.dart,VerbNounUseCase,login_user_usecase.dart,LoginUserUseCase,Phải bắt đầu bằng động từ
+Data Source,noun_source_type_datasource.dart,NounSourceTypeDataSource,auth_remote_datasource.dart,AuthRemoteDataSource,Phân biệt Remote/Local
+Model (DTO),snake_case_model.dart,PascalCaseModel,user_model.dart,UserModel,Thường có phương thức fromJson/toJson
+BLoC,noun_bloc.dart,NounBloc,login_bloc.dart,LoginBloc,Đi kèm với file event và state
+BLoC Event,noun_event.dart,NounEvent,login_event.dart,LoginEvent,
+BLoC State,noun_state.dart,NounState,login_state.dart,LoginState,
+Provider (Riverpod),noun_provider.dart,NounNotifier (class) / nounProvider (global),auth_provider.dart,AuthNotifier,Biến global provider dùng lowerCamelCase
+Widget,noun_widget.dart,NounWidget,primary_button.dart,PrimaryButton,Reusable widgets
+Page/Screen,noun_page.dart,NounPage,login_page.dart,LoginPage,Màn hình chính
+Barrel File,package_name.dart,N/A,auth_repository.dart,N/A,Dùng để export public API của package
+Test File,original_name_test.dart,N/A,login_bloc_test.dart,N/A,Luôn có hậu tố _test

package/assets/.shared/data/package.csv

@@ -0,0 +1,101 @@
+pkg_name,category,description,best_practice_snippet,pro_tip,alternatives
+flutter_riverpod,State Management,"Giải pháp quản lý trạng thái hiện đại, reactive caching, an toàn biên dịch.","final provider = Provider((ref) => MyRepo()); ref.watch(provider);","Sử dụng `riverpod_generator` để giảm boilerplate code và hỗ trợ hot-reload state tốt hơn.","bloc, provider"
+flutter_bloc,State Management,"Chuẩn mực cho Enterprise App, quản lý trạng thái theo luồng sự kiện (Event-State).","BlocProvider(create: (_) => MyBloc(), child: View());","Dùng `Cubit` cho state đơn giản, `Bloc` cho luồng sự kiện phức tạp cần trace log.","riverpod, mobx"
+provider,State Management,Wrapper của InheritedWidget, đơn giản và nhẹ.,"ChangeNotifierProvider(create: (_) => Model(), child: ...);","Chỉ dùng cho app nhỏ/vừa. App lớn nên chuyển sang Riverpod để tránh lỗi 'ProviderNotFound'.","riverpod, bloc"
+get,State Management,"Framework tất cả trong một (State, Route, DI).","Get.put(Controller()); Obx(() => Text(controller.val.value));","Cẩn trọng khi dùng cho dự án lớn vì khó test và tách biệt logic. Tốt cho MVP.","riverpod, go_router"
+hydrated_bloc,State Management,Tự động lưu trạng thái Bloc xuống đĩa để khôi phục khi mở lại app.,"class MyBloc extends HydratedBloc { ... }","Tuyệt vời để lưu ThemeMode hoặc Language setting mà không cần viết code lưu trữ thủ công.","shared_preferences"
+get_it,Dependency Injection,Service Locator trung tâm để truy cập object từ bất kỳ đâu.,"GetIt.I.registerLazySingleton<AuthRepo>(() => AuthRepoImpl());","Luôn reset GetIt trong Unit Test (`GetIt.I.reset()`) để tránh state bị lây nhiễm giữa các test.","provider, riverpod"
+injectable,Dependency Injection,Code generator cho GetIt, tự động đăng ký dependency.","@Injectable(as: AuthRepo) class AuthRepoImpl implements AuthRepo {}","Dùng @Environment('dev') để tráo đổi implementation (Mock vs Real) dễ dàng.","get_it (manual)"
+fpdart,Utils,Mang Functional Programming vào Dart (Option, Either, Task).,"Either<Failure, Success> login() { ... }","Dùng `Either` thay vì ném Exception để luồng xử lý lỗi tường minh hơn.","dartz"
+freezed,Utils,Code generator cho Data Class bất biến và Union Types.","@freezed class State with _$State { const factory State.data(d) = Data; }","Kết hợp với `json_serializable`. Giúp tránh lỗi Null Pointer khi parse API.","equatable, built_value"
+dio,Networking,"HTTP client mạnh mẽ, hỗ trợ Interceptors và Global config.","final dio = Dio(BaseOptions(baseUrl: 'https://api.com'));","Luôn cấu hình Interceptors để xử lý refresh token và log lỗi tập trung.","http, chopper"
+dio_cache_interceptor,Networking,Caching cho Dio theo chuẩn HTTP (ETag, Cache-Control).,"dio.interceptors.add(DioCacheInterceptor(options: options));","Sử dụng policy `refresh` để ưu tiên lấy dữ liệu mới nhưng vẫn fallback về cache khi offline.","flutter_cache_manager"
+connectivity_plus,Networking,Kiểm tra trạng thái kết nối mạng (Wifi/Mobile).,"var status = await Connectivity().checkConnectivity();","Chỉ kiểm tra được có sóng hay không, không đảm bảo có Internet. Cần ping server thực tế.","internet_connection_checker"
+internet_connection_checker_plus,Networking,"Ping thực tế để xác nhận có Internet.","bool hasNet = await InternetConnection().hasInternetAccess;","Kết hợp với connectivity_plus để tạo logic offline mode hoàn chỉnh.","connectivity_plus"
+hive,Database,"NoSQL Database siêu nhanh, key-value, tối ưu cho mobile.","var box = await Hive.openBox('test'); box.put('key', 'val');","Tuyệt vời cho caching config. Không phù hợp query phức tạp (dùng Isar thay thế).","shared_preferences, isar"
+isar,Database,"Bản nâng cấp của Hive, hỗ trợ query phức tạp và quan hệ.","final isar = await Isar.open([UserSchema]);","Nhớ chạy `dart run build_runner build` để sinh schema. Thay thế tốt nhất cho SQLite.","sqflite, drift"
+drift,Database,"SQL framework an toàn kiểu (Type-safe) cho Dart.","@DriftDatabase(tables: [Todos]) class db extends _$db { ... }","Dùng khi dự án bắt buộc phải dùng SQL (Relational Database) và cần tính toàn vẹn cao.","sqflite, floor"
+shadcn_ui,UI,"Component library thiết kế tinh tế, port từ React.","ShadcnButton(onPressed: () {}, child: Text('Click'));","Đồng bộ trải nghiệm UI nếu team Web cũng dùng Shadcn.","getwidget"
+getwidget,UI,"Thư viện UI khổng lồ (>1000 widget) dựng sẵn.","GFButton(onPressed: (){}, text: 'Primary');","Giúp tăng tốc độ dev cho các dự án outsource cần giao diện nhanh.","flutter_bootstrap"
+flutter_neumorphic,UI,Thiết kế phong cách Soft UI (có chiều sâu vật lý).,"Neumorphic(style: NeumorphicStyle(depth: 8), child: ...);","Cẩn thận lạm dụng gây nặng app. Chỉ dùng cho các nút nhấn quan trọng.","clay_containers"
+velocity_x,UI,Code UI dạng chuỗi (chaining) giống Tailwind CSS.,"'Hello'.text.red500.make().p16().box.rounded.make();","Giúp code UI cực ngắn gọn nhưng cần thời gian làm quen cú pháp.","styled_widget"
+syncfusion_flutter_charts,Visualization,"Biểu đồ doanh nghiệp, render dữ liệu lớn mượt mà.","SfCartesianChart(series: <LineSeries<SalesData, String>>[...]);","Cần mua license nếu doanh thu cty > 1tr USD (Community license free).","fl_chart"
+fl_chart,Visualization,"Biểu đồ mã nguồn mở phổ biến nhất.","LineChart(LineChartData(lineBarsData: [...]));","Hoàn toàn miễn phí, tùy biến cao nhưng API hơi phức tạp hơn Syncfusion.","syncfusion_flutter_charts"
+cristalyse,Visualization,"Biểu đồ tối ưu hiệu suất 60fps (Mới 2025).","CristalyseChart(data: data, type: ChartType.bar);","Dựa trên nguyên lý 'Grammar of Graphics', code rất clean.","graphic"
+syncfusion_flutter_calendar,Visualization,Lịch chuyên sâu hỗ trợ Resource View và Drag-drop.,"SfCalendar(view: CalendarView.week, dataSource: ...);","Lựa chọn số 1 cho các app đặt lịch, quản lý nhân sự.","table_calendar"
+table_calendar,Visualization,"Lịch tùy biến giao diện cao.","TableCalendar(focusedDay: _now, firstDay: _start, lastDay: _end);","Phù hợp để hiển thị và đánh dấu sự kiện đơn giản, dễ custom UI từng ngày.","syncfusion_flutter_calendar"
+toastification,UI,"Thông báo Toast hiện đại, không cần BuildContext.","toastification.show(title: Text('Success'), type: ToastificationType.success);","Gọi được từ tầng logic (Bloc/Controller) dễ dàng.","fluttertoast"
+flash,UI,"Tạo thông báo dạng modal/banner animation phức tạp.","context.showFlash(builder: (context, controller) => ...);","Thay thế mạnh mẽ cho SnackBar mặc định.","overlay_support"
+media_kit,Media,"Video player thế hệ mới dùng FFmpeg, hỗ trợ Desktop.","MediaKit.ensureInitialized(); final player = Player();","Hỗ trợ hầu hết mọi định dạng video mà player mặc định không chạy được.","video_player"
+better_player_plus,Media,"Nâng cấp của video_player, hỗ trợ HLS/DASH/DRM.","BetterPlayer.network(url, betterPlayerConfiguration: ...);","Dùng khi cần bảo vệ bản quyền video (DRM) hoặc streaming adaptive.","chewie"
+chewie,Media,"UI wrapper chuẩn mực cho video player.","Chewie(controller: chewieController);","Giao diện đẹp, dễ dùng, bọc ngoài video_player_plus.","better_player"
+just_audio,Media,"Trình phát âm thanh giàu tính năng nhất.","await player.setUrl('https://foo.com/bar.mp3'); player.play();","Hỗ trợ playlist, caching, gapless playback tốt nhất hiện nay.","audioplayers"
+audio_session,Media,"Quản lý quyền ưu tiên âm thanh.","final session = await AudioSession.instance; await session.configure(...);","Tự động nhỏ nhạc khi có cuộc gọi hoặc thông báo dẫn đường.","audio_service"
+record,Media,"Ghi âm chất lượng cao, nén AAC/Opus.","if (await record.hasPermission()) { await record.start(); }","Nhẹ và ổn định hơn flutter_sound.","flutter_sound"
+image_cropper,Media,"Cắt/xoay ảnh sử dụng thư viện native (uCrop).","ImageCropper().cropImage(sourcePath: path, uiSettings: ...);","UX mượt mà vì dùng màn hình crop native của iOS/Android.","crop_your_image"
+flutter_image_compress,Media,"Nén ảnh native trước khi upload.","FlutterImageCompress.compressWithFile(path, minWidth: 1080);","Giúp tiết kiệm băng thông server và upload nhanh hơn hẳn.","image"
+sensors_plus,Hardware,"Truy cập gia tốc kế, con quay hồi chuyển.","accelerometerEvents.listen((UserAccelerometerEvent event) {...});","Dùng cho game hoặc app theo dõi vận động.","motion_sensors"
+geolocator,Hardware,"Lấy tọa độ GPS tiêu chuẩn.","Position pos = await Geolocator.getCurrentPosition();","Xử lý quyền location rất tốt.","location"
+local_auth,Hardware,Xác thực sinh trắc học (Vân tay/FaceID).,"bool didAuthenticate = await auth.authenticate(localizedReason: 'Scan');","Luôn check `canCheckBiometrics` trước khi gọi xác thực.","flutter_lock_screen"
+share_plus,Hardware,"Gọi native share sheet của OS.","Share.share('Check this out https://example.com');","Trên iPad cần cung cấp `sharePositionOrigin` để hiển thị popup đúng chỗ.","flutter_share"
+freerasp,Security,"Bảo vệ ứng dụng thời gian thực (RASP).","Talsec.instance.start(config);","Chống Root, Hooking, Debugger, Emulator. Cần thiết cho app Fintech.","root_jailbreak_sniffer"
+flutter_secure_storage,Security,"Lưu Token an toàn vào Keychain/Keystore.","await storage.write(key: 'jwt', value: token);","Cấu hình `encryptedSharedPreferences: true` trên Android.","hive_encrypted"
+shorebird,DevOps,"Code Push - Hotfix lỗi không cần qua Store.","shorebird patch android","Giải pháp duy nhất hiện nay hỗ trợ vá lỗi cho cả iOS (đang beta) và Android.","codepush (deprecated)"
+sentry_flutter,DevOps,"Theo dõi lỗi, hiệu suất và Session Replay.","await SentryFlutter.init(...)","Tính năng xem lại video thao tác của user lúc gặp lỗi cực kỳ hữu ích.","firebase_crashlytics"
+patrol,Testing,"Integration Test tương tác với Native UI.","await $.native.enableWifi(); await $.native.tap(Selector(text: 'Open'));","Test được cả Permission Dialog, Webview và thông báo hệ thống.","integration_test"
+mocktail,Testing,"Mocking cho Unit Test, cú pháp gọn gàng.","when(() => cat.sound()).thenReturn('meow');","Không cần dùng code generation (như mockito cũ), chạy test nhanh hơn.","mockito"
+alchemist,Testing,"Golden Test pixel-perfect.","await goldenTest(fileName: 'widget_test', builder: ...);","Xử lý font chữ và render pipeline tốt hơn golden mặc định.","golden_toolkit"
+talker,DevOps,"In-app console log (HTTP, Error, Bloc).","TalkerFlutter.init(); Navigator.of(context).push(TalkerScreen(talker));","Cho Tester xem log ngay trên màn hình điện thoại mà không cần cắm cáp.","alice"
+device_preview,DevOps,"Giả lập nhiều thiết bị trên máy dev.","DevicePreview(builder: (context) => MyApp());","Check UI trên iPhone, iPad, Android ngay trên 1 máy ảo/màn hình.","responsive_builder"
+go_router,Bridging,"Điều hướng (Navigation) khai báo chuẩn.","GoRouter(routes: [GoRoute(path: '/', builder: ...)]);","Hỗ trợ Deep Links và Web URL tốt nhất.","auto_route"
+json_annotation,Bridging,Annotation cho JSON serialization.,"@JsonSerializable() class User ...","Dùng kèm build_runner và json_serializable.","dart_json_mapper"
+build_runner,Bridging,Công cụ chạy code generation.,"dart run build_runner build","Lệnh không thể thiếu khi dùng Riverpod, Hive, Freezed.","watch_run"
+flutter_hooks,Bridging,"Tối ưu code UI, thay thế StatefulWidget.","final controller = useTextEditingController();","Giảm boilerplate code, tự động dispose controller.","functional_widget"
+lints,Bridging,Bộ quy tắc kiểm tra code chuẩn.","include: package:lints/recommended.yaml","Nên bật thêm các rule khắt khe trong `analysis_options.yaml`.","very_good_analysis"
+google_fonts,Bridging,"Sử dụng font từ Google dễ dàng.","Text('Hi', style: GoogleFonts.lato());","Nên tải font về assets (offline) cho production để tránh lag khi mạng yếu.","custom_fonts"
+flutter_native_splash,Bridging,"Tạo màn hình chào (Splash Screen) native.","flutter_native_splash: create","Chạy lệnh này để tạo ảnh launch screen cho cả iOS và Android tự động.","manual_setup"
+camera,Bridging,Truy cập camera chụp/quay custom.","CameraController(cameras[0], ResolutionPreset.max);","Dùng khi cần giao diện chụp ảnh tùy biến hoàn toàn (khác image_picker).","camerawesome"
+image_picker,Bridging,Chọn ảnh từ thư viện/chụp nhanh.","final XFile? image = await picker.pickImage(source: ImageSource.gallery);","Giải pháp đơn giản nhất cho avatar upload.","wechat_assets_picker"
+path,Bridging,Xử lý đường dẫn file đa nền tảng.","join(directory.path, 'file.txt');","Luôn dùng `join` thay vì cộng chuỗi '/' để tránh lỗi trên Windows.","dart_io"
+retrofit,Networking,"Code generator biến Interface thành HTTP request.","@GET('/users') Future<List<User>> getUsers();","Giúp code API layer sạch đẹp như Java/Kotlin Retrofit.","chopper"
+cached_network_image,UI,"Hiển thị và cache ảnh từ internet.","CachedNetworkImage(imageUrl: url, placeholder: (c, u) => Loading());","Tiết kiệm băng thông đáng kể cho user.","extended_image"
+flutter_svg,UI,Render file SVG vector chất lượng cao.,"SvgPicture.asset('assets/icon.svg');","Dùng `precachePicture` để tải trước các SVG nặng.","jovial_svg"
+lottie,Animation,Hiển thị animation JSON (After Effects).,"Lottie.asset('assets/anim.json');","Dùng `RenderCache` để tối ưu hiệu năng nếu lặp lại nhiều.","rive"
+flutter_animate,Animation,Animation khai báo, chainable methods.","Text('Hi').animate().fadeIn().scale();","Cực nhanh để làm hiệu ứng xuất hiện (entrance animations).","simple_animations"
+gap,UI,Tạo khoảng cách thay thế SizedBox.,Gap(20),"Tự động chỉnh theo chiều cha (Row/Column). Code gọn hơn.","sized_box"
+flutter_form_builder,Forms,Tạo form nhập liệu nhanh chóng.,"FormBuilderTextField(name: 'email');","Lấy dữ liệu dạng Map dễ dàng để gửi API.","reactive_forms"
+intl,Localization,Đa ngôn ngữ và định dạng ngày/tiền.","DateFormat.yMMMd().format(date);","Chuẩn mực của Google.","easy_localization"
+logger,Debugging,In log đẹp mắt, JSON, stack trace.","Logger().i('Info log');","Cấu hình chỉ hiện log khi đang Debug.","flutter_logs"
+url_launcher,Utils,"Mở URL, gọi điện, SMS, Email.","launchUrl(Uri.parse('https://flutter.dev'));","Cần config `LSApplicationQueriesSchemes` trên iOS.","android_intent"
+permission_handler,Utils,Quản lý xin quyền thống nhất.,"if (await Permission.camera.request().isGranted) ...","Check `isPermanentlyDenied` để hướng dẫn user vào cài đặt.","location_permissions"
+path_provider,Utils,Lấy đường dẫn thư mục chuẩn (Doc, Cache).,"final dir = await getApplicationDocumentsDirectory();","Cần thiết để lưu file cục bộ.","file_picker"
+slidable,UI,Hiệu ứng vuốt (swipe) menu trên list.,"Slidable(endActionPane: ..., child: ListTile(...));","Tối ưu cho ListView item.","dismissible"
+shimmer,UI,Hiệu ứng loading dạng xương (skeleton).,"Shimmer.fromColors(baseColor: grey, highlightColor: white, ...);","Trải nghiệm chờ đợi tốt hơn vòng quay loading.","skeleton_text"
+webview_flutter,UI,Nhúng trình duyệt web vào app.,"WebViewWidget(controller: controller);","Trên Android cần cấu hình `minSdkVersion` phù hợp.","flutter_inappwebview"
+badges,UI,Hiển thị số lượng/trạng thái trên icon.,"Badge(badgeContent: Text('3'), child: Icon(...));","Rất hay dùng cho giỏ hàng (Cart icon).","flutter_app_badger"
+upgrader,Utils,Nhắc người dùng cập nhật app mới.,"Upgrader(child: MyApp());","Tự động check version trên Store và hiện dialog nhắc update.","in_app_update"
+carousel_slider,UI,Slider ảnh/nội dung tự động chạy.,"CarouselSlider(options: CarouselOptions(autoPlay: true), ...);","Phổ biến nhất cho banner quảng cáo trang chủ.","flutter_carousel_intro"
+flutter_rating_bar,UI,Thanh đánh giá sao (Star rating).,"RatingBar.builder(onRatingUpdate: (rating) => ...);","Cho phép đánh giá nửa sao (0.5).","smooth_star_rating"
+photo_view,UI,Xem ảnh zoom/pan (pinch-to-zoom).,"PhotoView(imageProvider: NetworkImage(url));","Hỗ trợ gesture zoom mượt mà như thư viện ảnh gốc.","extended_image"
+flutter_staggered_grid_view,UI,Lưới so le (Pinterest style).,"MasonryGridView.count(crossAxisCount: 2, ...);","Giải pháp tốt nhất cho layout dạng Masonry.","waterfall_flow"
+infinite_scroll_pagination,UI,Phân trang danh sách (Lazy loading).,"PagedListView(pagingController: _controller, ...);","Xử lý trọn gói logic phân trang, loading, error, empty state.","pull_to_refresh"
+flutter_typeahead,UI,Ô tìm kiếm có gợi ý (Autocomplete).,"TypeAheadField(suggestionsCallback: (pattern) => ...);","Rất hữu ích cho ô tìm kiếm địa điểm, sản phẩm.","autocomplete_textfield"
+intro_slider,UI,Màn hình giới thiệu app (Onboarding).,"IntroSlider(slides: slides, onDonePress: ...);","Tạo nhanh màn hình hướng dẫn lúc mới cài app.","introduction_screen"
+flutter_blurhash,UI,Placeholder mờ nghệ thuật khi load ảnh.,"BlurHash(hash: 'LEHV6nWB2yk8pyo0adR*.7kCMdnj');","Tăng trải nghiệm thị giác thay vì loading trắng trơn.","octo_image"
+animations,UI,Các transition chuẩn Material (OpenContainer...).,"OpenContainer(closedBuilder: ..., openBuilder: ...);","Hiệu ứng chuyển màn hình mượt mà đúng chuẩn Google.","hero"
+modal_bottom_sheet,UI,Bottom Sheet nâng cao (hỗ trợ Cupertino).,"showMaterialModalBottomSheet(context: context, ...);","Giải quyết vấn đề scroll bên trong bottom sheet tốt hơn mặc định.","sliding_up_panel"
+flutter_platform_widgets,UI,Widget tự thích ứng iOS/Android.,"PlatformButton(onPressed: ..., child: ...);","Dùng khi muốn app trông 'native' trên cả 2 nền tảng.","adaptive_dialog"
+package_info_plus,Utils,Lấy thông tin version, build number.,"PackageInfo info = await PackageInfo.fromPlatform();","Thường dùng để hiển thị version app trong màn hình About.","version"
+device_info_plus,Utils,Lấy thông tin phần cứng thiết bị.,"AndroidDeviceInfo android = await deviceInfo.androidInfo;","Dùng để lấy Device ID hoặc check phiên bản OS.","client_information"
+wakelock_plus,Utils,Giữ màn hình luôn sáng.,WakelockPlus.enable();,"Dùng cho app bản đồ, đọc sách, xem video.","screen"
+flutter_local_notifications,Utils,Thông báo đẩy cục bộ (Local Push).,"plugin.show(0, 'Title', 'Body', details);","Cần thiết để làm báo thức hoặc nhắc nhở offline.","awesome_notifications"
+dropdown_button2,UI,Dropdown menu tùy biến cao.,"DropdownButton2(items: items, onChanged: ...);","Khắc phục hạn chế về UI của DropdownButton mặc định.","custom_dropdown"
+fl_query,State Management,Quản lý Async State và Caching (như React Query).,"QueryBuilder(job: queryJob, builder: ...);","Giải pháp thay thế Riverpod/Bloc cho việc fetch data đơn thuần.","fquery"
+auto_route,Navigation,Router mạnh mẽ với code generation.,"@AutoRouterConfig() class AppRouter extends _$AppRouter {}","Cấu hình route bằng class, type-safe hơn GoRouter một chút.","go_router"
+collection,Utils,Hàm tiện ích cho List/Map.,"firstWhereOrNull, groupListsBy...","Thư viện chuẩn của Dart team, nên dùng thay vì viết hàm thủ công.","quiver"
+crypto,Utils,Mã hóa hash (SHA, MD5).,"sha256.convert(utf8.encode('text'));","Dùng để hash password (nếu cần) hoặc checksum file.","encrypt"
+tuple,Utils,Cấu trúc dữ liệu bộ đôi/bộ ba.,"const t = Tuple2<String, int>('a', 10);","Hữu ích trước khi Dart 3 có Records (nhưng giờ nên dùng Records).","dart_records"
+rxdart,State Management,Mở rộng Stream với các toán tử Reactive.,"stream.debounceTime(Duration(milliseconds: 300));","Tuyệt vời để xử lý search input (debounce) hoặc gộp nhiều stream.","stream_transform"
+xml,Utils,Parse và tạo XML.,"XmlDocument.parse(xmlString);","Cần thiết nếu làm việc với API cũ (SOAP) hoặc RSS feed.","html"
+csv,Utils,Đọc/Ghi file CSV.,"const ListToCsvConverter().convert(data);","Dùng để export dữ liệu báo cáo ra file excel.","excel"
+archive,Utils,Nén và giải nén (Zip, Tar).,"ZipDecoder().decodeBytes(bytes);","Dùng khi cần tải và giải nén tài nguyên game/data lớn.","flutter_archive"

package/assets/.shared/data/patterns.csv

@@ -0,0 +1,109 @@
+pattern_name,category,problem_tags,description,key_widgets,code_snippet,anti_pattern
+Infinite Scroll List,UI/UX,"lazy load, pagination, load more, cuộn vô tận, danh sách dài","Dùng ScrollController để phát hiện khi người dùng cuộn đến cuối danh sách và kích hoạt tải thêm dữ liệu.","ListView.builder, ScrollController, CircularProgressIndicator","final controller = ScrollController(); @override void initState() { super.initState(); controller.addListener(() { if (controller.position.pixels >= controller.position.maxScrollExtent - 200) { ref.read(provider.notifier).loadMore(); } }); }","Tránh sử dụng `SingleChildScrollView` bao ngoài `ListView`. Không dùng `shrinkWrap: true` nếu không thực sự cần thiết vì gây giảm hiệu năng nghiêm trọng."
+Optimistic UI Update,State Management,"fast response, feedback, like button, cập nhật tức thì","State update trước khi gọi API để tạo cảm giác phản hồi tức thì. Nếu API lỗi thì rollback lại state cũ.","Riverpod, Bloc","// Riverpod Example void toggleLike(String id) { final oldState = state; state = [...state, id ]; // Update immediately try { await repo.like(id); } catch (e) { state = oldState; // Rollback on error } }","Không thông báo lỗi cho người dùng khi rollback. Quên try-catch khi gọi API."
+Debounced Search,Logic,"search, filter, tìm kiếm, hiệu năng, input delay","Chờ người dùng ngừng gõ một khoảng thời gian (VD: 500ms) trước khi gọi API tìm kiếm để giảm tải server.","Timer, TextField, Riverpod","Timer? _debounce; void onSearchChanged(String query) { if (_debounce?.isActive ?? false) _debounce!.cancel(); _debounce = Timer(const Duration(milliseconds: 500), () { ref.read(searchProvider.notifier).search(query); }); }","Gọi API ngay trong hàm `onChanged` của TextField mỗi khi gõ một ký tự."
+Responsive Layout (Mobile/Desktop),UI/UX,"responsive, adaptive, tablet, desktop, đa màn hình","Tự động chuyển đổi giữa BottomNavigationBar (Mobile) và NavigationRail (Desktop/Tablet) dựa trên chiều rộng màn hình.","LayoutBuilder, NavigationRail, BottomNavigationBar","return LayoutBuilder(builder: (context, constraints) { if (constraints.maxWidth > 600) { return Row(children: [NavigationRail(...), Expanded(child: body)]); } else { return Scaffold(body: body, bottomNavigationBar: BottomNavigationBar(...)); } });","Sử dụng `Platform.isAndroid` để quyết định layout thay vì kích thước màn hình (vì Android cũng có tablet/desktop mode)."
+Secure Authentication Flow,Architecture,"auth, login, redirect, bảo mật, token check","Kiểm tra trạng thái đăng nhập khi khởi động app và điều hướng người dùng. Sử dụng Interceptor để tự động logout khi token hết hạn (401).","GoRouter, FlutterSecureStorage, Dio","// GoRouter redirect redirect: (context, state) { final isLoggedIn = authState.value != null; final isLoggingIn = state.matchedLocation == '/login'; if (!isLoggedIn && !isLoggingIn) return '/login'; if (isLoggedIn && isLoggingIn) return '/'; return null; }","Lưu Access Token vào `SharedPreferences` (không an toàn). Xử lý logic điều hướng ngay trong UI Widget."
+Form Validation & Submission,UI/UX,"form, input, validate, error handling, nhập liệu","Sử dụng GlobalKey<FormState> để validate toàn bộ form trước khi gửi dữ liệu. Hiển thị lỗi ngay trên TextField.","Form, TextFormField, GlobalKey","if (_formKey.currentState!.validate()) { _formKey.currentState!.save(); await submitData(); } // Validator example: validator: (value) => (value == null || value.isEmpty) ? 'Required' : null","Thực hiện validate thủ công bằng `if-else` cho từng controller thay vì dùng hệ thống Form validator."
+Offline-First Data Sync,Architecture,"offline, cache, database, sync, mất mạng","Ưu tiên hiển thị dữ liệu từ Local DB (Hive/Isar). Gọi API cập nhật DB nền. Nếu không có mạng, hiển thị data cũ và queue hành động gửi đi.","Hive, ConnectivityPlus, Dio","final localData = await localSource.getAll(); if (localData.isNotEmpty) emit(localData); try { final remoteData = await remoteSource.getAll(); await localSource.save(remoteData); emit(remoteData); } catch (_) { // Silent fail or show snackbar }","Chặn người dùng sử dụng app khi không có mạng (Loading spinner vô tận)."
+Staggered Animation List,UI/UX,"animation, list effect, hiệu ứng danh sách","Áp dụng hiệu ứng xuất hiện lần lượt cho các phần tử trong danh sách để tạo cảm giác mượt mà.","flutter_staggered_animations, AnimationController","AnimationConfiguration.staggeredList( position: index, duration: const Duration(milliseconds: 375), child: SlideAnimation( verticalOffset: 50.0, child: FadeInAnimation(child: ListItem(...)), ), )","Dùng cùng một AnimationController cho tất cả item khiến chúng xuất hiện cùng lúc thay vì lần lượt."
+Custom Painter Usage,Performance,"custom ui, drawing, chart, vẽ hình, tối ưu","Sử dụng CustomPainter cho các hình vẽ phức tạp thay vì ghép nhiều Container/Widget để tối ưu bộ nhớ và GPU.","CustomPaint, CustomPainter, RepaintBoundary","class MyPainter extends CustomPainter { @override void paint(Canvas canvas, Size size) { // Draw logic } @override bool shouldRepaint(old) => false; // Optimization } // Wrap with RepaintBoundary if complex RepaintBoundary(child: CustomPaint(painter: MyPainter()))","Luôn trả về `true` trong `shouldRepaint`. Quên dùng `RepaintBoundary` cho các painter phức tạp."
+Theme Mode Switch,UI/UX,"dark mode, theme, giao diện tối sáng","Chuyển đổi giao diện Sáng/Tối động mà không cần restart app. Lưu preference vào local storage.","MaterialApp, ThemeMode, Riverpod","MaterialApp( themeMode: ref.watch(themeProvider), theme: ThemeData.light(), darkTheme: ThemeData.dark(), ); // Provider logic: state = state == ThemeMode.light ? ThemeMode.dark : ThemeMode.light;","Hardcode màu sắc (Colors.black) thay vì dùng `Theme.of(context).colorScheme.onSurface`."
+Pop Scope (Back Button Handle),Navigation,"back button, exit app, chặn thoát, xác nhận thoát","Chặn nút Back của Android để hiện dialog xác nhận trước khi thoát màn hình (Thay thế WillPopScope cũ).","PopScope","PopScope( canPop: false, onPopInvoked: (didPop) async { if (didPop) return; final bool shouldPop = await showDialog(...) ?? false; if (shouldPop && context.mounted) Navigator.of(context).pop(); }, child: Scaffold(...))","Sử dụng `WillPopScope` (đã deprecated). Không kiểm tra `didPop` gây xung đột với GoRouter."
+Sliver Sticky Header,UI/UX,"scroll, header, sticky, appbar, tiêu đề dính","Tạo hiệu ứng header dính trên cùng khi cuộn, sử dụng trong các trang Profile hoặc Dashboard.","CustomScrollView, SliverPersistentHeader, SliverAppBar","SliverPersistentHeader( pinned: true, delegate: _StickyHeaderDelegate( minHeight: 60, maxHeight: 200, child: HeaderContent(), ), )","Cố gắng dùng `Stack` và lắng nghe scroll offset để tự tính toán vị trí (giật lag và kém hiệu quả)."
+Image Caching & Placeholder,Performance,"image, cache, loading, ảnh mạng","Hiển thị ảnh từ mạng với bộ nhớ đệm, placeholder khi đang tải và icon lỗi khi tải thất bại.","cached_network_image","CachedNetworkImage( imageUrl: url, placeholder: (context, url) => CircularProgressIndicator(), errorWidget: (context, url, error) => Icon(Icons.error), cacheManager: customCacheManager, )","Dùng `Image.network` cho danh sách dài (không cache, tốn băng thông, lag khi cuộn)."
+Dart 3 Sealed Class State,Logic,"pattern matching, state management, switch","Kiểm tra tính toàn vẹn của trạng thái (Exhaustiveness checking) bằng Sealed Classes và Switch Expression.","sealed class, switch","sealed class UIState {} class Loading extends UIState {} class Data extends UIState { final String data; Data(this.data); } // Usage widget = switch (state) { Loading() => CircularProgressIndicator(), Data(data: var d) => Text(d), };","Dùng `if (state is Loading)` rời rạc, dễ bỏ sót trường hợp."
+Overlay Portal (Tooltip/Menu),UI/UX,"overlay, dropdown, tooltip, menu, popup","Hiển thị widget nổi lên trên các widget khác (như Dropdown, Tooltip) mà không bị cắt bởi cha. Thay thế OverlayEntry.","OverlayPortal, OverlayPortalController","final controller = OverlayPortalController(); return OverlayPortal( controller: controller, overlayChildBuilder: (context) => Positioned(child: Menu()), child: Button(onPressed: controller.toggle), );","Dùng `Stack` để giả lập overlay (bị giới hạn bởi kích thước widget cha)."
+Hidden Drawer (Zoom),UI/UX,"drawer, menu, animation, zoom effect","Tạo hiệu ứng menu trượt kiểu 3D/Zoom thay vì Drawer truyền thống.","Transform, AnimationController, Stack","Stack( children: [MenuWidget(), Transform(transform: Matrix4.identity()..scale(scale)..translate(xOffset), child: MainScreen())] )","Sử dụng thư viện quá nặng cho một hiệu ứng đơn giản có thể tự viết."
+Biometric Auth,System,"face id, touch id, fingerprint, bảo mật vân tay","Xác thực người dùng bằng sinh trắc học trước khi truy cập dữ liệu nhạy cảm.","local_auth","final auth = LocalAuthentication(); final bool didAuthenticate = await auth.authenticate( localizedReason: 'Quét vân tay để đăng nhập', options: const AuthenticationOptions(biometricOnly: true), );","Không xử lý trường hợp thiết bị không có phần cứng bảo mật hoặc người dùng chưa cài đặt vân tay."
+Hero Animation Transition,UI/UX,"animation, transition, image zoom, chuyển cảnh","Hiệu ứng chuyển đổi mượt mà của cùng một widget giữa hai màn hình khác nhau (thường dùng cho ảnh).","Hero","// Screen A Hero(tag: 'img_1', child: Image.network(url)) // Screen B Hero(tag: 'img_1', child: Image.network(url))","Sử dụng `tag` không trùng khớp giữa hai màn hình hoặc dùng tag trùng lặp trên cùng một màn hình."
+Pull to Refresh,UI/UX,"refresh, reload, kéo để tải, làm mới","Kéo danh sách từ trên xuống để tải lại dữ liệu mới nhất.","RefreshIndicator","RefreshIndicator( onRefresh: () async { await ref.read(provider.notifier).refresh(); }, child: ListView(...), )","Đặt `RefreshIndicator` bên trong `ListView` thay vì bao bên ngoài."
+Dismissible List Item,UI/UX,"swipe, delete, action, vuốt xóa","Vuốt sang trái hoặc phải để thực hiện hành động (xóa, lưu trữ) trên item danh sách.","Dismissible","Dismissible( key: ValueKey(item.id), onDismissed: (direction) => deleteItem(item.id), background: Container(color: Colors.red), child: ListTile(...), )","Không cung cấp `key` duy nhất hoặc không xóa item khỏi data list sau khi UI đã dismiss."
+Shimmer Loading Effect,UI/UX,"loading, skeleton, chờ, hiệu ứng xương","Hiển thị khung xương (skeleton) với hiệu ứng ánh sáng chạy qua trong khi chờ dữ liệu tải.","shimmer, Container","Shimmer.fromColors( baseColor: Colors.grey[300]!, highlightColor: Colors.grey[100]!, child: Container(color: Colors.white), )","Dùng CircularProgressIndicator cho mọi nơi, gây cảm giác ứng dụng bị treo."
+Keep Alive Page,Performance,"tab, navigation, caching, giữ trạng thái","Giữ trạng thái của widget (như vị trí cuộn) khi chuyển đổi giữa các Tab trong PageView.","AutomaticKeepAliveClientMixin","class _MyState extends State<MyWidget> with AutomaticKeepAliveClientMixin { @override bool get wantKeepAlive => true; @override Widget build(context) { super.build(context); return ListView(...); } }","Quên gọi `super.build(context)` trong hàm build."
+Value Listenable Builder,Performance,"rebuild, optimization, state, tối ưu rebuild","Chỉ rebuild một widget con cụ thể khi giá trị thay đổi thay vì rebuild toàn bộ widget cha.","ValueListenableBuilder, ValueNotifier","final ValueNotifier<int> _counter = ValueNotifier(0); // In build ValueListenableBuilder<int>( valueListenable: _counter, builder: (ctx, value, _) => Text('$value'), )","Dùng `setState` cho các thay đổi nhỏ, cục bộ tần suất cao."
+Draggable Scrollable Sheet,UI/UX,"bottom sheet, modal, scroll, kéo lên","Tạo BottomSheet có thể kéo giãn chiều cao tùy ý, thường dùng cho chi tiết bản đồ hoặc bộ lọc.","DraggableScrollableSheet","DraggableScrollableSheet( builder: (context, scrollController) { return ListView(controller: scrollController, ...); } )","Quên truyền `scrollController` vào ListView con, khiến sheet không cuộn được."
+Sliver App Bar Floating,UI/UX,"appbar, scroll, hide, ẩn hiện menu","AppBar ẩn đi khi cuộn xuống và hiện lại ngay lập tức khi cuộn lên nhẹ.","SliverAppBar","SliverAppBar( floating: true, snap: true, pinned: false, ... )","Dùng `pinned: true` khi muốn hiệu ứng ẩn hiện linh hoạt."
+Masonry Grid Layout,UI/UX,"grid, pinterest style, layout, lưới so le","Hiển thị lưới với chiều cao các item khác nhau (kiểu Pinterest).","flutter_staggered_grid_view","MasonryGridView.count( crossAxisCount: 2, mainAxisSpacing: 4, crossAxisSpacing: 4, itemBuilder: (context, index) => Card(...), )","Cố gắng dùng `GridView` chuẩn và cắt crop ảnh để bằng nhau."
+Interactive Viewer (Zoom/Pan),UI/UX,"zoom, pan, image, map, phóng to","Cho phép người dùng phóng to, thu nhỏ, kéo thả một widget (thường là ảnh hoặc sơ đồ).","InteractiveViewer","InteractiveViewer( minScale: 0.5, maxScale: 4.0, child: Image.asset('map.png'), )","Tự viết logic GestureDetector để xử lý ma trận transform."
+Toast & Snackbar Notification,UI/UX,"alert, notification, thông báo, popup","Hiển thị thông báo tạm thời ở cuối màn hình.","ScaffoldMessenger, SnackBar","ScaffoldMessenger.of(context).showSnackBar( SnackBar(content: Text('Thành công!'), behavior: SnackBarBehavior.floating), );","Dùng `showDialog` cho các thông báo đơn giản không cần tương tác."
+Expansion Tile List,UI/UX,"accordion, collapse, expand, mở rộng","Danh sách có thể mở rộng/thu gọn để xem chi tiết.","ExpansionTile","ExpansionTile( title: Text('Chi tiết'), children: [ Text('Nội dung bên trong...') ], )","Quên lưu trạng thái mở/đóng nếu danh sách bị rebuild."
+Reorderable List,UI/UX,"sort, drag drop, list, sắp xếp","Cho phép người dùng kéo thả để thay đổi vị trí các item trong danh sách.","ReorderableListView","ReorderableListView( onReorder: (oldIndex, newIndex) { // Update data list logic }, children: items.map((e) => ListTile(key: ValueKey(e), ...)).toList(), )","Không cập nhật lại danh sách dữ liệu gốc trong hàm `onReorder`."
+Text Form Field Password,UI/UX,"input, password, visibility, mật khẩu","Input mật khẩu có nút con mắt để hiện/ẩn ký tự.","TextFormField, IconButton","bool _obscure = true; TextFormField( obscureText: _obscure, decoration: InputDecoration( suffixIcon: IconButton( onPressed: () => setState(() => _obscure = !_obscure), icon: Icon(_obscure ? Icons.visibility : Icons.visibility_off), ), ), )","Tạo 2 widget TextField khác nhau và tráo đổi chúng thay vì đổi thuộc tính `obscureText`."
+Copy to Clipboard,System,"clipboard, copy, paste, sao chép","Sao chép văn bản vào bộ nhớ tạm của thiết bị.","Clipboard, ClipboardData","await Clipboard.setData(ClipboardData(text: 'Nội dung copy')); ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('Đã copy!')));","Không thông báo cho người dùng biết hành động copy đã thành công."
+Launch URL (Web/Call/SMS),System,"link, web, browser, phone, mở liên kết","Mở trình duyệt web, gọi điện hoặc nhắn tin từ app.","url_launcher","final Uri url = Uri.parse('https://flutter.dev'); if (await canLaunchUrl(url)) { await launchUrl(url, mode: LaunchMode.externalApplication); }","Không kiểm tra `canLaunchUrl` trước khi gọi, có thể gây crash."
+Share Content,System,"share, social, chia sẻ","Chia sẻ văn bản hoặc file sang các ứng dụng khác (Facebook, Zalo...).","share_plus","Share.share('Check out this app!', subject: 'App Recommendation');","Hardcode danh sách ứng dụng chia sẻ thay vì dùng Share Sheet của hệ thống."
+Device Info Access,System,"device, info, model, version, thông tin máy","Lấy thông tin thiết bị như model, hệ điều hành để log lỗi hoặc logic riêng.","device_info_plus","final plugin = DeviceInfoPlugin(); if (Platform.isAndroid) { final androidInfo = await plugin.androidInfo; print(androidInfo.model); }","Không kiểm tra `Platform` trước khi gọi hàm đặc thù của OS."
+Connectivity Check,System,"network, wifi, status, kiểm tra mạng","Kiểm tra trạng thái kết nối mạng hiện tại (Wifi/4G/None).","connectivity_plus","final result = await Connectivity().checkConnectivity(); if (result == ConnectivityResult.none) { showNoInternetDialog(); }","Chỉ kiểm tra một lần lúc khởi động mà không lắng nghe stream thay đổi trạng thái mạng."
+Permission Handling,System,"permission, camera, location, quyền truy cập","Xin quyền truy cập phần cứng và xử lý khi người dùng từ chối.","permission_handler","var status = await Permission.camera.request(); if (status.isGranted) { openCamera(); } else if (status.isPermanentlyDenied) { openAppSettings(); }","Không xử lý trường hợp `isPermanentlyDenied`, khiến người dùng bị kẹt."
+Geolocator (Location),System,"gps, location, map, vị trí","Lấy tọa độ GPS hiện tại của người dùng.","geolocator","final position = await Geolocator.getCurrentPosition(desiredAccuracy: LocationAccuracy.high);","Quên kiểm tra xem Location Service có đang bật hay không trước khi lấy tọa độ."
+Shared Preferences Helper,Data,"storage, local, config, lưu cấu hình","Lớp bao (Wrapper) để lưu trữ key-value đơn giản (token, theme, language).","shared_preferences","class Prefs { static late SharedPreferences _prefs; static Future init() async => _prefs = await SharedPreferences.getInstance(); static String? getToken() => _prefs.getString('token'); }","Dùng SharedPreferences để lưu dữ liệu lớn hoặc danh sách phức tạp (json)."
+Debounced Button (Throttling),UI/UX,"button, click, spam, chống spam click","Ngăn người dùng bấm nút liên tục gây gọi API nhiều lần (Throttling).","GestureDetector","bool _isLoading = false; void _onPress() async { if (_isLoading) return; setState(() => _isLoading = true); await submit(); setState(() => _isLoading = false); }","Không vô hiệu hóa nút (disable) hoặc hiện loading khi đang xử lý."
+Dio Interceptor (Logging/Auth),Architecture,"api, http, token, refresh token, log","Tự động đính kèm Token vào header và log request/response.","dio","dio.interceptors.add(InterceptorsWrapper( onRequest: (options, handler) { options.headers['Authorization'] = 'Bearer $token'; return handler.next(options); } ));","Viết logic thêm header lặp đi lặp lại ở mọi nơi gọi API."
+Json Serializable (Freezed),Data,"model, json, parse, immutable, dữ liệu","Tự động sinh code for JSON parsing và copyWith, giúp model bất biến.","freezed, json_annotation","@freezed class User with _$User { const factory User({required String id, required String name}) = _User; factory User.fromJson(Map<String, dynamic> json) => _$UserFromJson(json); }","Viết tay `fromJson` và `toJson` dễ sai sót chính tả và kiểu dữ liệu."
+Repository Pattern,Architecture,"architecture, data layer, clean code, cấu trúc","Tách biệt logic gọi dữ liệu (API/Local) khỏi UI và Business Logic.","Repository Class","class UserRepository { final DioClient _client; UserRepository(this._client); Future<User> getUser() async { final res = await _client.get('/user'); return User.fromJson(res.data); } }","Gọi trực tiếp `http.get` trong Widget hoặc Controller."
+Dependency Injection (GetIt),Architecture,"di, locator, service, tiêm phụ thuộc","Quản lý các instance singleton (API, Auth, Repo) để truy cập mọi nơi.","get_it","final getIt = GetIt.instance; void setup() { getIt.registerLazySingleton(() => AuthRepository()); } // Usage: getIt<AuthRepository>().login();","Truyền dependencies qua constructor của quá nhiều tầng widget."
+GoRouter Nested Navigation,Navigation,"navigation, bottom bar, nested, điều hướng lồng","Cấu hình BottomNavigationBar vẫn giữ nguyên khi chuyển trang con bên trong tab.","go_router, ShellRoute","ShellRoute( builder: (context, state, child) => Scaffold(body: child, bottomNavigationBar: MyNavBar()), routes: [ GoRoute(path: '/home', builder: ...), GoRoute(path: '/profile', builder: ...) ] )","Dùng `CupertinoTabScaffold` cho Android hoặc tự quản lý `IndexedStack` quá phức tạp."
+Riverpod AsyncValue Handling,State Management,"riverpod, async, loading, error, state","Xử lý 3 trạng thái của dữ liệu bất đồng bộ (Loading, Data, Error) gọn gàng.","flutter_riverpod","ref.watch(userProvider).when( data: (user) => UserView(user), loading: () => const CircularProgressIndicator(), error: (err, stack) => Text('Error: $err'), );","Dùng biến `isLoading` và `errorMessage` riêng lẻ trong State class thủ công."
+Bloc Event-State Pattern,State Management,"bloc, state, event, luồng dữ liệu","Mẫu thiết kế Bloc chuẩn: UI gửi Event -> Bloc xử lý -> Bloc emit State mới.","flutter_bloc","on<FetchData>((event, emit) async { emit(Loading()); try { final data = await repo.get(); emit(Loaded(data)); } catch (e) { emit(Error(e)); } });","Emit state mới ngay trong UI thay vì gửi Event."
+Isolate Computation,Performance,"thread, background, heavy task, đa luồng","Chạy tác vụ nặng (parse JSON lớn, xử lý ảnh) trên luồng riêng để không chặn UI.","compute","final result = await compute(heavyCalculation, data); // heavyCalculation must be a static or top-level function","Thực hiện vòng lặp lớn hoặc decode JSON MBs ngay trên Main Thread."
+Custom Font Loading,UI/UX,"font, typography, google fonts, phông chữ","Sử dụng Google Fonts hoặc custom font file.","google_fonts","Text('Hello', style: GoogleFonts.lato(textStyle: TextStyle(fontSize: 20)));","Import file ttf nhưng quên khai báo trong `pubspec.yaml`."
+SVG Icon Rendering,UI/UX,"image, vector, icon, svg","Hiển thị ảnh vector SVG để sắc nét ở mọi độ phân giải.","flutter_svg","SvgPicture.asset('assets/icons/home.svg', color: Colors.blue, width: 24);","Dùng ảnh PNG cho các icon đơn sắc (bị vỡ khi scale)."
+Lottie Animation,UI/UX,"animation, json, after effects, hoạt hình","Hiển thị animation phức tạp từ file JSON (xuất từ After Effects).","lottie","Lottie.asset('assets/anim/loading.json', repeat: true, reverse: true);","Dùng file GIF (dung lượng lớn, khó kiểm soát frame)."
+SafeArea Usage,UI/UX,"notch, iphone x, padding, vùng an toàn","Tránh nội dung bị che bởi tai thỏ (notch) hoặc thanh điều hướng home ảo.","SafeArea","Scaffold( body: SafeArea( child: ContentWidget(), ), )","Hardcode `padding-top: 50` để tránh tai thỏ (sai trên các máy khác nhau)."
+FittedBox Scaling,UI/UX,"text, scale, responsive, co giãn","Tự động thu nhỏ text hoặc widget để vừa khít container thay vì bị tràn (overflow).","FittedBox","Container( width: 100, child: FittedBox(fit: BoxFit.scaleDown, child: Text('Very Long Text')), )","Để Text bị lỗi sọc vàng đen (overflow) khi màn hình nhỏ."
+Wrap Layout,UI/UX,"layout, chip, tag, xuống dòng","Sắp xếp các widget con (như tags) tự động xuống dòng khi hết chỗ.","Wrap","Wrap( spacing: 8.0, runSpacing: 4.0, children: tags.map((t) => Chip(label: Text(t))).toList(), )","Dùng `Row` và bị lỗi overflow khi danh sách tag quá dài."
+AspectRatio Widget,UI/UX,"layout, ratio, video, tỷ lệ khung hình","Giữ tỷ lệ khung hình (16:9, 4:3) cho widget con bất kể kích thước cha.","AspectRatio","AspectRatio( aspectRatio: 16 / 9, child: VideoPlayer(), )","Tự tính chiều cao bằng `width * 9 / 16` (kém linh hoạt)."
+Spacer & Expanded,UI/UX,"layout, flex, row, column, khoảng cách","Phân chia không gian trong Row/Column. Spacer tạo khoảng trống, Expanded chiếm phần còn lại.","Spacer, Expanded","Row(children: [Text('Left'), Spacer(), Text('Right')]); // Pushes text to edges","Dùng `MainAxisAlignment.spaceBetween` khi cần kiểm soát cụ thể khoảng cách giữa các phần tử."
+LayoutBuilder (Conditional UI),UI/UX,"responsive, constraints, size check, điều kiện layout","Kiểm tra kích thước widget cha để render UI phù hợp (ẩn hiện cột).","LayoutBuilder","LayoutBuilder(builder: (context, constraints) { return constraints.maxWidth < 500 ? MobileView() : DesktopView(); });","Dùng `MediaQuery.of(context).size` (lấy kích thước màn hình thay vì kích thước widget cha)."
+Orientation Builder,UI/UX,"rotate, landscape, portrait, xoay màn hình","Thay đổi layout khi xoay ngang/dọc thiết bị.","OrientationBuilder","OrientationBuilder( builder: (context, orientation) { return orientation == Orientation.portrait ? Column(...) : Row(...); } )","Không xử lý xoay màn hình, để UI bị vỡ khi ngang."
+FutureBuilder (Simple Fetch),Logic,"async, future, api, load data, tải dữ liệu","Xây dựng UI dựa trên trạng thái của một Future (đơn giản, không cần Redux/Bloc).","FutureBuilder","FutureBuilder<Data>( future: getData(), builder: (context, snapshot) { if (snapshot.hasData) return Text(snapshot.data!.title); return CircularProgressIndicator(); } )","Gọi hàm tạo Future (ví dụ `getData()`) trực tiếp trong `builder` (khiến API gọi lại mỗi khi rebuild)."
+StreamBuilder (Realtime),Logic,"async, stream, socket, realtime, thời gian thực","Cập nhật UI liên tục theo luồng dữ liệu (Firestore, WebSocket).","StreamBuilder","StreamBuilder<int>( stream: channel.stream, builder: (context, snapshot) => Text('Count: ${snapshot.data}'), )","Quên đóng stream (cancel subscription) khi widget bị hủy (nếu không dùng StreamBuilder)."
+WillPopScope (Double Back to Exit),Navigation,"exit, back, thoát app, bấm 2 lần","Yêu cầu bấm Back 2 lần trong 2 giây để thoát app.","WillPopScope (Deprecated) -> PopScope","DateTime? currentBackPressTime; PopScope( canPop: false, onPopInvoked: (didPop) { final now = DateTime.now(); if (currentBackPressTime == null || now.difference(currentBackPressTime!) > Duration(seconds: 2)) { currentBackPressTime = now; toast('Press back again to exit'); return; } SystemNavigator.pop(); }, child: ... )","Không reset thời gian, khiến lần bấm sau bao lâu cũng thoát."
+System Chrome (UI Overlay),UI/UX,"status bar, color, full screen, thanh trạng thái","Đổi màu thanh trạng thái (status bar) hoặc ẩn đi.","SystemChrome","SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle( statusBarColor: Colors.transparent, statusBarIconBrightness: Brightness.dark, ));","Đặt code này trong hàm `build` (gọi liên tục). Nên đặt ở `main` hoặc `initState`."
+Wakelock (Keep Screen On),System,"screen, sleep, video, giữ màn hình sáng","Ngăn màn hình tự tắt khi đang xem video hoặc bản đồ.","wakelock_plus","WakelockPlus.enable(); // When dispose: WakelockPlus.disable();","Quên disable wakelock khi thoát màn hình, gây tốn pin."
+QR Code Scanner,System,"camera, qr, barcode, quét mã","Quét mã QR hoặc Barcode.","mobile_scanner","MobileScanner( onDetect: (capture) { final List<Barcode> barcodes = capture.barcodes; // Handle code }, )","Không xử lý quyền Camera trước khi bật Scanner."
+Date Picker Native,UI/UX,"date, calendar, input, chọn ngày","Mở hộp thoại chọn ngày chuẩn của hệ điều hành (Android/iOS).","showDatePicker","final date = await showDatePicker( context: context, initialDate: DateTime.now(), firstDate: DateTime(2000), lastDate: DateTime(2030), );","Dùng thư viện lịch quá nặng cho nhu cầu chọn ngày đơn giản."
+Modal Bottom Sheet,UI/UX,"menu, options, dialog, menu dưới","Menu trượt từ dưới lên để chọn tác vụ.","showModalBottomSheet","showModalBottomSheet( context: context, builder: (context) => Wrap(children: [ListTile(title: Text('Edit')), ListTile(title: Text('Delete'))]), );","Để content quá dài mà không bọc trong `SingleChildScrollView` hoặc không set `isScrollControlled: true`."
+Cached Network Image (Profile),UI/UX,"avatar, image, cache, circle, ảnh đại diện","Ảnh đại diện hình tròn có cache và fallback.","cached_network_image","CachedNetworkImage( imageUrl: url, imageBuilder: (context, provider) => CircleAvatar(backgroundImage: provider), placeholder: (context, url) => CircleAvatar(child: Icon(Icons.person)), )","Dùng `ClipRRect` bọc `Image.network` (hiệu năng kém hơn `CircleAvatar` hoặc `imageBuilder`)."
+Page View (Onboarding),UI/UX,"slider, tutorial, swipe, hướng dẫn","Màn hình hướng dẫn vuốt ngang với các chấm chỉ mục (dots indicator).","PageView","PageView( controller: _controller, children: [Page1(), Page2(), Page3()], ); // Use external package like smooth_page_indicator for dots","Không tối ưu `PageController` hoặc để widget con quá nặng."
+Video Player (Chewie),Media,"video, player, media, xem phim","Trình phát video với giao diện điều khiển (play/pause, seek).","chewie, video_player","Chewie( controller: ChewieController( videoPlayerController: VideoPlayerController.network(url), autoPlay: true, looping: true, ), )","Quên `dispose` VideoPlayerController gây rò rỉ bộ nhớ."
+WebView (In-App Browser),System,"web, html, browser, duyệt web","Hiển thị trang web bên trong ứng dụng.","webview_flutter","WebViewController()..loadRequest(Uri.parse('https://google.com')); // Attach to WebViewWidget","Cho phép Javascript tùy tiện (`JavaScriptMode.unrestricted`) mà không kiểm soát bảo mật."
+Google Maps Integration,System,"map, gps, location, bản đồ","Hiển thị bản đồ Google Maps và đánh dấu (marker).","google_maps_flutter","GoogleMap( initialCameraPosition: CameraPosition(target: LatLng(10.7, 106.6), zoom: 14), markers: {Marker(markerId: MarkerId('1'), position: LatLng(10.7, 106.6))}, )","Rebuild GoogleMap liên tục mà không dùng `Set<Marker>` (gây nháy marker)."
+UUID Generation,Logic,"id, unique, key, định danh","Tạo chuỗi ID duy nhất cho các item mới.","uuid","var uuid = Uuid(); String id = uuid.v4();","Dùng `Random().nextInt()` làm ID (có thể trùng lặp)."
+Intl Date Formatting,Logic,"date, time, format, định dạng ngày","Định dạng ngày tháng theo ngôn ngữ máy (dd/MM/yyyy).","intl","String formatted = DateFormat('dd/MM/yyyy HH:mm').format(DateTime.now());","Tự viết hàm ghép chuỗi ngày tháng (dễ sai logic múi giờ)."
+Number Formatting (Currency),Logic,"money, currency, format, tiền tệ","Định dạng số tiền có dấu phẩy ngăn cách (1,000,000 VND).","intl","final currency = NumberFormat.currency(locale: 'vi_VN', symbol: '₫'); print(currency.format(1000000));","Dùng `toString()` và tự replace string."
+Path Provider (File Storage),Data,"file, path, directory, lưu file","Lấy đường dẫn thư mục chuẩn để lưu file tạm hoặc file document.","path_provider","final directory = await getApplicationDocumentsDirectory(); final file = File('${directory.path}/my_file.txt');","Hardcode đường dẫn `/sdcard/...` (lỗi trên Android mới và iOS)."
+Hive Database Setup,Data,"nosql, db, local, storage, cơ sở dữ liệu","Thiết lập DB NoSQL Hive nhanh và nhẹ.","hive_flutter","await Hive.initFlutter(); var box = await Hive.openBox('settings'); box.put('darkMode', true);","Mở box nhiều lần mà không kiểm tra đã mở chưa (`Hive.isBoxOpen`)."
+Logger Utility,Logic,"log, debug, print, nhật ký","In log đẹp, có màu và tag để dễ debug.","logger","var logger = Logger(); logger.d('Debug message'); logger.e('Error message');","Dùng `print` cho mọi thứ (khó lọc log và làm rác console production)."
+Extension Methods (String),Logic,"extension, utility, string, tiện ích","Thêm hàm tiện ích trực tiếp vào lớp String (ví dụ validate email).","dart extension","extension StringExt on String { bool get isValidEmail => RegExp(r'^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$').hasMatch(this); }","Viết các hàm Utils static rời rạc khó gọi (`Utils.isValidEmail(str)`)."
+GetIt Service Locator,Architecture,"di, singleton, service, quản lý dịch vụ","Đăng ký và lấy các service (API, Auth) từ một nơi duy nhất.","get_it","GetIt.I.registerSingleton<AuthService>(AuthService()); // Usage: GetIt.I<AuthService>().login();","Khởi tạo service ở khắp nơi (`new AuthService()`)."
+Equatable (Value Equality),Logic,"compare, state, equality, so sánh","So sánh hai object dựa trên giá trị thay vì tham chiếu (dùng cho State Management).","equatable","class User extends Equatable { final int id; const User(this.id); @override List<Object> get props => [id]; }","So sánh thủ công `user1.id == user2.id` ở nhiều nơi."
+Cascade Operator Usage,Logic,"dart, syntax, clean code, cú pháp","Thực hiện nhiều thao tác trên cùng 1 object mà không cần lặp lại tên biến.",".. operator","final list = [] ..add(1) ..add(2) ..sort();","Viết `list.add(1); list.add(2); list.sort();` dòng dài dòng."
+Collection If/For,Logic,"dart, list, ui, syntax, danh sách điều kiện","Dùng if/for ngay trong mảng widget children.","collection if","Column(children: [ Text('Title'), if (isLoading) CircularProgressIndicator(), for (var item in items) Text(item), ])","Dùng toán tử 3 ngôi phức tạp hoặc hàm `buildList()` riêng lẻ không cần thiết."
+Const Constructor Optimization,Performance,"const, memory, optimization, tối ưu bộ nhớ","Sử dụng const cho các widget không thay đổi để tránh rebuild không cần thiết.","const","const Text('Static Title'); const SizedBox(height: 10);","Quên từ khóa `const` ở những nơi có thể dùng, làm tăng lượng rác bộ nhớ (GC)."
+Factory Constructor,Logic,"dart, class, constructor, factory","Constructor trả về instance có sẵn hoặc từ cache thay vì luôn tạo mới.","factory","class Logger { static final Logger _instance = Logger._internal(); factory Logger() => _instance; Logger._internal(); }","Không dùng Singleton cho các class nặng (Database, Network Client)."
+Named Parameters,Logic,"dart, function, arguments, tham số","Sử dụng tham số có tên để code dễ đọc và tùy chọn.","{}","void connect({required String host, int port = 80}) { ... } // Usage: connect(host: 'localhost');","Dùng quá nhiều tham số vị trí (`connect('localhost', 80, true, 5000)`) gây khó hiểu."
+Isolate Spawn (Worker),Performance,"isolate, thread, parallel, đa luồng","Tạo luồng xử lý song song thủ công cho tác vụ cực nặng.","Isolate","void worker(SendPort port) { port.send('Done'); } // Usage: await Isolate.spawn(worker, receivePort.sendPort);","Giao tiếp giữa các Isolate quá phức tạp mà không dùng `compute` cho tác vụ đơn giản."
+Flutter Hooks (UseEffect),State Management,"hooks, functional, state, react style","Quản lý vòng đời widget (init, dispose) gọn gàng như React Hooks.","flutter_hooks","class MyWidget extends HookWidget { @override Widget build(context) { useEffect(() { print('Init'); return () => print('Dispose'); }, []); return Container(); } }","Dùng `StatefulWidget` với quá nhiều boilerplate code cho logic đơn giản."
+Analytic Event Tracking,Data,"analytics, log, tracking, thống kê","Gửi sự kiện người dùng thao tác về hệ thống phân tích (Firebase Analytics).","firebase_analytics","await FirebaseAnalytics.instance.logEvent( name: 'select_content', parameters: {'content_id': '123', 'content_type': 'image'}, );","Gửi string cứng (hardcoded strings) thay vì dùng hằng số (constants) cho tên sự kiện."
+Crashlytics Error Reporting,Data,"crash, error, bug, báo lỗi","Tự động bắt lỗi crash và gửi về Firebase Crashlytics.","firebase_crashlytics","FlutterError.onError = FirebaseCrashlytics.instance.recordFlutterFatalError; // Catch non-fatal try { ... } catch (e, s) { FirebaseCrashlytics.instance.recordError(e, s); }","Chỉ in lỗi ra console và bỏ qua, không biết user gặp lỗi gì."
+Environment Config (Flavors),Architecture,"config, flavor, dev, prod, môi trường","Cấu hình biến môi trường riêng cho Dev, Staging, Production.","flutter_dotenv / Entry Points","const apiUrl = String.fromEnvironment('API_URL', defaultValue: 'https://dev.api.com');","Sửa code thủ công mỗi khi build bản Dev hoặc Prod."
+Asset Image Loading,UI/UX,"image, asset, resource, ảnh nội bộ","Load ảnh từ thư mục assets tối ưu.","Image.asset","Image.asset('assets/images/logo.png', width: 100, fit: BoxFit.contain);","Quên khai báo đường dẫn trong `pubspec.yaml`."
+Gradient Background,UI/UX,"color, ui, gradient, màu nền","Tạo nền chuyển màu đẹp mắt.","BoxDecoration, LinearGradient","Container( decoration: BoxDecoration( gradient: LinearGradient( colors: [Colors.blue, Colors.purple], begin: Alignment.topLeft, end: Alignment.bottomRight, ) ) )","Dùng ảnh nền gradient nặng nề thay vì vẽ bằng code."
+ClipRRect (Rounded Image),UI/UX,"image, border radius, bo góc, ảnh tròn","Bo tròn các góc của ảnh hoặc widget con.","ClipRRect","ClipRRect( borderRadius: BorderRadius.circular(8.0), child: Image.network(url), )","Dùng `Container` có `decoration` nhưng ảnh con vẫn bị vuông (không clip)."
+Global Error Handler,Architecture,"error, exception, zone, xử lý lỗi toàn cục","Bắt tất cả các lỗi chưa được xử lý trong ứng dụng (Red screen guard).","runZonedGuarded","runZonedGuarded(() { runApp(MyApp()); }, (error, stack) { // Report error logic });","Để màn hình đỏ (Red Screen of Death) hiện ra trước mặt người dùng cuối."
+Theme Extension (Custom Colors),UI/UX,"theme, color, design system, màu tùy chỉnh","Thêm các màu sắc custom vào ThemeData chuẩn của Flutter.","ThemeExtension","@override ThemeExtension<MyColors> copyWith(...) { ... } // Usage: Theme.of(context).extension<MyColors>()!.brandColor","Thêm biến static `MyColors.red` rời rạc, không đổi theo Theme Mode (Light/Dark) được."
+Dynamic Grid Axis Count,UI/UX,"grid, responsive, layout, lưới động","Thay đổi số cột của GridView dựa trên chiều rộng màn hình.","SliverGridDelegateWithMaxCrossAxisExtent","GridView.builder( gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent( maxCrossAxisExtent: 200, childAspectRatio: 3/2, ), ... )","Fix cứng `crossAxisCount: 2` khiến giao diện xấu trên tablet/iPad."
+Scroll to Top Button,UI/UX,"scroll, button, navigation, cuộn lên đầu","Nút bấm để cuộn nhanh lên đầu trang danh sách.","ScrollController","FloatingActionButton( onPressed: () => controller.animateTo(0, duration: Duration(seconds: 1), curve: Curves.easeOut), child: Icon(Icons.arrow_upward), )","Dùng `jumpTo(0)` gây giật cục thay vì `animateTo`."
+Keyboard Dismiss (Unfocus),UI/UX,"keyboard, input, focus, ẩn bàn phím","Tự động ẩn bàn phím khi bấm ra ngoài vùng nhập liệu.","GestureDetector, FocusScope","GestureDetector( onTap: () => FocusScope.of(context).unfocus(), child: Scaffold(...), )","Bắt người dùng phải bấm nút Done trên bàn phím mới ẩn được."
+Retry Policy (API),Data,"api, retry, error, thử lại","Tự động gọi lại API nếu thất bại (mạng yếu).","retry / dio_smart_retry","final response = await retry( () => client.get('...'), retryIf: (e) => e is SocketException, maxAttempts: 3, );","Không có cơ chế retry, báo lỗi ngay lập tức khi mạng chập chờn."
+Sliver Fill Remaining,UI/UX,"layout, scroll, center, căn giữa","Hiển thị nội dung căn giữa màn hình hoặc lấp đầy khoảng trống trong CustomScrollView.","SliverFillRemaining","SliverFillRemaining( hasScrollBody: false, child: Center(child: Text('Empty')), )","Dùng `SliverToBoxAdapter` và set height thủ công."
+Auto Size Text,UI/UX,"text, scale, font size, chữ tự động","Tự động giảm kích thước chữ để vừa khung chứa.","auto_size_text","AutoSizeText('Very long title', maxLines: 1, minFontSize: 12);","Để text bị cắt (ellipsis) quá sớm khi vẫn còn chỗ trống."
+Badges (Notification Count),UI/UX,"notification, badge, icon, thông báo","Hiển thị số lượng thông báo trên icon.","badges","Badge( badgeContent: Text('3', style: TextStyle(color: Colors.white)), child: Icon(Icons.shopping_cart), )","Tự dùng Stack và Positioned căn chỉnh thủ công (lệch trên các máy khác nhau)."
+Skeltonizer (Loading UI),UI/UX,"loading, skeleton, ui, hiệu ứng chờ","Tự động biến UI thật thành khung loading skeleton mà không cần viết widget riêng.","skeletonizer","Skeletonizer( enabled: isLoading, child: RealUIWidget(data: mockData), )","Viết riêng một widget `LoadingItem` và phải bảo trì cả 2 bản UI."
+Gap (Spacing),UI/UX,"layout, spacing, margin, khoảng cách","Thay thế SizedBox để tạo khoảng cách giữa các widget (dễ đọc hơn).","gap","Column(children: [Text('A'), Gap(10), Text('B')]);","Dùng `Padding` bao bọc từng widget chỉ để tạo khoảng trống."
+Freezed Union Handling,Logic,"state, pattern matching, union","Xử lý các case của Union Type (Freezed) an toàn.","freezed, map/when","state.map( data: (d) => ShowData(d), error: (e) => ShowError(e), loading: (_) => ShowLoading(), );","Dùng `if (state is Data)` và ép kiểu thủ công."
+Value Key (Widget Identity),Performance,"key, widget, update, định danh","Giúp Flutter phân biệt các widget trong danh sách khi thứ tự thay đổi.","ValueKey","ListView( children: items.map((item) => ListTile(key: ValueKey(item.id), ...)).toList() )","Không dùng Key hoặc dùng `index` làm Key (gây lỗi khi xóa/thêm item)."
+Interactive Bottom Sheet,UI/UX,"bottom sheet, modal, drag, menu kéo","BottomSheet có thể tương tác (cuộn bên trong) và đóng khi kéo xuống.","showModalBottomSheet","showModalBottomSheet( isScrollControlled: true, builder: (_) => DraggableScrollableSheet(...) );","Bottom Sheet bị cố định chiều cao, không hiển thị hết nội dung."
+Check Internet Connection Stream,System,"network, wifi, stream, theo dõi mạng","Lắng nghe thay đổi trạng thái mạng theo thời gian thực.","connectivity_plus","Connectivity().onConnectivityChanged.listen((ConnectivityResult result) { // Update UI status });","Chỉ kiểm tra một lần lúc gọi API."