• Stars
    star
    2,414
  • Rank 19,056 (Top 0.4 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 11 years ago
  • Updated over 4 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Real-time Chat powered by Firebase

Firechat Version

Firechat is a simple, extensible chat widget powered by Firebase. It is intended to serve as a concise, documented foundation for chat products built on Firebase. It works out of the box, and is easily extended.

Status

Status: Archived

This sample is no longer actively maintained and is left here for reference only.

Live Demo

Visit firechat.firebaseapp.com to see a live demo of Firechat.

A screenshot of Jenny and Lexi the cat chatting on the Firechat demo

Setup

Firechat uses the Firebase Realtime Database as a backend, so it requires no server-side code. It can be added to any web app by including a few JavaScript files:

<!-- jQuery -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

<!-- Firebase -->
<script src="https://www.gstatic.com/firebasejs/3.3.0/firebase.js"></script>

<!-- Firechat -->
<link rel="stylesheet" href="https://cdn.firebase.com/libs/firechat/3.0.1/firechat.min.css" />
<script src="https://cdn.firebase.com/libs/firechat/3.0.1/firechat.min.js"></script>

giving your users a way to authenticate:

<script>
  function login() {
    // Log the user in via Twitter
    var provider = new firebase.auth.TwitterAuthProvider();
    firebase.auth().signInWithPopup(provider).catch(function(error) {
      console.log("Error authenticating user:", error);
    });
  }

  firebase.auth().onAuthStateChanged(function(user) {
    // Once authenticated, instantiate Firechat with the logged in user
    if (user) {
      initChat(user);
    }
  });
</script>

<button onclick="login()">Login with Twitter</button>

and initializing the chat:

<script>
  function initChat(user) {
    // Get a Firebase Database ref
    var chatRef = firebase.database().ref("chat");

    // Create a Firechat instance
    var chat = new FirechatUI(chatRef, document.getElementById("firechat-wrapper"));

    // Set the Firechat user
    chat.setUser(user.uid, user.displayName);
  }
</script>

<div id="firechat-wrapper"></div>

For detailed integration instructions, see the Firechat documentation.

Getting Started with Firebase

Firechat requires Firebase in order to authenticate users and store data. You can sign up here for a free account.

Getting Help

If you have a question about Firechat, feel free to reach out through one of our official support channels.

More Repositories

1

firepad

Collaborative Text Editor Powered by Firebase
JavaScript
3,868
star
2

reactfire

Hooks, Context Providers, and Components that make it easy to interact with Firebase.
TypeScript
3,540
star
3

angularfire

AngularJS bindings for Firebase
JavaScript
2,728
star
4

firebase-arduino

Arduino samples for Firebase.
C++
945
star
5

bolt

Bolt Compiler (Firebase Security and Modeling)
TypeScript
897
star
6

firebase-queue

JavaScript
787
star
7

action-hosting-deploy

Automatically deploy shareable previews for your Firebase Hosting sites
TypeScript
699
star
8

emberfire

The officially supported adapter for using Firebase with Ember
TypeScript
684
star
9

mlkit-material-android

ML Kit Showcase App with Material Design
Java
490
star
10

polymerfire

Polymer Web Components for Firebase
HTML
459
star
11

flutterfire_desktop

An early-stage, experimental pure-Dart implementation of Firebase SDKs.
Dart
406
star
12

mlkit-custom-image-classifier

Easily collect data and train image classification models.
Dart
403
star
13

firebase-import

Node module for importing large data into Firebase.
JavaScript
370
star
14

custom-auth-samples

Samples showcasing how to sign in Firebase using additional Identity Providers
Java
323
star
15

firebase-framework-tools

Experimental addon to the Firebase CLI to add web framework support
JavaScript
285
star
16

firechat-ios

An example chat application built using the Firebase iOS SDK
Objective-C
246
star
17

experimental-extensions

πŸ§ͺ A laboratory for new extensions created by Firebase
TypeScript
244
star
18

make-it-so-android

Kotlin
218
star
19

protobuf-rules-gen

This is an experimental protoc plugin that generates Firebase Rules for Cloud Firestore based on Google's Protocol Buffer format. This allows you to easily validate your data in a platform independent manner.
C++
198
star
20

karas-coffee

TypeScript
162
star
21

rxfire

TypeScript
140
star
22

unity-solutions

Use Firebase tools to incorporate common features into your games!
C#
128
star
23

firebase-video-samples

This repository contains sample code for some of the videos on the Firebase YouTube channel.
Swift
118
star
24

user-data-protection

Generalizable examples of protecting user data in Firebase Applications
JavaScript
97
star
25

expense-tracker

JavaScript
84
star
26

mlkit-material-ios

These apps demonstrate how to build an end-to-end user experience with Google ML Kit APIs and following the new Material for ML design guidelines.
Objective-C
80
star
27

firebase-auth-service-worker-sessions

JavaScript
79
star
28

TubeSock

A WebSocket client library implemented in Java
Java
79
star
29

codelab-friendlyeats-flutter

FlutterFire Firestore codelab. Develop a cross platform restaurant recommendation app with Flutter.
Dart
78
star
30

fastlane-plugin-firebase_test_lab

Test your app with Firebase Test Lab with ease using fastlane
Ruby
74
star
31

auth-without-play-services

Demonstrates how to implement Firebase Auth on devices without Google Play services
Kotlin
70
star
32

user-privacy

Sample of general purpose functions for user data deletion and export
JavaScript
68
star
33

remote-styles

Conditionally load CSS from Firebase Remote Config
TypeScript
64
star
34

analytics-webview

Java
63
star
35

firebase-streaming-import

public node.js script for streaming large JSON files into a Firebase
Python
61
star
36

cocos2dx-cpp-sample

Firebase Cocos2d-x samples
C++
53
star
37

firestore-codelab-extended-swift

Swift
48
star
38

codelab-kanban-fire

TypeScript
43
star
39

firebase-continue

Firebase Continue enables mobile developers to integrate activity transitioning from their mobile apps to the web
JavaScript
36
star
40

firestoreodm-flutter

Dart
35
star
41

MLKit-ARKit

Swift
34
star
42

parse-migration-tools

JavaScript
26
star
43

firepad-demo

http://demo.firepad.io/ sources
CSS
16
star
44

palm-chatbot-angular

TypeScript
15
star
45

compass-travel-planning-sample

TypeScript
15
star
46

firestore-nlp-extension

TypeScript
15
star
47

codelab-ai-genkit-rag

TypeScript
12
star
48

codelab-measure-android-view-performance

Java
11
star
49

MLKit-ARCore

Swift
11
star
50

firebase-auth-migration-helpers

Objective-C
11
star
51

codelab-contentrecommendation-android

Kotlin
11
star
52

firebase-js-sdk-performance-dashboard

Firebase JS SDK Performance Dashboard
TypeScript
9
star
53

firebase_fcm_flutter

Java
8
star
54

compass-ai-travel-planning-sample-flutter

This is a travel demo built in Flutter using Firebase Data Connect and Firebase Genkit to find ideal itineraries from a database of travel plans.
Dart
8
star
55

cmake-way-for-firebase

C++
6
star
56

codelab-fcm-and-fiam

Kotlin
5
star
57

codelab-textclassification-android

Jupyter Notebook
5
star
58

fcm-external-prober

Go
4
star
59

codelab-rules

JavaScript
4
star
60

angularfire-expert-led-class

TypeScript
4
star
61

crashlytics-migration-ios

Swift
4
star
62

crashlytics-migration-android

Java
4
star
63

firebase-console-performance-dashboard

TypeScript
4
star
64

codelab-digitclassifier-android

Kotlin
3
star
65

codelab-appdistribution-android

Kotlin
3
star
66

codelab-gemini-api-extensions

TypeScript
3
star
67

ai-extensions-codelab

JavaScript
3
star
68

poem-from-image

TypeScript
3
star
69

codelab-actions-firestore

JavaScript
3
star
70

vertexai-sdk-test-data

Python
3
star
71

firebase-apple-sdk-triage

This repo contains a collection of "skeleton" apps for quickly reproducing issues from the firebase-ios-sdk.
Swift
2
star
72

github-actions

Python
2
star
73

firebase-functions-go

Go
2
star
74

changelog

TypeScript
2
star
75

codelab-contentrecommendation-ios

Swift
2
star
76

codelab-textclassification-ios

Swift
1
star
77

codelab-digitclassifier-ios

Swift
1
star
78

codelab-feature-rollout-performance

This is the source code that accompanies the Firebase Performance Monitoring Codelab: https://firebase.google.com/codelabs/feature-rollout-performance
Java
1
star