/flutter-handbook

A go-to handbook with a curated set of resources to help the participants of any Flutter Hackathon..

Let's Get to Speed for Your Next Hackathon

Twitter Follow_On_Medium LinkedIn

Handbook Logo

Legacy

Hack'19, the first of its kind International Flutter Hackathon, organised by the Flutter Community and supported by the Flutter team at Google is just around the corner, and I thought that I should attempt to curate some helpful resources, to help the participants get to speed.

About Hack'19

If you don't know about Hack'19 then let me give you a brief introduction.

Hack'19, to be organised on the 1st of June, 2019, is the First International Flutter Hackathon, spanning over an entire day. Interested developers can participate in a team of 2-5 people and build something amazing on Flutter or Flutter Web. By the end of the day, all the participants themselves vote for their favourite projects and the winners shall receive amazing prizes.

Here are some useful links:

  1. Official Website
  2. Join a Hub Near You to Participate
  3. Organise a Hub
  4. Official Getting Started Resources

Why a Handbook?

At the end of the day, a hackathon is a competition with actual winners, and because it is about Flutter, there will be some really breathtaking UIs, apps with rocket speed performance, and some elements which feel like magic. In a competition like that, you don't want to be missing out, especially when there's a lot of content available online which can help you utilise those hours of coding time that you get, and make the most attractive and useful app.

So, I took the liberty of scavenging the internet, and picking up all the amazing articles, videos, apps, and other helpful resources that can help you achieve that goal. Plus, the scope of this handbook extends beyond hackathons. This will be helpful for any future competition or project, where you are going to use Flutter.

Installation and First Steps

  1. Install and Setup Flutter - Official Flutter Docs
  2. Create your First Flutter App - Google Codelab
  3. Creating a Simple Calculator App with Flutter - By Samarth Agarwal
  4. I want to learn Flutter. How to start? by Pooja Bhaumik

Firebase

Firebase deserves a separate section because for most people their app will have a backend, but making a custom one from scratch just takes too much time, and considering how well Firebase integrates with Flutter, it becomes the obvious choice.

Pro Tip: Skip authentication.

  1. Firebase for Flutter - Google Codelab
  2. How to use Firebase with Flutter by Atul Sharma
  3. How to integrate your iOS Flutter App with Firebase on MacOS by Shen Huang
  4. Simple Recipes App made in Flutter — Firestore by Michael Krol
  5. Flutter- How to Upload and Download using Firebase Storage by Ayush Shekhar

UI

Beginner

  1. Flutter Basic Widgets by Pooja Bhaumik
  2. Flutter UI Kit by Pawan Kumar
  3. Flutter Example Apps by Pawan Kumar
  4. Building Beautiful UI with Flutter - Google Codelab
  5. Breaking layouts in Rows and Columns in Flutter by Pooja Bhaumik
  6. Flutter - Container Cheat Sheet by Julien Louage
  7. Animated Containers in Flutter by Pooja Bhaumik

Intermediate

  1. Build a Beautiful Pokemon App by Pawan Kumar
  2. Reflectly Inspired Animated Slideshow by Fireship
  3. Flutter Layouts for the CSS Developer by Fireship
  4. Parallax in Flutter by Iiro Krankka
  5. Frosted Glass Effect by Collin Jackson
  6. A Deep Dive Into PageView In Flutter (With Custom Transitions) by Deven Joshi
  7. A Deep Dive into Hero Widgets in Flutter by Deven Joshi
  8. Flutter Flare Basics - Let's Build Giphy's Nav Menu by Fireship

Advanced

  1. Flutter Animation - Radial Menu at 60fps by Fireship
  2. Flutter Story App UI Concept by Devefy
  3. Flutter Streaming Service App UI by Devefy
  4. Flutter Challenge: 3D Bottom Navigation Bar by Deven Joshi
  5. SuperHeroInteraction App by Pinkesh Darji

Network and Utility

  1. Working with APIs in Flutter by Pooja Bhaumik
  2. Parsing Complex JSON in Flutter by Pooja Bhaumik
  3. Download Large Files (Pdf, Json, Image etc) With Progress % - By Pawan Kumar

State Management (Provider)

  1. Flutter Provider : Advanced Data Management by Fireship
  2. Flutter StateManagement with Provider by Karthik Ponnam
  3. Flutter Architecture — My Provider Implementation Guide by Dane Mackier

Flutter for Web

  1. Create and Deploy a Website from Scratch by Ayush Shekhar
  2. Ins and Outs of Flutter Web by Nash
  3. Flutter Web: Making a Responsive Portfolio App | Part 1 by Pawan Kumar
  4. Flutter Web: Deploying Portfolio App To Github.IO | Peanut Tutorial | Part 2 by Pawan Kumar
  5. Flutter For Web: Getting Started | Migrating PokemonApp to Web by Pawan Kumar

CI/CD with CodeMagic

  1. CodeMagic by NeverCode
  2. Continuous Integration for Flutter with Codemagic by CodeMagic
  3. Build and host your Flutter web apps on Codemagic