Skip to content

Commit dc16fba

Browse files
spencerstockspencerstock
committed
format
1 parent 280d161 commit dc16fba

File tree

22 files changed

+2579
-3
lines changed

22 files changed

+2579
-3
lines changed

‎packages/account-sdk/src/interface/payment/utils/translatePayment.test.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@ import { describe, expect, it } from 'vitest';
22
import { CHAIN_IDS, TOKENS } from '../constants.js';
33
import type { PayerInfo } from '../types.js';
44
import {
5-
buildSendCallsRequest,
6-
encodeTransferCall,
7-
translatePaymentToSendCalls,
5+
buildSendCallsRequest,
6+
encodeTransferCall,
7+
translatePaymentToSendCalls,
88
} from './translatePayment.js';
99

1010
describe('translatePayment', () => {

‎packages/create-base-app/README.md‎

Lines changed: 293 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,293 @@
1+
# create-base-app
2+
3+
Create Base applications with Sign in with Base and Base Pay preconfigured in seconds.
4+
5+
## Features
6+
7+
✨ **Quick Setup** - Get a fully configured Base app running in under a minute
8+
🔐 **Sign in with Base** - Authentication with Base accounts built-in
9+
💳 **Base Pay** - Accept USDC payments on Base out of the box
10+
🎨 **Multiple Frameworks** - Support for React, Next.js, Vue, and Svelte
11+
📦 **TypeScript Support** - Optional TypeScript configuration
12+
🚀 **Production Ready** - Best practices and optimized build configuration
13+
14+
## Quick Start
15+
16+
### Using npx (recommended)
17+
18+
```bash
19+
npx create-base-app my-app
20+
cd my-app
21+
npm run dev
22+
```
23+
24+
### Using npm
25+
26+
```bash
27+
npm create base-app my-app
28+
cd my-app
29+
npm run dev
30+
```
31+
32+
### Using yarn
33+
34+
```bash
35+
yarn create base-app my-app
36+
cd my-app
37+
yarn dev
38+
```
39+
40+
### Using pnpm
41+
42+
```bash
43+
pnpm create base-app my-app
44+
cd my-app
45+
pnpm dev
46+
```
47+
48+
## Options
49+
50+
You can pass options directly to skip the interactive prompts:
51+
52+
```bash
53+
npx create-base-app my-app \
54+
--framework nextjs \
55+
--typescript \
56+
--package-manager yarn
57+
```
58+
59+
### Available Options
60+
61+
- `--framework <framework>` - Choose framework: `react`, `nextjs`, `vue`, or `svelte`
62+
- `--typescript` / `--no-typescript` - Use TypeScript (default: true)
63+
- `--package-manager <pm>` - Package manager: `npm`, `yarn`, or `pnpm`
64+
- `--no-git` - Skip git initialization
65+
- `--no-install` - Skip dependency installation
66+
67+
## What's Included
68+
69+
Each generated project includes:
70+
71+
### 🔐 Sign in with Base
72+
- Pre-configured authentication flow
73+
- Wallet connection handling
74+
- Session management
75+
- Server-side signature verification (Next.js)
76+
77+
### 💳 Base Pay
78+
- Payment UI components
79+
- USDC payment processing
80+
- Transaction status tracking
81+
- Testnet support for development
82+
83+
### 🎨 Modern UI
84+
- Responsive design
85+
- Light/dark mode support
86+
- Accessible components
87+
- Mobile-optimized
88+
89+
### 🛠 Developer Experience
90+
- Hot module replacement
91+
- TypeScript support (optional)
92+
- ESLint configuration
93+
- Production build optimization
94+
95+
## Project Structure
96+
97+
```
98+
my-base-app/
99+
├── src/
100+
│ ├── components/
101+
│ │ ├── AuthComponent # Sign in with Base
102+
│ │ └── PaymentComponent # Base Pay integration
103+
│ ├── providers/
104+
│ │ └── BaseProvider # SDK initialization
105+
│ └── App # Main application
106+
├── .env.example # Environment variables
107+
├── package.json
108+
└── README.md
109+
```
110+
111+
## Configuration
112+
113+
### Environment Variables
114+
115+
Each project includes a `.env.example` file with the following variables:
116+
117+
```env
118+
# Base Account SDK Configuration
119+
NEXT_PUBLIC_APP_NAME=my-base-app
120+
NEXT_PUBLIC_APP_CHAIN_IDS=8453,84532 # Base mainnet, Base Sepolia
121+
NEXT_PUBLIC_WALLET_URL=https://wallet.coinbase.com
122+
```
123+
124+
### Supported Chains
125+
126+
- **Base Mainnet** (Chain ID: 8453) - Production
127+
- **Base Sepolia** (Chain ID: 84532) - Testing
128+
129+
## Testing
130+
131+
### Get Test Funds
132+
133+
1. Visit [Circle Faucet](https://faucet.circle.com/)
134+
2. Select "Base Sepolia" network
135+
3. Request test ETH and USDC
136+
4. Use `testnet: true` in payment calls
137+
138+
### Test Payment Flow
139+
140+
1. Connect your wallet
141+
2. Ensure you're on Base Sepolia network
142+
3. Enter payment amount (minimum 0.01 USDC)
143+
4. Confirm transaction in your wallet
144+
5. View transaction status
145+
146+
## Framework Templates
147+
148+
### React
149+
- Vite for fast development
150+
- React 18 with hooks
151+
- CSS modules
152+
153+
### Next.js
154+
- App or Pages router
155+
- API routes for auth
156+
- Server-side rendering
157+
- Optimized production builds
158+
159+
### Vue (Coming Soon)
160+
- Vue 3 composition API
161+
- Vite build system
162+
- Vue Router integration
163+
164+
### Svelte (Coming Soon)
165+
- SvelteKit framework
166+
- Server-side rendering
167+
- Built-in routing
168+
169+
## API Reference
170+
171+
### Authentication
172+
173+
```javascript
174+
// Sign in with Base
175+
const provider = sdk.getProvider();
176+
const accounts = await provider.request({
177+
method: 'eth_requestAccounts'
178+
});
179+
180+
// Sign message for verification
181+
const signature = await provider.request({
182+
method: 'personal_sign',
183+
params: [message, address],
184+
});
185+
```
186+
187+
### Payments
188+
189+
```javascript
190+
// Process payment
191+
const result = await base.pay({
192+
amount: '1.00', // Amount in USDC
193+
to: '0x...', // Recipient address
194+
testnet: true, // Use testnet
195+
});
196+
197+
// Check payment status
198+
const status = await base.getPaymentStatus({
199+
id: result.id,
200+
testnet: true
201+
});
202+
```
203+
204+
## Deployment
205+
206+
### Vercel
207+
208+
```bash
209+
npm run build
210+
vercel deploy
211+
```
212+
213+
### Netlify
214+
215+
```bash
216+
npm run build
217+
netlify deploy --dir=dist
218+
```
219+
220+
### Docker
221+
222+
```dockerfile
223+
FROM node:18-alpine
224+
WORKDIR /app
225+
COPY package*.json ./
226+
RUN npm ci
227+
COPY . .
228+
RUN npm run build
229+
EXPOSE 3000
230+
CMD ["npm", "start"]
231+
```
232+
233+
## Troubleshooting
234+
235+
### Common Issues
236+
237+
**Wallet not connecting**
238+
- Ensure you have a Base-compatible wallet installed
239+
- Check that you're on the correct network
240+
- Clear browser cache and reconnect
241+
242+
**Payment failing**
243+
- Verify sufficient balance (ETH for gas, USDC for payment)
244+
- Check recipient address is valid
245+
- Ensure correct network (mainnet vs testnet)
246+
247+
**Build errors**
248+
- Clear node_modules and reinstall
249+
- Check Node.js version (18+ required)
250+
- Verify all environment variables are set
251+
252+
## Resources
253+
254+
- [Base Documentation](https://docs.base.org)
255+
- [Base Account SDK](https://github.com/base/account-sdk)
256+
- [Base Pay Guide](https://docs.base.org/building-with-base/products/base-pay)
257+
- [Sign in with Base](https://docs.base.org/building-with-base/products/sign-in-with-base)
258+
- [Discord Community](https://discord.gg/base)
259+
260+
## Contributing
261+
262+
We welcome contributions! Please see our [Contributing Guide](../../CONTRIBUTING.md) for details.
263+
264+
### Development
265+
266+
```bash
267+
# Clone the repo
268+
git clone https://github.com/base/account-sdk.git
269+
cd account-sdk/packages/create-base-app
270+
271+
# Install dependencies
272+
npm install
273+
274+
# Build the CLI
275+
npm run build
276+
277+
# Test locally
278+
node dist/index.js my-test-app
279+
```
280+
281+
## License
282+
283+
MIT © Base
284+
285+
## Support
286+
287+
- [GitHub Issues](https://github.com/base/account-sdk/issues)
288+
- [Discord](https://discord.gg/base)
289+
- [Twitter](https://twitter.com/base)
290+
291+
---
292+
293+
Built with ❤️ by the Base team

‎packages/create-base-app/package.json‎

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
{
2+
"name": "create-base-app",
3+
"version": "1.0.0",
4+
"description": "Create Base apps with Sign in with Base and Base Pay preconfigured",
5+
"keywords": [
6+
"base",
7+
"blockchain",
8+
"web3",
9+
"create-app",
10+
"scaffold",
11+
"boilerplate",
12+
"base-pay",
13+
"authentication"
14+
],
15+
"publishConfig": {
16+
"access": "public"
17+
},
18+
"type": "module",
19+
"bin": {
20+
"create-base-app": "./dist/index.js"
21+
},
22+
"files": [
23+
"dist",
24+
"templates",
25+
"README.md"
26+
],
27+
"scripts": {
28+
"build": "tsc && chmod +x dist/index.js",
29+
"dev": "tsc --watch",
30+
"clean": "rm -rf dist node_modules",
31+
"prepublishOnly": "npm run build",
32+
"test": "vitest",
33+
"typecheck": "tsc --noEmit",
34+
"lint": "biome lint .",
35+
"format": "biome format . --write",
36+
"format:check": "biome check . --formatter-enabled=true --linter-enabled=false --organize-imports-enabled=false"
37+
},
38+
"repository": {
39+
"type": "git",
40+
"url": "https://github.com/base/account-sdk.git",
41+
"directory": "packages/create-base-app"
42+
},
43+
"author": "Base",
44+
"license": "MIT",
45+
"dependencies": {
46+
"chalk": "^5.3.0",
47+
"commander": "^12.0.0",
48+
"execa": "^8.0.1",
49+
"fs-extra": "^11.2.0",
50+
"inquirer": "^9.2.15",
51+
"ora": "^8.0.1"
52+
},
53+
"devDependencies": {
54+
"@types/fs-extra": "^11.0.4",
55+
"@types/inquirer": "^9.0.7",
56+
"@types/node": "^20.11.20",
57+
"typescript": "^5.3.3",
58+
"vitest": "^1.3.1"
59+
},
60+
"engines": {
61+
"node": ">=18.0.0"
62+
}
63+
}

0 commit comments

Comments
 (0)