Skip to content

Commit b6ec31e

Browse files
yeehan-crypto-comyeehan-crypto-com
authored
Merge pull request #107 from crypto-com/BLCKCHN-374-tx-module-example
add example transaction app
2 parents 2645169 + 011bc5e commit b6ec31e

19 files changed

Lines changed: 3828 additions & 0 deletions

‎sdk-examples/categories/transaction/.gitignore‎

Lines changed: 150 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,150 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
# Runtime data
11+
pids
12+
*.pid
13+
*.seed
14+
*.pid.lock
15+
16+
# Coverage directory used by tools like istanbul
17+
coverage
18+
*.lcov
19+
20+
# nyc test coverage
21+
.nyc_output
22+
23+
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
24+
.grunt
25+
26+
# Bower dependency directory (https://bower.io/)
27+
bower_components
28+
29+
# node-waf configuration
30+
.lock-wscript
31+
32+
# Compiled binary addons (https://nodejs.org/api/addons.html)
33+
build/Release
34+
35+
# Dependency directories
36+
node_modules/
37+
jspm_packages/
38+
39+
# TypeScript v1 declaration files
40+
typings/
41+
42+
# TypeScript cache
43+
*.tsbuildinfo
44+
45+
# Optional npm cache directory
46+
.npm
47+
48+
# Optional eslint cache
49+
.eslintcache
50+
51+
# Microbundle cache
52+
.rpt2_cache/
53+
.rts2_cache_cjs/
54+
.rts2_cache_es/
55+
.rts2_cache_umd/
56+
57+
# Optional REPL history
58+
.node_repl_history
59+
60+
# Output of 'npm pack'
61+
*.tgz
62+
63+
# Yarn Integrity file
64+
.yarn-integrity
65+
66+
# dotenv environment variables file
67+
.env
68+
.env.test
69+
.env.local
70+
.env.development.local
71+
.env.test.local
72+
.env.production.local
73+
74+
# parcel-bundler cache (https://parceljs.org/)
75+
.cache
76+
.parcel-cache
77+
78+
# Next.js build output
79+
.next
80+
81+
# Nuxt.js build / generate output
82+
.nuxt
83+
dist
84+
85+
# Gatsby files
86+
.cache/
87+
# Comment in the public line in if your project uses Gatsby and *not* Next.js
88+
# https://nextjs.org/blog/next-9-1#public-directory-support
89+
# public
90+
91+
# vuepress build output
92+
.vuepress/dist
93+
94+
# Serverless directories
95+
.serverless/
96+
97+
# FuseBox cache
98+
.fusebox/
99+
100+
# DynamoDB Local files
101+
.dynamodb/
102+
103+
# TernJS port file
104+
.tern-port
105+
106+
# Stores VSCode versions used for testing VSCode extensions
107+
.vscode-test
108+
109+
# yarn v2
110+
.yarn/cache
111+
.yarn/unplugged
112+
.yarn/build-state.yml
113+
.yarn/install-state.gz
114+
.pnp.*
115+
116+
# Build outputs
117+
dist/
118+
dist-ssr/
119+
build/
120+
out/
121+
122+
# Editor directories and files
123+
.vscode/*
124+
!.vscode/extensions.json
125+
.idea
126+
.DS_Store
127+
*.suo
128+
*.ntvs*
129+
*.njsproj
130+
*.sln
131+
*.sw?
132+
133+
# OS generated files
134+
Thumbs.db
135+
ehthumbs.db
136+
Desktop.ini
137+
138+
# Temporary files
139+
*.tmp
140+
*.temp
141+
.tmp/
142+
.temp/
143+
144+
# Package manager lock files (uncomment if you want to ignore them)
145+
# package-lock.json
146+
# yarn.lock
147+
# pnpm-lock.yaml
148+
149+
# Local environment files
150+
*.local

‎sdk-examples/categories/transaction/.prettierignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+

‎sdk-examples/categories/transaction/.prettierrc‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+

‎sdk-examples/categories/transaction/README.md‎

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
# Transaction Example
2+
3+
This example demonstrates how to use the `@crypto.com/developer-platform-client` Transaction module to interact with blockchain transactions.
4+
5+
## Table of Contents
6+
7+
- [Installation](#installation)
8+
- [Environment Variables](#environment-variables)
9+
- [Features](#features)
10+
- [Usage](#usage)
11+
- [Build](#build)
12+
- [Development](#development)
13+
- [License](#license)
14+
15+
## Installation
16+
17+
Navigate to the app folder and install dependencies:
18+
19+
```sh
20+
cd developer-platform-sdk-examples/sdk-examples/categories/transaction
21+
npm install
22+
```
23+
24+
## Environment Variables
25+
26+
This example uses a client-side SDK and may require an API key. You can initialize the SDK inside your app code like so:
27+
28+
```ts
29+
import { Client } from "@crypto.com/developer-platform-client";
30+
31+
Client.init({
32+
apiKey: "sk-proj-...",
33+
});
34+
```
35+
36+
> **Note:** Never expose real or production API keys in a public or client-side app.
37+
38+
## Features
39+
40+
This example showcases the following Transaction functions:
41+
42+
- **getTransactionByHash**: Fetch a transaction by its hash
43+
- **getTransactionStatus**: Check transaction status by hash
44+
45+
Other Transaction functions:
46+
47+
- **getTransactionsByAddress**: Fetch transactions for a specific wallet address
48+
- **getTransactionCount**: Get transaction count for a wallet
49+
- **getGasPrice**: Fetch current gas price
50+
- **getFeeData**: Get current fee data
51+
- **estimateGas**: Estimate gas for a transaction
52+
53+
## Usage
54+
55+
To run the app in development mode:
56+
57+
```sh
58+
npm run dev
59+
```
60+
61+
Open your browser and navigate to the provided local URL (typically `http://localhost:5173`).
62+
63+
The application provides a user interface to test Transaction module functions. You can:
64+
65+
- Enter transaction hashes to fetch detailed transaction information
66+
- Check the current status of any transaction
67+
- View formatted JSON responses with transaction data
68+
69+
## Build
70+
71+
To generate a production-ready build:
72+
73+
```sh
74+
npm run build
75+
```
76+
77+
To preview the build:
78+
79+
```sh
80+
npm run preview
81+
```
82+
83+
## Development
84+
85+
- `npm run dev` - Start development server
86+
- `npm run build` - Build for production
87+
- `npm run lint` - Run ESLint
88+
- `npm run preview` - Preview production build
89+
90+
## API Key Requirements
91+
92+
Some functions may require valid API credentials. Make sure to provide valid credentials when testing blockchain transaction features.
93+
94+
## License
95+
96+
This project is licensed under the MIT License. See the LICENSE file for details.

‎sdk-examples/categories/transaction/eslint.config.js‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import js from '@eslint/js'
2+
import reactHooks from 'eslint-plugin-react-hooks'
3+
import reactRefresh from 'eslint-plugin-react-refresh'
4+
import globals from 'globals'
5+
import tseslint from 'typescript-eslint'
6+
7+
export default tseslint.config(
8+
{ ignores: ['dist'] },
9+
{
10+
extends: [js.configs.recommended, ...tseslint.configs.recommended],
11+
files: ['**/*.{ts,tsx}'],
12+
languageOptions: {
13+
ecmaVersion: 2020,
14+
globals: globals.browser,
15+
},
16+
plugins: {
17+
'react-hooks': reactHooks,
18+
'react-refresh': reactRefresh,
19+
},
20+
rules: {
21+
...reactHooks.configs.recommended.rules,
22+
'react-refresh/only-export-components': [
23+
'warn',
24+
{ allowConstantExport: true },
25+
],
26+
},
27+
},
28+
)

‎sdk-examples/categories/transaction/index.html‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>SDK Transaction Example</title>
8+
</head>
9+
10+
<body>
11+
<div id="root"></div>
12+
<script type="module" src="/src/main.tsx"></script>
13+
</body>
14+
</html>

0 commit comments

Comments
 (0)