MinChat Documentation
SupportHome
  • Introduction
  • Getting Started
    • Using Vanilla Javascript
    • Using React
    • Using React Native
  • Webhooks
    • Overview
  • Rest APIs
    • Overview
  • Websockets
    • Overview
  • Customize UI
    • Customizing React UI
  • Reference
    • User
    • Message
    • File
  • Javascript SDK
    • Overview
    • Conversation (Chat)
  • React SDK
    • Overview
    • useChats hook
    • useMessages hook
    • useUser hook
    • useMinChat
    • Conversation (Chat)
  • React Native SDK
    • Overview
    • useChats hook
    • useMessages hook
    • useUser hook
    • useMinChat
    • Conversation (Chat)
    • File
Powered by GitBook
On this page
  • Installation
  • Initialize SDK
  • Creating a user
  • Fetching a user
  • Starting a conversation
  • Send Message
  • Get Messages
  • Listen for new messages
  • Get list of conversations of current user
  • Listen for new conversations

Was this helpful?

  1. Getting Started

Using Vanilla Javascript

Last updated 1 year ago

Was this helpful?

Installation

To get started, you will need to install MinChat Javascript SDK in your Javascript front-end project.

npm install @minchat/js
yarn add @minchat/js
pnpm install @minchat/js

Initialize SDK

Next, initialize the MinChat SDK passing the MINCHAT_API_KEY as a parameter as well as a user. The API Key can be found on the

add to imports section
import MinChat from '@minchat/js'
const currentUser = {
        username: "micheal",
        name: "Micheal Saunders",
}

const minchat = await MinChat.getInstance(MINCHAT_API_KEY).connectUser(currentUser)

You can view more details about the user parameters .

Each connection to MinChat has to specify the current to send messages as, this is achieved with connectUser(...)

note: connectUser(...) automatically creates a new user in the system, if a user with the same username already exists then it will reuse that user.

Creating a user

before you can start a conversation with another user, the user would first need to be created.

const otherUser = await minchat.createUser({ 
                                  username: "example-username", 
                                  name: "Example Name",
                            })
                            

note: createUser(...) automatically creates a new user in the system, if a user with the same username already exists then it will reuse that user.

Fetching a user

You can fetch an already existing user using either their username or their id.


const otherUser = await minchat.fetchUser("example-username")
                            

const otherUser = await minchat.fetchUserById("example-id")

Starting a conversation

A Conversation(Chat) is a place for two or more users to chat. That could mean a simple direct message between users, or it might be something fancier. MinChat works with all kinds of conversations, from group chats to one-on-one conversations.

One-on-One Conversation

const chat = await minchat.chat(otherUser.username)

Group Chat


const chat = await minchat.groupChat({
                                title: "Epic Group Chat", 
                                memberUsernames: [ otherUser.username , thirdUser.username ] 
                            })

Send Message

To send a message, call a function on the chat object.


chat.sendMessage({ text: "Hello World!" })
  

Get Messages

Messages retrieved in a conversation are paginated to 25 messages at a time.


const { messages , page , totalMessages , totalPages } = await chat.getMessages(1 /** page to query **/ )
chat.getMessages(1 /** page to query **/)
  .then(({  messages , page , totalMessages , totalPages }) => {
       
         //do something with the messages  
         
  })

Listen for new messages

add a listener to listen for new messages received in the chat.

chat.onMessage((message) => {

        //do something with message
        
})

Get list of conversations of current user

You can get a list of the conversations of the current user. conversations retrieved are paginated to 25 chats at a time.


const { chats , page , totalChats , totalPages  } = await minchat.getChats(1 /** page to query **/ )
minchat.getChats(1 /** page to query **/)
  .then(({ chats , page , totalChats , totalPages }) => {
 
       //do something with the list of chats
   
  })

Listen for new conversations

Add a listener to listen for conversations that receive a new message.

minchat.onChat((chat) => {
    //do something with the chat
})

This concludes our setup instructions for our most basic form of integration. In this short guide, you've taken your javascript application to the next level with powerful user-to-user chat. You also learned more about the fundamentals of MinChat, and how it all fits together. Most importantly, you've built a starting point to try out all the features MinChat offers.

In MinChat, a is a person that uses your app. Typically, you will have one MinChat for each user in your own database.

Usually, you would create users based on the data from your database. A is represented by a JSON object.

You can view more details about the user parameters .

There's not much point in a chat app with only one person using it, with a created we can start a new conversation with them.

You can view more details about the response and parameters .

You can view more details about the response and parameters .

You can view additional optional parameters .

You can view more details about the response and parameters .

You can view more details about the response and parameters .

You can view more details about the response and parameters .

You can view more details about the response and parameters .

For more additional features, view the .

Minchat dashboard.
here
User
User
User
User
here
User
Reference Docs
here
here
here
here
here
here
here