Last updated
Last updated
This quickstart is for using Sending.Network (SDN) on the client side in the browser, or front-end. Let's explore how to make a simple Sending.Network client with the ability to sync messages, create a chat room, and post messages in the room.
When you complete this quickstart, you’ll have a fully running application that can send and receive messages from the comfort of your own web browser.
Before you start, make sure you have the following dependencies installed.
Use npm or yarn to install the sdk package.
Then you are free to import the package in your code:
Kindly establish a secure key server for the proper management of your developer key. Additionally, it is necessary to outline the following API, which enables the widget to send a challenge to be signed by the key server.
To successfully complete the key verification, you need to provide a function called signWithDevKey
. This function should be attached to the window
object and will be called during widget login. Here is a snippet of code for your reference:
Now, it's time to register a DID, creating a unique identifier in the P2P messaging network.
You can connect to a public node by configuring the baseUrl
with https://portal0101.sending.network.
The following code sets up the client that connects to the server. The client will start syncing and then listen for the response to get the latest state from the server:
Once the sync is complete, you can add listeners for events as follows.:
You can listen to all incoming events, but that would be too much data for our simple application. Instead, let's listen to events that happens after you join a chat room:
Call client.stopClient
at the end of the component's lifecycle. For example:
Create a chat room and give it a name.
To invite a friend, just call the invite()
method and specify the user id and the chat room id.
You can also apply to join a room by specifying the room ID.
To post a message, create a content object and specify a target room.
You will need a developer key to access the Edge Network. For further insight into the mechanism and to request a developer key, please consult the provided guide .
Node.js
Download the latest version here
NPM
Download the latest version here
Yarn
Install Yarn here
Sending.Network JavaScript SDK
You may find the source code here