# Overview

Raydius is a revolutionary chain abstraction platform designed to simplify the development of Web3 applications. It provides a comprehensive marketplace for functional modules, where developers can upload tools, scripts, and SDKs, earning revenue based on usage. Simultaneously, users can access the latest tools without the need to build everything from scratch, drastically lowering the barrier for developers to start building for Web3. Raydius aims to make blockchain development as seamless as creating applications in the Web2 space, bridging the gap between these two worlds and accelerating the adoption of decentralized technologies.


# Mission & Vision

## Mission

To abstract key functions of blockchain into APIs, improving the efficiency of development and empowering developers to build robust decentralized applications with ease.

***

## Vision

To democratize Web3 development, enabling everyone to participate in and contribute to the decentralized future.


# What is Raydius?

Raydius is more than just a development tool—it's a full ecosystem designed to empower developers and users in the Web3 space. By abstracting the complexities of blockchain interactions, Raydius allows developers to focus on what they do best: building innovative applications. At the same time, users benefit from access to a wide range of tools and applications without needing to understand the underlying blockchain technology.


# Chain Abstraction

Chain abstraction is the core concept behind Raydius, enabling developers to interact with multiple blockchain networks through a single, unified interface. By abstracting the complexities of blockchain operations, such as transaction management, wallet creation, and cross-chain compatibility, Raydius allows developers to build decentralized applications (dApps) with the ease of traditional web development. This abstraction layer simplifies development, reduces the learning curve, and accelerates the deployment of Web3 applications.


# Raydius SDK

The Raydius SDK is the foundation of the platform, providing developers with a powerful set of tools to build Web3 applications efficiently. The SDK is designed to be modular, flexible, and easy to integrate, ensuring that developers can quickly adapt it to their specific needs.


# Social Login SDK

The Social Login SDK revolutionizes user onboarding for Web3 applications by allowing developers to implement a frictionless authentication process. Users can access dApps using their existing social media accounts, such as Google, Twitter, or Farcaster, without needing to manage blockchain wallets manually.

## **Key Features:**

* **Multi-Platform Integration:** Supports popular social media platforms for seamless login experiences.
* **Web3 Wallet Creation:** Automatically generates a blockchain wallet for new users, simplifying the onboarding process.
* **Cross-Chain Compatibility:** Works across multiple blockchain networks, providing a unified login experience.
* **Customizable UI:** Easily adaptable interface elements to match the branding of your dApp.
* **Enhanced Security:** Implements robust security measures, including encryption and secure key storage, to protect user data and assets.


# Raydius React SDK

The Raydius React SDK allows you to authenticate your users in your React app. This guide will walk you through the process of integrating Raydius, including configuration, usage, and example scenarios.

By following the guidelines in this documentation, you can set up and use Raydius SDK effectively to enhance your app's security and user experience. For more detailed examples and further information, refer to our[ starter repo](https://github.com/Impa-Ventures/raydius-sdk/tree/main/packages/react) or the official Raydius documentation.


# Prerequisites

To integrate the Raydius React SDK, your project must be on:

* a minimum React version of 18
* a minimum TypeScript version of 5


# Installation

