Now it's time, let's add in-app activity feeds to your app.
First, let's add the Client SDK. Include the Client SDK globally.
Now it's time, let's add in-app activity feeds to your app.
First, let's add the Client SDK. Include the Client SDK globally.
<script src="https://{your-url}/javascript/weavy.jquery.js"></script>
The {your-url}
refers to the hostname where you installed the Weavy Server SDK.
When you have loaded the SDK, you can create a new Weavy()
instance anywhere at any point in your app.
The Weavy instance is the main entry point used when embedding Weavy. It sets up a connection to a Weavy server and handles realtime communication, event distribution, and more.
To avoid timing issues when loading it may be a good idea to make sure you instantiate Weavy at the window DOMContentLoaded event.
For our example, make sure you have a container in your app named id="weavy-feed"
The container must also have a specified width & height.
Use the encoded JWT you generated in the previous step.
<script>
var jwt = "{your generated jwt token}";
var weavy = new Weavy({ jwt: jwt });
var space = weavy.space({ key: "demo" });
space.app({
key: "feed-demo",
type: "posts",
container: "#weavy-feed"
});
</script>
Spaces are used in Weavy to group apps around a subject or entity. Within those spaces are members. Any members within a space have access to any apps within that space.
In order to set up the Weavy space, we need a unique identifier - a key - in the sample snippet above that's key: "feed-demo"
Keys must be unique because they are used to grab the contextual information for that specific space or app. Any unique identifier will do - it just can't be too long.
If you've done everything correctly, you should now see Weavy Activity Feed rendered in your UI - cool, right? 😉
Could look like something like this...