Blaze is a file sharing progressive web app(PWA) that allows users to transfer files between multiple devices. It works similar to SHAREit or the Files app by Google but uses web technologies to eliminate the process of installing native apps for different devices and operating systems. It also supports instant file sharing with multiple devices at once which many file sharing apps lack.
Blaze primarily uses WebTorrent and WebSockets protocol (as a fallback) to transfer files between multiple devices. Files shared via WebTorrent are peer-to-peer(as they use WebRTC internally) which means there is direct transfer between the sender and receiver without any intermediate server. Do note that tracker servers in WebTorrent are used which carry metadata and facilitate the file transfer but do not get the complete file in any form.
- Go to a deployed client of Blaze - https://blaze.now.sh
- Set a basic nickname(this is not stored on any server)
- Create a new room. Room is where peers must join to share files among each other.
- On another device, follow the above steps and join the same room. (Make sure to give a different nickname)
- Both your devices should show up. Now start sharing some files!
Read more about how Blaze works at a basic level in this Medium article.
Read more on Deploying on your own server
- Sponsors
- Project structure
- Deploying on your own server
- Contributing
- Running Blaze in production
- Privacy and Analytics
- License
Blaze is sponsored by:
The project is divided structured into following directories - backend, frontend, common and nginx.
All the backend(or server) related source code resides under the server directory. It is built on Node.js with express and ws library for WebSockets. Thin wrappers have been created for easier interfacing with sockets.
The frontend source code is in the client directory. The dependencies of the frontend has been kept to a minimum to keep bundle sizes low. Once the frontend is built for production, all the built files are stored in build directory which can be deployed as a static app.
- Preact is being used on the frontend(previously used Svelte).
- Sass is used for CSS pre-processing and maintaing consistent themeing across the frontend.
/approute is a PWA, single-page app. Rest of the routes are pre-rendered during build time.- Feather icons is used for icons.
assets- used to store the static assets such as images.components- contains all the UI components of Blaze.hooks- custom Preact hooksroutes- components related to different routes of Blaze and router configuration.App- subroutes of the single-page app under/approute.Pages- rest of the routes that need to be pre-rendered.
scss- theme level scss. (Note: component specific scss goes within the corresponding component directory)utils- javascript utility functions
The common directory contains javascript modules that are shared by both frontend and backend. These include constants in constants.js file and utility functions in utils sub-directory.
The nginx directory contains configuration files for nginx to be used in Docker containers. These usually don't change much.
compose-nginx.conf- Used when the project is run using docker-compose.image-nginx.template- Used when the project is run on a single container from higher level Docker image.
The build process for the frontend internally setup with webpack via preact-cli. Overrides can be made in preact.config.js file. Following environment variables can be set in the build process:
| variable | description | default |
|---|---|---|
| client | ||
WS_HOST |
URL to the server that is running the Blaze WebSockets server. | 'ws://<your-local-ip>:3030' |
WS_SIZE_LIMIT |
Max file size limit when transferring files over WebSockets in bytes. | 100000000 (100 MBs) |
TORRENT_SIZE_LIMIT |
Max file size limit when transferring files over WebTorrent in bytes. | 700000000 (700 MBs) |
| server | ||
ORIGIN |
Array of string URLs to allow CORS. | * |
PORT |
Port for the server to run | 3030 |
WS_SIZE_LIMIT |
Max file size limit when transferring files over WebSockets in bytes | 100000000 (100 MBs) |
Blaze can be easily deployed on your own server using Docker. The frontend and the backend is completely decoupled from each other. Following Docker images are available:
- Blaze Server: This is the backend Node.js server that is used for WebSockets. The environment variables listed for the server above can be passed to the container. It exposes port
3030. - Blaze Client: This is the frontend progressive web app of Blaze used by clients for sharing files. Nginx is used as a web server for this statically generated frontend. The environment variables listed above can be passed as ARGS while building the image. The frontend container exposes port
80. - Blaze: This is a higher level image that includes both Blaze Server and Blaze Client images above. It must be used when docker-compose is not available in the environment, or there is a limit to run only a single container. docker-compose must be used to run Blaze in other cases which is explained in next section.
A docker-compose.yml file is present at the root of this project which runs both the server and client containers and sets up a proxy for WebSocket connections on the frontend in Nginx configuration. To run using docker-compose:
git clone https://github.com/blenderskool/blaze
cd blaze
docker-compose up -dDocumentation on contributing can be found in CONTRIBUTING.md
npm run build:feThe frontend built code would be located in the client/build directory.
npm startBlaze app can now be accessed at port 8080 🎉
- Blaze server does not track or record the files that are being shared both by WebSockets and WebTorrent.
- Any user related data like nickname, room names are always stored on device, and are only shared with the server when the user joins a room for file sharing.
- Blaze client uses Google Analytics to record the following:
- Basic visit data as recorded by Google Analytics
- If Blaze is installed on the device, and whether files are shared using share targets.
Blaze is MIT Licensed