Magic empowers developers to protect their users via an innovative, passwordless authentication flow without the UX compromises that burden traditional OAuth implementations.
License · Changelog · Contributing Guide
See the developer documentation to learn how you can master the Magic SDK in a matter of minutes.
Integrating your app with Magic will require our client-side NPM package:
# Via NPM:
npm install --save magic-sdk # If you're targeting web browsers
npm install --save @magic-sdk/react-native # If you're targeting React Native
# Via Yarn:
yarn add magic-sdk # If you're targeting web browsers
yarn add @magic-sdk/react-native # If you're targeting React NativeAlternatively, you can load via CDN with by adding a script tag to your app’s <head>:
<script src="https://cdn.jsdelivr.net/npm/magic-sdk/dist/magic.js"></script>Sign up or log in to the developer dashboard to receive API keys that will allow your application to interact with Magic's authentication APIs.
Then, you can start authenticating users with just one method! Magic works across all modern desktop, mobile Chrome, Safari and Firefox browsers.
import { Magic } from 'magic-sdk';
const magic = new Magic('YOUR_API_KEY');
await magic.auth.loginWithMagicLink({ email: '[email protected]' });These are packages you can install to enable Magic JS SDK functionality for your client-side application.
| Package Name | Changelog | Description |
|---|---|---|
magic-sdk |
CHANGELOG | Web/browser entry-point for Magic SDK. |
@magic-sdk/react-native |
CHANGELOG | React Native entry-point for Magic SDK. |
Extend Magic JS SDK functionality for your use-case through @magic-ext/* packages.
These are packages Magic JS SDK uses internally to work seamlessly across platforms.
| Package Name | Changelog | Description |
|---|---|---|
@magic-sdk/types |
CHANGELOG | Core typings shared between JavaScript entry-points of Magic SDK. |
@magic-sdk/pnp |
CHANGELOG | A lightweight connector that wraps Magic JS authentication with a beautiful, functional out-of-the-box login form. |
@magic-sdk/provider |
CHANGELOG | Core business logic shared between JavaScript entry-points of Magic SDK. |
@magic-sdk/commons |
CHANGELOG | Exposes a listing of common public APIs from @magic-sdk/provider and @magic-sdk/types to the platform-specific entry points. |
@magic-sdk/types |
CHANGELOG | Core typings for Magic SDK packages. |
Run tests for all packages
yarn testTest an individual package
PKG=magic-sdk yarn test
PKG=@magic-sdk/react-native yarn testTest specific files
yarn test /test/**/constructor.spec.ts
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent