A powerful CLI tool for scaffolding modern Web3 frontend applications with Morpheus integrations.
🚀 Next.js 14 with App Router and TypeScript
🎨 Tailwind CSS with custom dark theme
🔗 @reown/appkit (WalletConnect v2) integration
⚡ wagmi v2 and viem v2 for Web3 interactions
🎯 40+ shadcn/ui components pre-configured
🌐 Multi-network support (Ethereum, Arbitrum, Base)
💰 MOR token balance display with network icons
📱 Responsive design with collapsible sidebar
🎭 Dark theme with emerald accent colors
No installation required! Use directly with package runners:
# Using npx (recommended)
npx create-morpheus-template my-morpheus-app
# Using npm
npm create morpheus-template my-morpheus-app
# Using yarn
yarn create morpheus-template my-morpheus-app
# Using pnpm
pnpm create morpheus-template my-morpheus-app# Install globally (optional)
npm install -g create-morpheus-template
# Then use anywhere
create-morpheus-template my-morpheus-appcreate-morpheus-template [project-name] [options]| Option | Description | Default |
|---|---|---|
-t, --template <template> |
Template variant (minimal, full, custom) | minimal |
-n, --network <network> |
Default network environment (mainnet, testnet) | mainnet |
-p, --project-id <id> |
WalletConnect Project ID | prompt |
--skip-git |
Skip git initialization | false |
--skip-install |
Skip dependency installation | false |
--package-manager <pm> |
Package manager (npm, yarn, pnpm) | auto-detect |
-h, --help |
Display help information | |
-v, --version |
Display version number |
Create with specific template:
npx create-morpheus-template my-defi-app --template fullSkip git and use yarn:
npx create-morpheus-template my-app --skip-git --package-manager yarnTestnet environment with custom Project ID:
npx create-morpheus-template my-testnet-app --network testnet --project-id abc123Non-interactive mode (CI/CD friendly):
npx create-morpheus-template my-app \
--template minimal \
--network mainnet \
--project-id your_project_id \
--skip-git \
--package-manager npmPerfect for getting started quickly with essential Web3 functionality.
Includes:
- Basic Next.js setup with TypeScript
- Essential UI components (Button, Card, Input, etc.)
- Wallet connection with AppKit
- MOR balance display
- Single page layout
- Responsive sidebar navigation
Complete dashboard setup with all features and components.
Includes:
- Everything from Minimal template
- All 40+ shadcn/ui components
- Multiple page examples
- Advanced Web3 hooks
- TanStack Query integration
- Form handling with react-hook-form
- Data tables and charts
- Modal and dialog examples
Interactive template builder for selecting specific features.
Interactive Options:
- Component selection (pick specific shadcn/ui components)
- Network configuration (select supported networks)
- Additional integrations (GraphQL, Supabase, etc.)
- Layout preferences (sidebar style, theme options)
- Next.js 14 - React framework with App Router
- TypeScript - Type-safe JavaScript
- Tailwind CSS - Utility-first CSS framework
- @reown/appkit - Modern wallet connection
- wagmi - React hooks for Web3
- viem - TypeScript interface for Ethereum
- TanStack Query - Data fetching and caching
Wallet Support:
- MetaMask, WalletConnect, Coinbase Wallet, and 100+ others
- Automatic wallet detection
- Mobile wallet support
Network Support:
- Mainnet: Ethereum, Arbitrum, Base
- Testnet: Arbitrum Sepolia
- Easy network switching
- Custom RPC configurations
MOR Token Integration:
- Real-time balance display
- Multi-network support
- Network-specific icons
- Automatic refresh on transactions
After creating your project, configure your .env.local file:
# Required: Get from https://cloud.reown.com
NEXT_PUBLIC_PROJECT_ID=your_walletconnect_project_id
# Optional: Network environment
NEXT_PUBLIC_NETWORK_ENV=mainnet
# Optional: Custom RPC URLs
NEXT_PUBLIC_ETHEREUM_RPC=https://your-ethereum-rpc
NEXT_PUBLIC_ARBITRUM_RPC=https://your-arbitrum-rpc
NEXT_PUBLIC_BASE_RPC=https://your-base-rpc- Visit Reown Cloud
- Create a new project
- Copy your Project ID
- Add it to your
.env.localfile
After creating your project:
cd my-morpheus-app
npm run devYour app will be available at http://localhost:3000
Generated projects include these scripts:
npm run dev- Start development servernpm run build- Build for productionnpm run start- Start production servernpm run lint- Run ESLintnpm run type-check- Run TypeScript compiler
For advanced theme customization:
npm run tweakcn:setup # One-time setup
npm run dev:with-tweakcn # Start with theme editorThis provides a visual theme editor at http://localhost:3001 for real-time design customization.
- Node.js 18.0.0 or higher
- npm, yarn, or pnpm package manager
- Git (for repository initialization)
"Project ID not found" error:
- Make sure you've added
NEXT_PUBLIC_PROJECT_IDto your.env.localfile - Verify the Project ID is correct from Reown Cloud
Wallet connection not working:
- Check that your app is running on the correct port
- Ensure your Project ID is configured for the correct domain
- Try refreshing the page and clearing browser cache
Build errors:
- Run
npm run type-checkto identify TypeScript errors - Make sure all dependencies are installed with
npm install - Check that your Node.js version is 18 or higher
Directory already exists:
- Choose a different project name
- Remove the existing directory:
rm -rf my-project-name
This CLI tool is a project scaffolding utility that:
✅ Generates complete Web3 frontend applications
✅ Configures all necessary dependencies and tooling
✅ Sets up wallet integration and Web3 functionality
✅ Provides pre-built UI components and layouts
✅ Includes development and build scripts
❌ Not a runtime library - doesn't get imported into your code
❌ Not an SDK - used once to create projects, not for ongoing development
We welcome contributions! Please see our Contributing Guide for details.
This project is licensed under the MIT License - see the LICENSE file for details.
- Next.js - The React framework
- wagmi - React hooks for Web3
- shadcn/ui - Beautiful UI components
- Tailwind CSS - CSS framework
- Reown - WalletConnect infrastructure
Created with ❤️ for the Web3 community