A Working Flutter Instagram clone

flutter fluttergram (instagram clone)

a working instagram clone written in flutter using firebase / firestore.

demo

download the release apk to try out fluttergram (instagram clone).

instagram download features

• custom photo feed based on who you follow (using firebase cloud functions)
• post photo posts from camera or gallery
  • like posts
  • comment on posts
    • view all comments on a post
• search for users
• profile pages
  • follow / unfollow users
  • change image view from grid layout to feed layout
  • add your own bio
• activity feed showing recent likes / comments of your posts + new followers

screenshots

getting started

1. setup flutter

2. download the repo

$ mdanics/fluttergram.git
$ cd fluttergram/

3. setup the firebase app

1. you’ll need to create a firebase instance. follow the instructions at https://console.firebase.google.com.
2. once your firebase instance is created, you’ll need to enable anonymous authentication.

• go to the firebase console for your new instance.
• click “authentication” in the left-hand menu
• click the “sign-in method” tab
• click “google” and enable it

3. create cloud functions (to make the feed work)

• create a new firebase project with firebase init
• copy this project’s functions/lib/index.js to your firebase project’s functions/index.js
• push the function getfeed with firebase deploy --only functions in the output, you’ll see the getfeed url, copy that.
• replace the url in the _getfeed function in upload_page.dart with your cloud function url from the previous step.

4. enable the firebase database

• go to the firebase console
• click “database” in the left-hand menu
• click the cloudstore “create database” button
• select “start in test mode” and “enable”

5. (skip if not running on android)

• create an app within your firebase instance for android, with package name com.yourcompany.news
• run the following command to get your sha-1 key:

keytool -exportcert -list -v 
-alias androiddebugkey -keystore ~/.android/debug.keystore

• in the firebase console, in the settings of your android app, add your sha-1 key by clicking “add fingerprint”.
• follow instructions to download google-services.json
• place google-services.json into /android/app/.

6. (skip if not running on ios)

• create an app within your firebase instance for ios, with your app package name
• follow instructions to download googleservice-info.plist
• open xcode, right click the runner folder, select the “add files to ‘runner'” menu, and select the googleservice-info.plist file to add it to /ios/runner in xcode
• open /ios/runner/info.plist in a text editor. locate the cfbundleurlschemes key. the second item in the array value of this key is specific to the firebase instance. replace it with the value for reversed_client_id from googleservice-info.plist

double check install instructions for both

• google auth plugin
• firestore plugin

what’s next?

• improve caching of profiles, images, etc.
• better post creation, add filters to your image
• custom camera implementation
• animations (heart when liking image)
• firebase security rules
• delete posts
• registration without google signin
• direct messaging
• stories
• clean up code

121

download the full project for this post from the following button

this source is fully free for all time

download as zip