Flutter UI Bootcamp | Build Beautiful Apps using Flutter

Explore the basics of Dart variables as containers for typed data, and learn mutable versus immutable values using var and final with examples like string and int.

Explore how to define and call functions in Dart, with void and int return types, parameters, and examples that print or return results.

Explore how Dart uses a class as a blueprint to create objects, assign properties like name and age, instantiate instances with a constructor, and access methods such as get name.

Design and implement a Flutter UI showcasing a game-inspired app with a title, page indicators, horizontal carousels of games, a featured banner, and a gradient background, responsive across devices.

Kick off a flutter project, create a home page in a pages folder using a stateful widget and scaffold, then run and debug with dev tools.

Learn to build a visually engaging home page background by stacking widgets, loading featured games from a data file, and swiping through images with a page view.

Design a Flutter home page gradient background with a gradient box. Extend the box from the bottom to 75–80% with a linear gradient and color stops.

Build the top navigation layer in Flutter by creating a top bar with icons, stacked over content, with padding and a horizontally scrollable featured games list.

Build the home page UI by creating a featured games info widget with a title and image counter, plus a page view and active-page indicators.

Refine the home page by highlighting the active featured game with green page indicators, adjust spacing with margins and sized boxes, and separate the top bar from content.

Learn to build a horizontal scrollable games list in Flutter by creating a scalable stateless widget that renders game cards with images and optional titles via data model.

Enhance the home page games list by applying box fit cover for images, adding a border radius of 5, padding, and responsive text to display three games with bouncing scroll.

Build a featured games banner on the home page using Flutter, with a responsive container, network image, box decoration, and rounded corners.

Finalize the home page UI by completing the second games left view under the featured banner and implement logic to exclude titles when show titles is set to false.

Explore building a login screen and home page in a Flutter app, and master custom page transitions and animated navigation between screens while wiring up user input fields.

Start coding a Flutter login page with animated avatar, text inputs and a login button, then implement exit animation and transition to the home page.

Finish the Flutter login page by adding email and password text fields with white text, underlined borders, and an enabled rounded login button; adjust layout with containers and styling.

Implement a flutter login page enter animation using an animation controller, a two-second forward motion, and a tween that drives the avatar size via an animated builder.

Build the home page with an avatar and user name in a centered Flutter layout. Enable login-to-home navigation using navigator push replacement and a material page route.

Learn to implement a custom fade page transition from login to home in Flutter, using a page route builder, adjust duration to 500 ms, and animate the avatar shrinking.

Learn to implement a custom login-to-home page transition in flutter by crafting the exit animation, controlling the animation lifecycle, and animating the home page with a transform and animated builder.

Complete Flutter UI by wiring login, home, and intermediate pages with navigation and slide or fade transitions. Implement a custom slide transition using offset animation for left-to-center movement.

Build Flutter travel app user interface with top bar, location info, and scroll list of cards. Each card shows a background image, author and time, like, bookmark, and detail button.

Initialize a flutter project, import dependencies, and build the home page scaffold with a top bar including the discover logo, search, and menu icons, plus asset setup.

Build a reusable location bar widget for the home page, showing a horizontal list of locations with an active underline, responsive sizing, and rounded styling.

Add articles list on the home page with a list view builder inside an expanded container, sourcing from a data file, and style items with background images and rounded corners.

Build the home page articles list by composing a column with a top row and an author info block, including a circular avatar, padding, and like/bookmark icons for clean alignment.

Add the article detail row to the home page list, including a floating action button, title, location, padding, and text styling for proper layout.

Learn to build a social info overlay on the articles list in Flutter using a top stack layer, overflow, and a social container with like, comment, and share.

Implement a dynamic five-star rating widget on the home page articles list, filling stars by each article's reading value using amber icons.