Collaborative Editor
The worst time to have a heart attack is during a game of charades.
Description
Inspired by the Obsidian note-taking app and Gitbook, this project is a React-based text-editing app with a focus on collaboration and mind mapping. A graph-editing tool creates a schematic representation of a note stucture, which can be used as a visual representation of anything graph-like from roadmaps to tutorials, whose topics link from one to node to another.
Front-end Features
Text-editor
Standard text-formatting (font color/size/style, headings, highlight, alignment, etc.)
Tables / Cards / Columns /Task-list
Images
Code Blocks
Slash-commands
Collaboration via Yjs and webRTC connection bindings
Multi-media: AI front-end
Multi-media: Drawing Editor
Multi-media: Graph Editor
Tech Stack
Backend
The server is divided into several Cloudflare Workers, and depending on the complexity of the serverless function, contains an Elysia.js server framework. Data is saved and fetched from three locations, namely:
MongoDB - comments and emoji reactions, fetched via REST API
Cloudflare KV - user generated files stored as JSON, and user metadata
Cloudflare R2 - for images
Security is via JSON web tokens stored in the browser cookie. Collaboration via Yjs and webRTC peer-to-peer networking.
Frontend
Built with React and Remix in single-page application mode. Jotai for state management. shadcn and Tailwind for theming. Also utilized the following libraries, listed with their respective components:
Cytoscape.js - graph visualization
Tiptap - text editing
Excalidraw - drawing component
The Pet Hotel Web App is a comprehensive digital solution designed to streamline operations for pet boarding facilities. It is structured into three core components, tailored to meet the needs of both end-users and administrators with a solid backend foundation for robust data management and application logic.
Client-Facing Website: This front-end interface is designed for pet owners, offering them a seamless experience in booking accommodations, checking availability, and viewing the status of their pets. It provides intuitive navigation and real-time updates, enhancing customer interaction and satisfaction.
Administrator's Website: Dedicated solely to facility management, this interface allows administrators to manage bookings, update pet and room information, adjust pricing, and customize service offerings. It includes functionality for reporting and analytics, enabling administrators to make informed decisions based on current business metrics.
Backend: The backbone of the application, the backend is responsible for handling business logic, database management, and server-side data processing. It ensures data integrity and security, processes transactions, and communicates between the web interfaces and the database.
Series 3 of 4 in the Featured Collection.
Last updated