New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

jam-core-react

Package Overview
Dependencies
Maintainers
3
Versions
19
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

jam-core-react

React hooks for creating custom audio spaces like Clubhouse / Twitter Spaces, made with WebRTC

  • 0.6.2
  • latest
  • npm
  • Socket score

Version published
Weekly downloads
10
decreased by-66.67%
Maintainers
3
Weekly downloads
 
Created
Source

jam-core-react

jam-core is client-side JavaScript/TypeScript library for Jam. You can find out more about Jam on our Gitlab page.

jam-core-react is a package that helps integrating jam-core in a React app. You can use it to build custom Jam UIs.

npm i jam-core-react

Usage

import React, {useState, useEffect} from 'react';
import {render} from 'react-dom';
import {JamProvider, useJam, use} from 'jam-core-react';

const jamConfig = {domain: 'jam.systems'};

// Wrap your app in a Provider
render(
  <JamProvider options={{jamConfig}}>
    <App />
  </JamProvider>,
  document.querySelector('#root')
);

function App() {
  // get Jam state and API methods
  let [state, api] = useJam();

  // listen to specific state changes
  let [myIdentity, roomId] = use(state, ['myIdentity', 'roomId']);

  return (
    <div>
      User: {myIdentity.info.name ?? ''},<br />
      Room: {roomId ?? ''}
    </div>
  );
}

The state and api objects are the same as returned by createJam() in jam-core. See the jam-core documentation for extensive documentation and examples of how to use them.

The additional steps to integrate with React are simple:

  • Wrap your App in a JamProvider. This will call createJam() for you.
  • Use the useJam() hook to get state and api in any component inside the Provider
  • Use the use(state, keys) hook to update the component whenever one of the keys in state change.

Example App

We have a complete example for a simple UI built with React: https://gitlab.com/jam-systems/jam/-/blob/master/ui/examples/tiny-jam-react/App.jsx

This example lets users create Jam rooms, share rooms by URL and talk to each other when in the same room -- in less than 100 lines of code.

The example is live on https://tiny-jam-react.vercel.app

FAQs

Package last updated on 14 Feb 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc