Code Monkey home page Code Monkey logo

firehouse-chat's Introduction

Firehouse - collaborative chat using Fireproof

The example is based on the PartyKit generator. Fireproof runs anywhere.

This app is a team chat application. It uses Gravatar for user avatars and Fireproof for real-time data synchronization. A real deployment would use a secure authentication method.

In the workshop, we'll learn how the main timeline query works, how to add a new message, and how to create channels. We'll enable threads and look at AI integration on the backend. If we have time we will add file uploads and image previews.

Running the app

  • Git clone the repository
  • Run npm install
  • Run npm run dev

Changing the code

Look in the src directory for the server and client code. The server code is in server.ts and the client code is in client.ts.

The client uses components from the components directory. The main chat component is in components/Channel.tsx. The sidebar is in components/Sidebar.tsx, and it lists all the channels.

Generated PartyKit Info

Welcome to the party, pal!

This is a Partykit project, which lets you create real-time collaborative applications with minimal coding effort.

server.ts is the server-side code, which is responsible for handling WebSocket events and HTTP requests. client.ts is the client-side code, which connects to the server and listens for events.

You can start developing by running npm run dev and opening http://localhost:1999 in your browser. When you're ready, you can deploy your application on to the PartyKit cloud with npm run deploy.

Refer to our docs for more information: https://github.com/partykit/partykit/blob/main/README.md. For more help, reach out to us on Discord, GitHub, or Twitter.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.