# Snapshot Overview

Learn how to use Wijmo's Snapshot class in this documentation topic 

## Content

Wijmo's __Snapshot__ class extends the __CollectionView__ class to provide real time support with Firebase collections and queries. Used in conjunction with the Firestore web client library, the __Snapshot__ class allows you to provide real time updates and implement advanced features within your Firestore database.

## Creating a Snapshot
First, we'll need to load in the Snapshot class:

```Javascript
import { Snapshot } from '@mescius/wijmo.cloud';
```

Now that the __Snapshot__ class has been loaded, you may create and use a __Snapshot__ object as follows:

```Javascript
// initialize Firestore web client library
const firebaseConfig = {
    apiKey: …
    authDomain: …,
};
firebase.initializeApp(firebaseConfig);

// get a snapshot of the "restaurants" collection
const db = firebase.firestore();
let restaurants = db.collection('restaurants');
let snapshot = new Snapshot(restaurants, {
    query: restaurants.where('type', 'in', ['Japanese', 'Italian' ])
});

// bind the snapshot to a FlexGrid
new FlexGrid('#theGrid', {
    itemsSource: snapshot
});
```

We start by initializing the web client library, then build a Snapshot based on the requested data. Here, we're using the "restaurants" collection and building the Snapshot where the restaurant type is either "Japanese" or "Italian".

The __query__ property can be changed at any time, but it should always be based on the collection that the Snapshot is initialized with (in this case, the "restaurants" collection).

Finally, the code uses the __Snapshot__ as a data source for the FlexGrid. Now, whenever a user updates a value in FlexGrid, any other user that is currently viewing that data in a different browser will have their FlexGrid updated with the new value.