Fluttergram - A working Instagram clone written in Flutter using Firebase / Firestore

Overview

Fluttergram

A working Instagram clone written in Flutter using Firebase / Firestore

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

feed example upload photo example go to a profile from feed edit profile example comment and activity feed example

Dependencies

Developer:

1. Twitter

2. Clone the repo

$ git clone https://github.com/rwema3/Fluttergram-App
$ 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 Google 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
  1. 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 feed.dart with your cloud function url from the previous step.

If this does not work and you get the error Error: Error parsing triggers: Cannot find module './notificationHandler' Try following these steps. If you are still unable to get it to work please open a new issue.

You may need to create the neccessary index by running firebase functions:log and then clicking the link

If you are getting no errors, but an empty feed You must post photos or follow users with posts as the getFeed function only returns your own posts & posts from people you follow.

  1. 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"
  1. (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/.
  1. (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

What's Next?

  • Notificaitons for likes, comments, follows, etc
  • Animations (heart when liking image) (#77)
  • Improve Caching of Profiles, Images, Etc.
  • Better post creation, add filters to your image
  • Custom Camera Implementation
  • Firebase Security Rules
  • Delete Posts
  • Direct Messaging
  • Stories
  • Clean up code
You might also like...

Whatapp clone UI - WhatApp UI clone in flutter

Whatapp clone UI - WhatApp UI clone in flutter

whatapp clone in flutter WhatApp UI clone in flutter Getting Started

Feb 6, 2022

Fashion App Clone - a clone app from Emre Altunbilek's Flutter Course

Fashion App Clone This is a clone app from Emre Altunbilek's Flutter Course. I am trying to clone UI and improve code.

Oct 2, 2022

Whatsapp-clone - A whatsapp clone with dart

Whatsapp-clone - A whatsapp clone with dart

whatsapp-clone Just a simple whatsapp clone with dart

Mar 28, 2022

Full Stack TikTok Clone using Flutter, Firebase & GetX

Full Stack TikTok Clone using Flutter, Firebase & GetX

TikTok Clone A Tiktok App- Works on Android & iOS! Features Authentication with Email & Password Uploading Videos with Caption Compressing Videos Gene

Dec 30, 2022

TikTok Flutter - Clone of TikTok with Flutter and Firebase

TikTok Flutter - Clone of TikTok with Flutter and Firebase

TikTok Flutter - Clone of TikTok with Flutter and Firebase

Jan 22, 2022

A TikTok Clone in Flutter and Firebase.

A TikTok Clone in Flutter and Firebase.

TikTok Flutter Clone of TikTok with Flutter and Firebase. Caracteristics Video Demo: https://youtu.be/sMKg6ILYgv0 -TikTok UI -Swipe Videos -Dynamic Vi

Jan 3, 2023

This project contains a flutter application to view any Instagram profile.

This project contains a flutter application to view any Instagram profile.

Instagram Profile Viewer (yamuntu_task) This project is for my application at yamuntu. The presented application allows the user to view any username

Jun 2, 2022

Modified instagram Ui

myinstagram_clone A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you starte

Dec 24, 2021

A dog themed instagram social network for messaging, posting updates, finding people and coloring the dog world.

A dog themed instagram social network for messaging, posting updates, finding people and coloring the dog world.

instagram-dogy aka dodogy A dogy themed instagram social network for messaging, posting updates, finding people and coloring the dog world. Code Quali

Nov 11, 2022
Owner
Dominique Rwema Bagirishya
Software Developer
Dominique Rwema Bagirishya
Simple product management app, with Auth module made with Firebase Auth and Firebase Firestore ODM

Firestore App Simple product management app, with Auth module made with Firebase Auth and Firebase Firestore ODM. You can login or signup with email o

null 3 Jun 24, 2022
Instagram clone app built using flutter

instagram_clone A new Flutter project. Run In order to run your application, typ

Ersan Güvenç 1 May 2, 2022
Developer Bootcamp instagram clone

instagram_clone A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started

Google Developer Student Club | KFUPM 0 Nov 23, 2021
Whats-App-Clone-UI-using-Flutter - WhatsApp Clone UI using Flutter

WhatsApp ?? Clone UI ?? using Flutter ?? Screenshots Links My Socials Youtube ch

AmirHossein Bayat 6 Dec 7, 2022
Flutter chat room app made with firebase cloud firestore

Flutter chat room app made with firebase cloud firestore

Berke 2 Jul 6, 2022
Note Flutter App with CRUD: Created note app with Firebase Firestore real time storage

Note Flutter App with CRUD: Created note app with Firebase Firestore real time storage

Mustafa KIZILTAY 2 Apr 27, 2022
A simple fully working weather app with state management build using flutter.

A simple fully working weather app with state management build using flutter.

null 5 Apr 12, 2022
Wordle-clone - A Wordle-clone built using Flutter

Wordle-clone The project consists of two applications : wordle_clone_api : Which

Aswin Gopinathan 2 Jan 25, 2022
Shopping App developed using Flutter and Dart making use of Provider, Carousel Library, Google FireStore

Shopping App developed using Flutter and Dart making use of Provider, Carousel Library, Google FireStore. It's featuring standard modern shopping app UI

Atuoha Anthony 7 Jan 3, 2023
WiwaChat-WhatsApp-Like-Clone - A beautiful and fully functional WhatsApp UI clone in Flutter

Wiwa Chat - A WhatsApp Clone in Flutter A beautiful and fully functional WhatsAp

Ogbodo ThankGod 7 Nov 6, 2022