Skip to content

Commit 6f345d9

Browse files
ihsrahamihsraham
committed
Added ton-telegram-example from personal repo
1 parent aa9a5f6 commit 6f345d9

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+27128
-0
lines changed

‎other/ton-telegram-example/README.md‎

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
# Web3Auth (`@web3auth/modal`) Telegram React-Vite Express Example
2+
3+
[![Web3Auth](https://img.shields.io/badge/Web3Auth-SDK-blue)](https://web3auth.io/docs/sdk/web)
4+
[![Web3Auth](https://img.shields.io/badge/Web3Auth-Community-cyan)](https://community.web3auth.io)
5+
6+
[Join our Community Portal](https://community.web3auth.io/) to get support and stay up to date with the latest news and updates.
7+
8+
This example demonstrates how to use Web3Auth with Telegram Login in a React Vite frontend. Express is used to create the Telegram OAuth server that issues JWT tokens for the Web3Auth SDK.
9+
10+
## How to Use
11+
12+
### Download Manually
13+
14+
```bash
15+
npx degit Web3Auth/web3auth-examples/other/ton-telegram-example w3a-ton-telegram-example
16+
```
17+
18+
### Setup
19+
20+
1. Create a `.env` file in the `server/api` directory with the following content:
21+
22+
```bash
23+
TELEGRAM_BOT_NAME="" # e.g. @your_bot_name
24+
TELEGRAM_BOT_TOKEN="" # e.g. 1234567890:ABCDEF
25+
SERVER_URL="" # e.g. http://localhost:3000
26+
CLIENT_URL="" # e.g. http://localhost:5173
27+
JWT_KEY_ID="" # e.g. your_key_id
28+
```
29+
30+
2. Create a `.env.local` file in the root directory with the following content:
31+
32+
```bash
33+
VITE_SERVER_URL="" # e.g. http://localhost:3000
34+
VITE_W3A_VERIFIER_NAME="" # e.g. w3a-telegram-demo
35+
VITE_W3A_CLIENT_ID="" # e.g. your_client_id
36+
```
37+
38+
Follow [this Telegram guide](https://web3auth.io/docs/guides/telegram) to follow along.
39+
40+
Install & Run:
41+
42+
```bash
43+
cd w3a-example/server
44+
npm install
45+
## start server
46+
# server will be running on localhost:8080
47+
cd api
48+
node index.js
49+
# use ngrok to expose the server to the internet
50+
# ngrok http 3000
51+
# copy the ngrok url and update the SERVER_URL in the .env file
52+
# also update the telegram bot domain to the ngrok url
53+
54+
55+
## now, start the client
56+
cd ..
57+
npm install
58+
npm run start
59+
# client will be running on localhost:5173
60+
```
61+
62+
## Important Links
63+
64+
- [Website](https://web3auth.io)
65+
- [Docs](https://web3auth.io/docs)
66+
- [Guides](https://web3auth.io/docs/guides)
67+
- [SDK / API References](https://web3auth.io/docs/sdk)
68+
- [Pricing](https://web3auth.io/pricing.html)
69+
- [Community Portal](https://community.web3auth.io)

‎other/ton-telegram-example/index.html‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<script type="module">
5+
import { Buffer } from "buffer";
6+
import process from "process";
7+
window.Buffer = Buffer;
8+
window.process = process;
9+
</script>
10+
<meta charset="utf-8" />
11+
<meta name="viewport" content="width=device-width, initial-scale=1" />
12+
<meta name="theme-color" content="#000000" />
13+
<meta name="description" content="Web site created using create-react-app but later moved to vite" />
14+
15+
<title>Web3auth SFA Web Ton Telegram Demo App</title>
16+
</head>
17+
<body>
18+
<noscript>You need to enable JavaScript to run this app.</noscript>
19+
<div id="root"></div>
20+
21+
<script type="module" src="/src/index.tsx"></script>
22+
</body>
23+
</html>

0 commit comments

Comments
 (0)