Flutter YouTube Clone UI Tutorial | Apps From Scratch

Published: 26 March 2021
on channel: Marcus Ng

66,611

1.8k

» Flutter courses, writeups, and source code on Launch Club 🧠
https://drp.li/Iq9Bk

» Flutter Job Board 👋
https://drp.li/T9bLq

Learn Flutter fast by building a Youtube Clone UI. This Flutter UI tutorial is great for beginners as well as advanced developers who want to improve their mobile app development skills. You'll learn how to use slivers, display the selected video above our bottom navigation bar with the miniplayer package, riverpod to manage the state of our app, and easy UI tips to help you develop a beautiful project.

» Remember to like, subscribe, comment, and share this video!🚨
https://www.youtube.com/MarcusNg?sub_...

» Socials📱
GitHub: https://github.com/MarcusNg
Twitter:   / marcuslng

» Resources 📂
Starter Project: https://github.com/MarcusNg/flutter_y...
Complete Source Code: https://github.com/MarcusNg/flutter_y...

Material Design Typography: https://material.io/design/typography...

Riverpod Package: https://pub.dev/packages/flutter_rive...
Miniplayer Package: https://pub.dev/packages/miniplayer
Timeago Package: https://pub.dev/packages/timeago

» Video Player Tutorials 🎥
Flutter Netflix Clone Responsive UI Tutorial | Web and Mobile
   • Flutter Netflix Clone Responsive UI T...

Flutter YouTube API and Video Player Tutorial
   • Flutter YouTube API and Video Player ...

» Timestamps 🕒
00:00 Flutter YouTube Clone UI Introduction
00:54 Download The Starter Project
01:04 Project Walkthrough
04:28 Bottom Navigation Bar
08:26 Stack and Offstage
11:43 Sliver App Bar
15:17 Home Screen and SliverList
16:11 Video Card
24:02 Riverpod Selected Video Provider
27:19 Miniplayer Package
37:38 Video Screen
42:07 Video Info
50:40 Suggested Videos
57:02 Recap
57:31 Thanks for watching 🙏

» Music 🎶
Lakey Inspired (   / lakeyinspired  )
Joakim Karud (   / joakimkarud  )

#Flutter #FlutterUI #FlutterTutorial