Overview of My Submission

CAPP App is a web based realtime chat application. It has some features like realtime chat, add friend, search people, search chat, protected route, and login using google account.

This application is built using React.js for the frontend library, Boostrap for the CSS framework, Appwrite for data storage, authentication and realtime features and express.js for custom servers as needed.

The inspiration behind the making of this application is whatsapp so that it looks similar to whatsapp.

Submission Category:

Wacky Wildcards

Link to Code

h8-exploration / capp-appwrite

CAPP - Realtime Chat App

CAPP App is a web based realtime chat application. It has some features like realtime chat, add friend, search people, search chat, protected route, and login using google account.

This application is built using React.js for the frontend, Boostrap for the CSS framework, Appwrite for data storage and realtime features and express.js for custom servers as needed.

The inspiration behind the making of this application is whatsapp so that it looks similar to whatsapp.

Installation and Setup

Appwrite

1. Install & running AppWrite on your machine. You can follow this instruction

2. Create Appwrite Project

3. Create API keys

4. Create Database collection chats and friends with following attributes

friends:
  userId: String,
  friendId: String,
  createdAt: String


chats:
  userIds: [String]
  userId: String,
  text: String,
  createdAt: String

5. Create indexes for chats and friends collections

friends
  Index Key: userId
  type: fulltext
  attributes: userId (ASC)

chats:
  Index Key: userIds
  type: fulltext
  attributes: userIds

…

View on GitHub

Additional Resources / Info

Screenshots

Login Page

Home Page

Find People

Chat Room

Project Contributor

Ajat Darojat: https://github.com/ajatdarojat45

Comments

[haimantika mitra]

This looks amazing! 🤩

P.S: We have a lot of interesting things happening in our Appwrite discord, we would love to see you there!

discord.gg/KKZprAnX