Smol Chat

💥 Introduction

Smol Chat is a user-friendly chat app powered by React and TypeScript. Chat privately with friends and join global conversations. Share messages and enjoy a secure and simple interface. Join Smol Chat and experience modern chatting with ease.

🚀 Features

• Private Chats: With Smol Chat, users can effortlessly create private chat rooms, ensuring secure and confidential communication with their selected contacts.
• Global Chat: Engage in open discussions or casual conversations with individuals in the global chat feature, promoting a sense of community and global interaction.
• Real-Time Notifications: Receive instant alerts for new messages, so you can stay connected with your contacts in real time.
• Privacy: Smol Chat takes user privacy seriously by setting up permissions using Server SDK of Appwrite through Appwrite Functions.
• Customization: Personalize your Smol Chat experience with customizable profiles, avatars to reflect your unique personality.

📜 Packages

• React - for building user interfaces
• Typescript - (do u still use JS?)
• Appwrite - open source backend services
• React Router V6 - lightweight routing library
• React Helmet - a document head manager
• Nanostores - tiny state manager
• Material UI - simple, customizable, and accessible library of React components
• Node.js - used for writing Appwrite Functions

🛠️ Local development

To ensure that you are able to install everything properly, I would recommend you to have Yarn, React and Vite installed. You'll have to set up an AppWrite account, and then add all the details into your .env file. Once you've connected your application to AppWrite. Run the commands:

• yarn to install dependencies
• yarn run dev to start local dev server

↔️ Entity relationship diagram

⚙️ Example .env file

Variable name	Value
VITE_PROJECT_ID	ID of your Appwrite project
VITE_DATABASE_ID	ID of your database
VITE_COLLECTION_ID_USERS	ID of users collection
VITE_COLLECTION_ID_MESSAGES	ID of messages collection
VITE_COLLECTION_ID_CHATS	ID of chats collection
VITE_COLLECTION_ID_CHATS_MEMBERS	ID of chats_members collection
VITE_BUCKET_ID	ID of photos bucket
VITE_COLLECTION_ID_MESSAGES_UNREAD	ID of messages_unread collection
VITE_FUNCTION_ID_CREATE_MESSAGE	ID of createMessage function
VITE_FUNCTION_ID_CREATE_CHAT	ID of createChat function