Install the [Raydius React SDK](https://www.npmjs.com/package/@raydius/react) using npm:

Copy

```
$ npm install @raydius/react
```

Both components can be imported directly from the SDK, like so:

Copy

```
import { RaydiusProvider, useRaydius } from '@raydius/react';
```


# Get Your Raydius App ID

Currently, we only support whitelisted projects to integrate with Raydius. Please contact us to get your app ID.


# Set Up Your App with Raydius React SDK

Once you have your app ID, import the RaydiusProvider component into your project, and wrap your app with it. It is generally recommended to render it as close to the root of your application as possible.

Example:

\
Once you have your app ID, import the RaydiusProvider component into your project, and wrap your app with it. It is generally recommended to render it as close to the root of your application as possible.

```typescript
import { RaydiusProvider} from '@raydius/react’'

export default function App({ Component, pageProps }: AppProps) {
  return (
    <RaydiusProvider config={{ appId: 'xxxxxx', theme: 'dark' }}>
      <Component {...pageProps} />
    </RaydiusProvider>
  )
}
```


# Using the useRaydius Hook

Once you've wrapped your app with the RaydiusProvider , you can now use the Raydius SDK throughout your components and pages via the useRaydius hook!

Example:

```typescript
import React from 'react'
import { useRaydius } from '@raydius/react'

export default function Home() {
  const {
    login,
    authenticated,
    userAccount,
    logout,
    linkWallet,
    unlinkWallet,
    linkGoogle,
    unlinkGoogle,
  } = useRaydius()

  const { wallets, socials } = userAccount

  if (!authenticated) {
    return (
      <button onClick={login}>login</button>
    )
  }

  return (
    <div>
      <button onClick={logout}>logout</button>
      <button onClick={linkWallet}>linkWallet</button>
      <button onClick={linkGoogle}>linkGoogle</button>
    </div>
  )
}
```


# Wallet Security

There are two ways to onboard users in Raydius:

1. **Social login**, which generates an EOA wallet for users.
2. **External wallet login**, which stores the metadata of users' own wallets.

**Social Login**

Raydius will create an EOA wallet for users during social login and help with the security and recovery of the newly created wallet. It works as follows:

* The wallet's public and private keys are generated in your user client.
* The wallet's private key is split into three key shares using Shamir's secret sharing.
* The three private key shares are encrypted by a strong password set by the user and split across the user device, Raydius, and a third-party storage provider trusted by users (Raydius provides a default - Google Drive, but the user can choose another).
* When an authenticated user attempts to sign a message, keys are reconstructed in an iframe on your site to generate the signature. This iframe's origin is isolated from your site, meaning your application never has access to private keys.
* If a user logs in to a new device, or loses an existing device, they can utilize their recovery key shares to regain access to their wallet.

**External Wallet Login**

Wallets owned by users previously are just linked to Raydius, which means Raydius only embeds the metadata (wallet address, wallet client, etc.) of those external wallets for ease of use. Therefore, Raydius cannot help with the security and recovery of those wallets.


# Setup

The Raydius React Auth SDK allows you to authenticate your users with Raydius in your React app. Before integrating Raydius, you need to use Raydius’s developer console to create and configure your apps and retrieve your API keys.

**App ID**

Your app ID is used to identify your Raydius app. This value is automatically generated when your app is created and is immutable.

Your app ID is a public value and is safe to expose on your frontend.

**App Verification Key**

Your app verification key is used to verify auth tokens that were signed by Raydius for your app. You may use this as part of your authorization workflows, e.g., verifying that requests to your backend were made by an authenticated user. See our docs for best practices around authorization.

**App Secret**

Your app secret is necessary to authenticate API requests to Raydius from your backend. You can make requests to Raydius’s API to get your users' data, delete users from your app, verify auth tokens issued by Raydius, and more.

Raydius does not store your app secret. If you do not know your current app secret, or if your current app secret has been compromised, you may reset it through the developer console. Upon resetting your app secret, please make sure to save it somewhere safe, as you will not be able to see it again after leaving the page.

Your app secret is a sensitive value that gives you permission to manage Raydius from your backend. Please do not expose it outside of your backend server.


# Advanced Usage with wagmi

The Raydius SDK integrates seamlessly with wagmi, a collection of React hooks for Ethereum. Wagmi provides hooks for connecting to wallets, managing accounts, and interacting with contracts. Using wagmi simplifies the process of signing messages and transactions in your Raydius integration.

To ensure compatibility, we are using wagmi version 1.4.12. For detailed documentation, please refer to the [wagmi documentation](https://wagmi.sh/docs).

**Example: Signing a Message**

Here is an example of how to sign a message using wagmi with Raydius:

```typescript
import React from 'react'
import { useRaydius } from '@raydius/react'
import { useSignMessage } from 'wagmi'

export default function SignMessageComponent() {
  const { userAccount } = useRaydius()
  const { signMessage } = useSignMessage({
    message: 'Hello, world!',
  })

  const handleSignMessage = async () => {
    const { data, error } = await signMessage()
    if (error) {
      console.error('Error signing message:', error)
    } else {
      console.log('Signature:', data)
    }
  }

  return (
    <div>
      <button onClick={handleSignMessage}>Sign Message</button>
    </div>
  )
}
```

**Example: Sending a Transaction**

Here is an example of how to send a transaction using wagmi with Raydius:

```typescript
import React from 'react'
import { useRaydius } from '@raydius/react'
import { useSendTransaction } from 'wagmi'
import { parseEther } from 'ethers/lib/utils'

export default function SendTransactionComponent() {
  const { userAccount } = useRaydius()
  const { sendTransaction } = useSendTransaction()

  const handleSendTransaction = async () => {
    const { data, error } = await sendTransaction({
      request: {
        to: '0xRecipientAddress',
        value: parseEther('0.1'),
      },
    })
    if (error) {
      console.error('Error sending transaction:', error)
    } else {
      console.log('Transaction:', data)
    }
  }

  return (
    <div>
      <button onClick={handleSendTransaction}>Send Transaction</button>
    </div>
  )
}
```


# Example Scenarios

**Logging In a User**

To log in a user, you can use the `login` method from the `useRaydius`hook:

```typescript
import React from 'react'
import { useRaydius } from '@raydius/react'

export default function LoginComponent() {
  const { login } = useRaydius()

  return (
    <button onClick={login}>Login</button>
  )
}
```

**Logging Out a User**

To log out a user, you can use the `logout` method from the `useRaydius` hook:

```typescript
import React from 'react'
import { useRaydius} from '@raydius/react'

export default function LogoutComponent() {
  const { logout } = useRaydius()

  return (
    <button onClick={logout}>Logout</button>
  )
}
```

**Linking a Wallet**

To link an additional wallet to a user's account, you can use the `linkWallet` method from the `useRaydius` hook:

```typescript
import React from 'react'
import { useRaydius} from '@raydius/react'

export default function LinkWalletComponent() {
  const { linkWallet } = useRaydius()

  return (
    <button onClick={linkWallet}>Link Wallet</button>
  )
}
```


# Raydius Vue SDK


# Prerequisites

To integrate the Raydius Vue SDK, your project must be on:

* a minimum Vue version of 3.x
* a minimum TypeScript version of 5


# Installation

Install the [Raydius Vue SDK](https://www.npmjs.com/package/@raydius/vue) using npm:

```bash
npm i @raydius/vue
```


# Get Your Raydius App ID

Currently, we only support whitelisted projects to integrate with Raydius. Please contact us to get your app ID.


# Set Up Your App with Raydius Vue SDK

Once you have your app ID, you can import the RaydiusVuePlugin into your project.

Example:

```typescript
// main.js
import { RaydiusVuePlugin } from "@raydius/vue";
import App from "./App.vue";
import { createApp } from "vue";
// import style
import "@raydius/vue/style.css";

const config = {
     appId: "xxx",
}
createApp(App)
  .use(RaydiusVuePlugin, {
    config,
  })
  .mount("#app");
// Some code

```


# Using the useRaydius Hook

```typescript
// App.vue or other vue component
<script setup>
import { useRaydius } from '@raydius/vue'

const { login, logout, userAccount } = useRaydius()
</script>

<template>
    <button @click="login">login</button>
    <button @click="logout">logout</button>
    <div>
        UserAccount : 
        <pre>{{ userAccount }}</pre>
    </div>
</template>

```


# RaydiusVuePlugin Config

<table><thead><tr><th width="177">attr</th><th width="95">required</th><th>description</th><th>default</th></tr></thead><tbody><tr><td>appId</td><td>true</td><td>Get from Raydius</td><td>-</td></tr><tr><td>theme</td><td>false</td><td>theme for Raydius component, the value can be 'light' or 'dark'</td><td>dark</td></tr><tr><td>defaultChain</td><td>false</td><td>defaultChain</td><td>-</td></tr><tr><td>supportedChains</td><td>false</td><td>Array of chain, chain must be imported from '@wagmi/vue/chains'</td><td>[ mainnet, goerli, sepolia, optimism, optimismSepolia, polygon, polygonMumbai, arbitrum, arbitrumSepolia, base, baseSepolia, bsc, bscTestnet, scroll, scrollSepolia ]<br></td></tr><tr><td>allowMethods</td><td>false</td><td>Array of social login method</td><td>["farcaster", "twitter", "google"]</td></tr><tr><td>allowWallets</td><td>false</td><td>Array of wallet login method</td><td>["metaMask", "walletConnect", "tomo"]</td></tr></tbody></table>


# Wallet Security

There are two ways to onboard users in Raydius:

1. **Social login**, which generates an EOA wallet for users.
2. **External wallet login**, which stores the metadata of users' own wallets.

**Social Login**

Raydius will create an EOA wallet for users during social login and help with the security and recovery of the newly created wallet. It works as follows:

* The wallet's public and private keys are generated in your user client.
* The wallet's private key is split into three key shares using Shamir's secret sharing.
* The three private key shares are encrypted by a strong password set by the user and split across the user device, Raydius, and a third-party storage provider trusted by users (Raydius provides a default - Google Drive, but the user can choose another).
* When an authenticated user attempts to sign a message, keys are reconstructed in an iframe on your site to generate the signature. This iframe's origin is isolated from your site, meaning your application never has access to private keys.
* If a user logs in to a new device, or loses an existing device, they can utilize their recovery key shares to regain access to their wallet.

**External Wallet Login**

Wallets owned by users previously are just linked to Raydius, which means Raydius only embeds the metadata (wallet address, wallet client, etc.) of those external wallets for ease of use. Therefore, Raydius cannot help with the security and recovery of those wallets.


# User Loyalty Toolkit

The User Loyalty Toolkit within the Raydius SDK empowers developers to create and manage reward systems across multiple blockchain networks. This toolkit allows for the implementation of customizable loyalty programs, issuance of points for user interactions, and facilitation of reward redemptions.

## **Key Features:**

* **Customizable Loyalty Programs:** Tailor loyalty programs to fit your project’s needs and incentivize user engagement.
* **Point Management API:** Flexible APIs to manage points across different blockchains.
* **Built-in Analytics:** Provides insights into user engagement and the effectiveness of loyalty programs.
* **Cross-Chain Support:** Allows loyalty programs to operate seamlessly across various blockchain networks.


# Analytics Dashboard

The Raydius Analytics Dashboard offers developers a comprehensive, real-time view of their dApp's performance and user engagement across multiple blockchain networks. It provides key metrics and insights that help developers optimize their applications for better user retention and overall performance.

## **Key Features:**

* **Real-Time Monitoring:** Track user interactions, transaction volumes, and other critical metrics in real time.
* **Cross-Chain Analytics:** View performance data across multiple blockchain networks from a single dashboard.
* **Customizable Reports:** Generate detailed reports tailored to specific needs, whether for internal use or investor presentations.


# Raydius Extension Store

The Raydius Extension Store is an open, permissionless marketplace that allows developers to create, distribute, and monetize Web3 functionalities. Built on the Raydius SDK, this marketplace fosters innovation and collaboration within the Web3 ecosystem.

## **Key Features:**

* **SDK Integration:** Extensions are built on top of the Raydius SDK, ensuring compatibility and leveraging the platform's chain abstraction capabilities.
* **Permissionless Contribution:** Any developer can contribute extensions, fostering a diverse and innovative ecosystem.
* **Multi-Chain Support:** Extensions can operate across various blockchain networks, thanks to Raydius's underlying infrastructure.
* **Monetization Opportunities:** Developers can earn revenue based on the usage of their extensions.


# Raydius Express

Raydius Express is a consumer-focused platform designed to introduce users to the world of cryptocurrencies and Web3 through an engaging and rewarding experience. It offers a variety of features that cater to both newcomers and seasoned crypto enthusiasts.

## **Key Features:**

* **Membership Card:** Claim your exclusive Raydius Express membership card, which grants access to a range of crypto benefits and opportunities.
* **Airdrop Eligibility:** Members qualify for airdrops from partnered projects and Raydius, potentially earning free tokens and NFTs.
* **Quest System:** Participate in interactive quests designed to familiarize users with different aspects of the crypto ecosystem while earning rewards.
* **Learn-to-Earn:** Access curated educational content about cryptocurrencies, blockchain technology, and Web3 concepts, earning rewards as you learn.
* **dApp Discovery:** Explore trending decentralized applications across multiple chains, all accessible through a user-friendly interface.
* **Cross-Chain Compatibility:** Seamlessly interact with various blockchain networks, leveraging Raydius's chain abstraction technology.
* **Community Hub:** Connect with other crypto enthusiasts, share experiences, and participate in discussions and events.


# Tech Stack Overview

Raydius is built on a robust tech stack designed to support multi-chain interactions and provide a seamless development experience. The platform is compatible with major blockchain networks and offers extensive support for integrating decentralized technologies into Web3 applications.

## **Core Components:**

* **Blockchain Agnostic Layer:** Raydius abstracts the complexities of blockchain operations, allowing for compatibility with multiple networks.
* **API Integration:** A comprehensive set of APIs that enable developers to interact with blockchain functionalities without dealing with underlying complexities.
* **Secure Infrastructure:** Built with security in mind, Raydius uses industry-standard encryption and secure key storage to protect user data and assets.


# Multi-Chain Support

Raydius supports multiple blockchain networks, allowing developers to build dApps that can interact seamlessly across different chains. This multi-chain support is made possible through the platform's abstraction layer, which handles the intricacies of each network.

## **Supported Networks:**

* **Ethereum (EVM-based Chains)**
* **Solana**
* **Other emerging blockchain networks**

## **Features:**

* **Unified API:** Interact with multiple chains through a single API.
* **Cross-Chain Transactions:** Facilitate transactions across different blockchain networks seamlessly.
* **Interoperability:** Ensure that dApps built on Raydius can interact with various blockchain networks without any additional development effort.


# Security & Compliance

Security is a top priority for Raydius. The platform implements robust security measures to protect user data, assets, and overall application integrity. Raydius also ensures compliance with relevant blockchain standards and best practices.

## **Security Features:**

* **Encryption:** All sensitive data is encrypted both at rest and in transit.
* **Secure Key Management:** Raydius uses secure key storage mechanisms to protect user wallets and private keys.
* **Compliance:** The platform adheres to industry standards and best practices for blockchain security and data protection.


# Setting Up Your Development Environment

To start building with Raydius, developers need to set up their development environment. This section provides step-by-step instructions on how to get started.

## **Steps:**

1. **Install Required Tools:** List the necessary tools and software required to develop on Raydius, such as Node.js, npm, and a code editor like VSCode.
2. **Clone the Raydius SDK Repository:** Provide instructions on how to clone the SDK from GitHub.
3. **Set Up Your Project:** Walk through the process of setting up a new project using the Raydius SDK.
4. **Run Your First dApp:** Provide a simple example of how to build and run a basic dApp using Raydius.


# Using the Raydius SDK

This section provides detailed instructions on how to use the Raydius SDK to build Web3 applications. It covers the core functionalities and provides examples to help developers get started quickly.

## **Topics Covered:**

* **Integration:** How to integrate the SDK into your existing Web3 application.
* **Authentication:** Implementing social login using the Social Login SDK.
* **Loyalty Programs:** Setting up and managing loyalty programs using the User Loyalty Toolkit.
* **Analytics:** Tracking and analyzing dApp performance with the Analytics Dashboard.


# Creating and Managing Extensions

Developers can create and manage extensions for the Raydius Extension Store. This section provides a comprehensive guide on how to build, submit, and monetize extensions.

## **Steps:**

1. **Building an Extension:** Provide a template and walk through the process of developing an extension using the Raydius SDK
2. Testing Your Extension: Instructions on how to test the extension locally before submission.
3. Submitting to the Extension Store: Explain the submission process, including guidelines and review procedures.
4. Monetization: Discuss the monetization options available to developers, including revenue sharing models.


# Integrating Raydius Express

Raydius Express offers a unique set of features for user engagement and onboarding. This section guides developers on how to integrate Raydius Express into their applications.

## **Topics Covered:**

* **Membership Card Integration:** How to implement the membership card system in your dApp.
* **Quest System Integration:** Steps to incorporate the quest system for user engagement.
* **Learn-to-Earn Integration:** Setting up educational content and reward systems within your application.
* **Cross-Chain Integration:** Ensuring seamless interaction with multiple blockchain networks through Raydius Express.


# Overview of $RAYS

$RAYS is the native utility token of the Raydius platform. It plays a central role in the ecosystem, powering transactions, incentivizing developers, and facilitating governance.


# Token Utilities

$RAYS has multiple use cases within the Raydius ecosystem, each designed to enhance the platform’s functionality and incentivize participation.

## Platform Currency

$RAYS is used as the primary currency for transactions within the Raydius ecosystem. Developers use it to access the SDK, publish extensions, and utilize other platform services.

## User Incentives (Build to Earn)

Developers who build high-engagement applications can earn $RAYS as a reward, incentivizing the creation of valuable tools and services within the ecosystem.

## Staking for Extensions

To launch an extension in the Raydius Extension Store, developers are required to stake $RAYS. This staking mechanism ensures that only serious and committed developers contribute to the ecosystem.

## Decentralized Governance

$RAYS holders have the ability to participate in the governance of the Raydius platform. They can vote on proposals, influence platform decisions, and help guide the development of the ecosystem.


# Token Demand and Supply

This section outlines the factors driving demand for $RAYS and the mechanisms controlling its supply.

## Developer and User Demand

The demand for $RAYS is driven by its utility in accessing platform features, staking for extensions, and participating in governance.

## Supply Distribution

Discuss the distribution model for $RAYS, including initial supply, distribution among stakeholders, and any mechanisms for controlling inflation.


# Community Hub

The Raydius Community Hub is the heart of the platform’s user and developer community. It provides a space for collaboration, knowledge sharing, and community-driven initiatives.

## **Features:**

* **Forums:** Discussion boards for developers and users to share insights, ask questions, and collaborate on projects.
* **Events:** Information on upcoming community events, hackathons, and developer meetups.
* **Contributor Programs:** Opportunities for community members to contribute to the platform and earn rewards.


# Partnerships & Integrations

Raydius is actively building partnerships with other projects and platforms to enhance its ecosystem. This section highlights key partnerships and integrations that bring additional value to Raydius users.

## **Key Partners:**

* **Blockchain Networks:** Partnerships with major blockchain networks to ensure seamless integration and support.
* **dApp Developers:** Collaborations with leading dApp developers to bring innovative applications to the Raydius ecosystem.
* **Educational Platforms:** Partnerships with educational platforms to expand the Learn-to-Earn offerings.


# Developer & User Incentives

Raydius offers a variety of incentives to both developers and users, encouraging active participation in the ecosystem.

## **Incentive Programs:**

* **Developer Bounties:** Opportunities for developers to earn rewards for building specific tools or features.
* **User Rewards:** Loyalty programs, airdrops, and other rewards designed to engage users and promote platform adoption.
* **Referral Programs:** Earn $RAYS by referring new developers and users to the Raydius platform.


# General Questions

<details>

<summary>What is Raydius?</summary>

Raydius is a chain abstraction platform that simplifies Web3 development by providing a marketplace for functional modules, enabling developers to build decentralized applications more efficiently.

</details>

<details>

<summary>How can I start building with Raydius?</summary>

You can start by setting up your development environment using the Raydius SDK, following the instructions in our Getting Started guide.

</details>


# Technical Questions

<details>

<summary>What blockchain networks are supported by Raydius?</summary>

Raydius supports multiple blockchain networks, including Ethereum (EVM-based chains), Solana, Polkadot, and others.

</details>

<details>

<summary>How do I integrate the Raydius SDK into my dApp?</summary>

Detailed instructions on SDK integration can be found in the Using the Raydius SDK section of this documentation.

</details>


# Token-Related Questions

<details>

<summary>What is the purpose of $RAYS?</summary>

$RAYS is the native utility token of the Raydius platform, used for transactions, staking, governance, and as a reward for developers.

</details>