Convex Chat App

In this project, we are developing a chat application where users can message each other. Users can send text messages as well as files.

Key Features

• Real-time messaging between users
• Ability to send files in addition to text messages
• Different styles to distinguish messages sent by users

Technologies Used

• React Native: A JavaScript framework used for developing mobile applications.
• TypeScript: A superset of JavaScript that adds static type checking.
• Convex: https://www.convex.dev/

Code Example

The following code snippet shows how a message is rendered:

const renderMessage: ListRenderItem<Doc<"messages">> = ({ item }) => {
    const isUserMessage = item.user === user;

    return (
      <View
        style={[
          styles.messageContainer,
          isUserMessage
            ? styles.userMessageContainer
            : styles.otherMessageContainer,
        ]}
      >
        {item.content !== "" && (
          <Text
            style={[
              styles.messageText,
              isUserMessage ? styles.userMessageText : null,
            ]}
          >
            {item.content}
          </Text>
        )}
        {item.file && (
          <Image
            source={{ uri: item.file }}

Installation

Follow these steps to set up the project:

1. Clone the project to your local machine.
2. Run npm install to install the necessary dependencies.
3. Run npm start to start the application.

Screenshots