Svelte 100ms

screenshot of Svelte 100ms
svelte

Svelte 100ms

A Video Call App Built with 100ms and Svelte

Overview:

This product is a Video Call app built with SvelteKit, using 100ms' SDK for the conferencing part. It is adapted from the React Quickstart and includes additional features. Users can deploy the app on Vercel and try out the live demo on CodeSandbox. The component structure includes different views for the join form page and the conference page.

Features:

  • Built with SvelteKit and 100ms' SDK for video conferencing
  • Deployment options with Vercel and CodeSandbox
  • Join form page and conference page views
  • Ability to join a video call, mute/unmute audio, and see others in the room

Installation:

To install the Video Call app, follow these steps:

  1. Clone the app from the GitHub repository using the "Deploy" button above.
  2. Deploy the app on Vercel by following the provided instructions.
  3. Create an account on https://dashboard.100ms.live/.
  4. Get an auth token for a room by following specific instructions provided.
  5. Open the Demo link and enter your name and auth token to test the call.
    • Note: There are two demo links available, one for the main branch and one for the features branch. Each link offers different functionalities.
  6. Follow the step-by-step commits provided in the repository to build the app from scratch.

Summary:

The Video Call app is a SvelteKit-based application that allows users to participate in video conferencing using 100ms' SDK. It offers features such as joining a call, muting/unmuting audio, and observing other participants in the room. The app can be deployed on Vercel and tested using the provided demo links. Users can also create their own version of the app by following the step-by-step commits in the repository.

svelte
Svelte

Svelte is a modern front-end framework that compiles your code at build time, resulting in smaller and faster applications. It uses a reactive approach to update the DOM, allowing for high performance and a smoother user experience.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.

vite
Vite

Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects