{"id":31452682,"url":"https://github.com/zebrajaeger/shareit","last_synced_at":"2026-02-16T10:03:25.473Z","repository":{"id":301311020,"uuid":"996617123","full_name":"zebrajaeger/shareIt","owner":"zebrajaeger","description":null,"archived":false,"fork":false,"pushed_at":"2025-06-26T07:33:50.000Z","size":39,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-10-01T07:49:58.280Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/zebrajaeger.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-06-05T07:54:23.000Z","updated_at":"2025-06-26T07:33:54.000Z","dependencies_parsed_at":"2025-06-26T08:34:00.272Z","dependency_job_id":null,"html_url":"https://github.com/zebrajaeger/shareIt","commit_stats":null,"previous_names":["zebrajaeger/shareit"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/zebrajaeger/shareIt","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zebrajaeger%2FshareIt","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zebrajaeger%2FshareIt/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zebrajaeger%2FshareIt/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zebrajaeger%2FshareIt/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zebrajaeger","download_url":"https://codeload.github.com/zebrajaeger/shareIt/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zebrajaeger%2FshareIt/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29505671,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-16T09:05:14.864Z","status":"ssl_error","status_checked_at":"2026-02-16T08:55:59.364Z","response_time":115,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-10-01T07:49:53.895Z","updated_at":"2026-02-16T10:03:25.435Z","avatar_url":"https://github.com/zebrajaeger.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ShareIt\n\n**ShareIt** is a Progressive Web App (PWA) that enables real-time text synchronization across all connected browser instances (tabs/clients). The application consists of two main components:\n\n1. **Client** (`client/`):\n\n   * Static assets (HTML, CSS, JavaScript, Manifest, Service Worker, Icons)\n   * Renders a large text area, handles WebSocket communication, clipboard functions, and connection status indicator\n\n2. **Server** (`server/`):\n\n   * Node.js Express server serving static files and providing a WebSocket endpoint\n   * Maintains the current text value in a variable and broadcasts changes to all connected clients\n\nUsing Docker Compose, the entire project can be easily run in a containerized environment.\n\n---\n\n## Table of Contents\n\n1. [Project Overview](#project-overview)\n2. [Directory Structure](#directory-structure)\n3. [Prerequisites](#prerequisites)\n4. [Installation and Local Usage (without Docker)](#installation-and-local-usage-without-docker)\n5. [Running with Docker Compose](#running-with-docker-compose)\n6. [PWA Features](#pwa-features)\n7. [License](#license)\n\n---\n\n## Project Overview\n\nShareIt provides bi-directional real-time synchronization of text among multiple clients through a single large text area:\n\n* **Text Area**: A `\u003ctextarea\u003e` element in the browser where users can type or paste text.\n* **WebSocket Communication**: Whenever a user clicks the �Send� button (or uses the clipboard button), the text is sent to the server over a WebSocket connection.\n* **Broadcast**: The server saves the new text and immediately broadcasts it to all currently connected clients.\n* **Connection Status Indicator**: A colored circle (green/red) indicates if the WebSocket connection is active. If the connection is lost, the client automatically attempts to reconnect every 2 seconds.\n* **Clipboard Functions**:\n\n  * �Send Clipboard� Button: Reads text directly from the system clipboard and sends it to the server (without updating the local text area; the broadcast from the server will update all text areas).\n  * �Copy� Button: Copies the current text from the text area to the system clipboard.\n\nAdditionally, ShareIt is configured as a PWA so that, when served over HTTPS, it can be installed by browsers to run as a standalone app without typical browser chrome.\n\n---\n\n## Directory Structure\n\n```\nshareIt/\n+-- client/                     # All static PWA assets\n|   +-- index.html               # Main HTML file\n|   +-- main.js                  # Client-side logic (WebSocket, buttons, connection status)\n|   +-- styles.css               # Optional external CSS (can also be inline in index.html)\n|   +-- manifest.json            # PWA manifest (app name, icons, display mode)\n|   +-- service-worker.js        # Minimal Service Worker for PWA installation\n|   +-- favicon.ico              # Favicon (optional, avoids 404 errors)\n|   +-- icons/                   \n|       +-- icon-192.png         # PWA icon (192�192)\n|       +-- icon-512.png         # PWA icon (512�512)\n|\n+-- server/                     # Node.js server code\n|   +-- server.js                # Express + WebSocket logic\n|   +-- package.json             # Dependencies (express, ws)\n|   +-- package-lock.json        # npm lockfile\n|\n+-- Dockerfile                  # Instructions to build the Docker image\n+-- docker-compose.yml          # Docker Compose configuration\n+-- .dockerignore               # Excludes unnecessary files from the Docker build\n```\n\n---\n\n## Prerequisites\n\n* **Git** (for cloning the repository)\n* **Node.js = 18** (only required if you want to run without Docker)\n* **npm** (for local installation)\n* **Docker = 20.x** and **Docker Compose = 1.29.x** (for containerized deployment)\n\n---\n\n## Installation and Local Usage (without Docker)\n\nIf you want to run ShareIt locally with Node.js and npm, follow these steps:\n\n1. Clone the repository:\n\n   ```bash\n   git clone https://github.com/zebrajaeger/shareIt.git\n   cd shareIt\n   ```\n\n2. Install dependencies:\n\n   ```bash\n   cd server\n   npm install\n   ```\n\n   This will create a `package-lock.json` in the `server/` folder (if it does not already exist).\n\n3. Start the server:\n\n   ```bash\n   npm start\n   ```\n\n   By default, the server listens on port **3000**.\n\n   * Open your browser to `http://localhost:3000/`\n   * The page will load `client/index.html` and establish a WebSocket connection for text synchronization.\n\n4. Optional: Live-reload during development:\n\n   * If you have `nodemon` installed globally (`npm install -g nodemon`), you can run:\n\n     ```bash\n     nodemon server.js\n     ```\n\n     in the `server/` directory to automatically restart the server on code changes.\n   * For client-side changes, you can optionally run BrowserSync:\n\n     ```bash\n     npx browser-sync start --proxy \"localhost:3000\" --files \"client/**/*.*\"\n     ```\n\n     This is only necessary if you want automatic page reloads when modifying client files.\n\n---\n\n## Running with Docker Compose\n\nThe recommended way to run ShareIt in an isolated environment is with Docker Compose. This eliminates the need to install Node.js and npm locally.\n\n1. Clone the repository:\n\n   ```bash\n   git clone https://github.com/zebrajaeger/shareIt.git\n   cd shareIt\n   ```\n\n2. Build the Docker image:\n\n   ```bash\n   docker-compose build\n   ```\n\n   This command reads the `Dockerfile` in the project root, installs npm dependencies inside the container, and copies both server and client files into the image.\n\n3. Start the container in detached mode:\n\n   ```bash\n   docker-compose up -d\n   ```\n\n   * Docker Compose will create and run a container named `text-sync-container` based on the `text-sync-app:latest` image.\n   * The container runs the Node.js server, listening on port 3000 inside the container.\n\n4. Open ShareIt in your browser:\n\n   ```\n   http://localhost:3000/\n   ```\n\n   � You should see the PWA page with the large text area, connection status indicator, and buttons.\n\n   * To test synchronization, open the same URL in two browser tabs and type text in one tab � it should appear in both.\n\n5. View container logs:\n\n   ```bash\n   docker-compose logs -f\n   ```\n\n   This shows server output and WebSocket connection messages.\n\n6. Stop and remove the container:\n\n   ```bash\n   docker-compose down\n   ```\n\n   The `restart: unless-stopped` setting ensures the container restarts on failure unless you manually stop it.\n\n---\n\n## PWA Features\n\nShareIt is set up as a PWA so that it behaves like a native app:\n\n1. **Manifest**\n\n   * The file `client/manifest.json` includes:\n\n     * `name`, `short_name`, `start_url`, `display: \"standalone\"`, `background_color`, `theme_color`, and paths to icons (`icons/icon-192.png` \u0026 `icons/icon-512.png`).\n   * This informs browsers to offer an �Install� option.\n\n2. **Service Worker**\n\n   * `client/service-worker.js` is a minimal Service Worker that includes `install` and `activate` events.\n   * Once registered by the browser, the app can be installed and later opened in a standalone window without browser UI.\n\n3. **Icons**\n\n   * Place `client/icons/icon-192.png` (192�192) and `client/icons/icon-512.png` (512�512) in the `icons/` folder.\n   * These images are used in the installation dialog and as the homescreen/desktop icon.\n\n4. **Local Installation (Development)**\n\n   * Start the server (locally or via Docker).\n   * Open `http://localhost:3000/` in Chrome/Edge: You should see an �Install� icon (? or ?) in the address bar.\n   * Click it and follow the prompts to install the app.\n   * The app will open in a standalone window, omitting the typical browser address bar.\n\n---\n\n## License\n\nShareIt is released under the MIT License. See the [LICENSE](LICENSE) file for more details.\n\n---\n\n**Repository:**\n[https://github.com/zebrajaeger/shareIt](https://github.com/zebrajaeger/shareIt)\n\nEnjoy using ShareIt! Contributions, issues, and pull requests are welcome. If you encounter any problems or have questions, please open an issue in the GitHub repository.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzebrajaeger%2Fshareit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzebrajaeger%2Fshareit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzebrajaeger%2Fshareit/lists"}