Web3 Wallet

A non-custodial cryptocurrency wallet built with vanilla JavaScript, featuring passwordless authentication via WebAuthn and integrated DeFi capabilities.

Features

🔐 Security First

• Passwordless Authentication - Uses WebAuthn/Passkey for biometric authentication
• Non-Custodial - Private keys derived from passkey credentials, never stored directly
• Encrypted Storage - Sensitive data encrypted using SEA (Security, Encryption, Authorization)
• Zero Knowledge - Your keys never leave your device

💰 Multi-Chain Support

• Ethereum - Mainnet and Sepolia testnet
• Binance Smart Chain - Mainnet and testnet
• EVM Compatible - Works with any EVM-compatible chain

🔄 DeFi Integration

• DEX Support - Uniswap V2/V3, PancakeSwap V2/V3
• Swap Tokens - Direct token swapping
• Liquidity Pools - Add/remove liquidity
• Pool Analytics - Calculate earnings and rates

🚀 Performance

• Multi-threaded - Web Workers for blockchain operations
• Offline-First - Works offline with IndexedDB + GunDB
• P2P Sync - Decentralized data synchronization
• Fast Loading - No heavy frameworks, pure vanilla JS

Tech Stack

• Frontend: Vanilla JavaScript (ES6 modules)
• Authentication: WebAuthn API
• Blockchain: Ethers.js v6
• Database: GunDB (P2P) + IndexedDB
• Threading: Web Workers
• Styling: CSS-in-JS
• Icons: Bootstrap Icons + Cryptocurrency Icons

Installation

1. Clone the repository:

git clone https://github.com/yourusername/wallet.git
cd wallet

2. Install dependencies:

npm install

3. Build static files:

npm run prebuild

4. Start development server:

npm run dev

This will run:

• Development server on http://localhost:8080
• Market data scanner in background

Available Scripts

• npm start - Build and start development server
• npm run dev - Run market scanner and dev server concurrently
• npm run dev:ui - Run UI development only
• npm run prebuild - Generate static files and copy dependencies
• npm run scan - Run blockchain scanner for pools/currencies
• npm run market - Run market data service
• npm run format - Format code with Prettier

Project Structure

wallet/
├── src/
│   ├── core/              # Core business logic
│   │   ├── Access.js       # Authentication management
│   │   ├── WebAuthn.js     # Passkey implementation
│   │   ├── Wallet.js       # Wallet operations
│   │   ├── Chain.js        # Blockchain abstraction
│   │   ├── DeFi/           # DEX integrations
│   │   ├── Threads.js      # Web Worker management
│   │   └── Utils/          # Helper functions
│   ├── UIs/               
│   │   ├── Vanilla/        # UI components
│   │   │   ├── components/ # Reusable components
│   │   │   ├── layouts/    # Page layouts
│   │   │   └── routes/     # Page routes
│   │   └── css/           # Global styles
│   ├── configs/           # Configuration files
│   │   ├── chains/        # Blockchain configs
│   │   ├── ABIs/          # Smart contract ABIs
│   │   └── i18n.json      # Translations
│   └── threads/           # Web Worker scripts
│       ├── main.js        # Main thread
│       ├── onchain.js     # Blockchain operations
│       └── offchain.js    # Database operations
├── tests/                 # Test files
├── notes/                 # Documentation
└── package.json

How It Works

Authentication Flow

1. User creates/uses a passkey (fingerprint, Face ID, security key)
2. WebAuthn generates a unique credential ID
3. Credential ID is hashed to create a deterministic seed
4. Seed generates the same key pair every time
5. Multiple wallets can be derived from the same passkey

Key Generation

// Simplified flow
credential = WebAuthn.create() // or authenticate()
hash = sha256(credential.id + salt)
keyPair = generateKeyPair(hash)
walletSeed = sha256(keyPair.private + walletId)
walletKeys = deriveKeys(walletSeed)

Architecture Principles

• No Framework Dependencies - Pure vanilla JavaScript for maximum control
• Component-Based - Custom component system without React/Vue overhead
• Module-Based - ES6 modules for code organization
• Event-Driven - Reactive state management with event emitters
• Thread-Safe - Blockchain operations in separate workers

Security Considerations

• Private keys are never stored in plain text
• All keys are derived deterministically from passkey
• WebAuthn requires user verification (biometric/PIN)
• Cross-origin requests are restricted
• No external analytics or tracking
• Open source for transparency

Browser Support

Requires modern browsers with:

• WebAuthn API support
• ES6 modules
• Web Workers
• IndexedDB
• WebCrypto API

Tested on:

• Chrome/Edge 90+
• Firefox 90+
• Safari 14+
• Brave

Development

Adding a New Chain

1. Create config in src/configs/chains/[CHAIN_NAME]/
2. Add chain config, currencies, and DeFi protocols
3. Run npm run prebuild to generate static files

Adding a New Component

1. Create component folder in src/UIs/Vanilla/components/
2. Add index.js, template.js, and styles.css.js
3. Import and use in routes or layouts

Running Tests

# Open test runner in browser
open tests/Tests.html

# Run specific test suites
open tests/UI.test.html
open tests/Events.test.html

Contributing

Contributions are welcome! Please read the contributing guidelines first.

1. Fork the repository
2. Create your feature branch
3. Commit your changes
4. Push to the branch
5. Open a Pull Request

License

MIT License - see LICENSE file for details

Disclaimer

This is experimental software. Use at your own risk. Always verify transactions and keep backups of important data.

Support

For issues and questions:

• Open an issue on GitHub
• Check the documentation in /notes
• Review test files for usage examples

---

Built with ❤️ for the decentralized web