Skip to content

Kudora-Labs/rocketstarter

Repository files navigation

πŸš€ RocketStarter

The ultimate Web3 project management platform for seamless Web2-to-Web3 transitions

Made with React TypeScript Tailwind CSS Web3 License

Demo β€’ Features β€’ Quick Start β€’ Backend Integration β€’ Documentation


πŸ“– About

RocketStarter is a comprehensive project management platform designed specifically for teams transitioning from Web2 to Web3 technologies. Built by Kudora Labs, it provides structured workflows, pre-built templates, and integrated Web3 tooling to accelerate blockchain project development.

🎯 Who It's For

  • Development Teams building DeFi protocols, NFT marketplaces, or DAO platforms
  • Project Managers overseeing Web3 initiatives
  • Businesses transitioning to blockchain technologies
  • Entrepreneurs launching Web3 startups

✨ Features

πŸŽ›οΈ Comprehensive Project Management

  • Visual Dashboard with real-time progress tracking
  • 5-Step Workflow from requirements to deployment
  • Task Management with drag-and-drop Kanban boards
  • Team Collaboration tools and role-based assignments

πŸ“‹ Pre-Built Strategy Templates

  • DeFi Protocol Launch - Complete DeFi development workflow
  • NFT Marketplace - End-to-end NFT platform creation
  • DAO Governance - Decentralized governance system setup
  • Custom Templates - Tailored to your specific needs

πŸ”— Native Web3 Integration

  • Wallet Connection via RainbowKit
  • Backend API Integration with real-time data sync
  • Blockchain Network support (Mainnet, Sepolia)
  • Task Workflow management with on-chain capabilities
  • Multi-Chain Support (Ethereum Mainnet & Sepolia Testnet)
  • Smart Contract Interaction with Wagmi & viem
  • Environment Management (testnet/mainnet switching)

🎨 Modern User Experience

  • Responsive Design for desktop and mobile
  • Dark/Light Theme support
  • Smooth Animations with Framer Motion
  • Intuitive Interface built with Tailwind CSS

πŸš€ Quick Start

Prerequisites

  • Node.js 16+ (Download)
  • npm or yarn package manager
  • Git for version control

1. Clone & Install

# Clone the repository
git clone https://github.com/MatVD/rocketstarter.git
cd rocketstarter

# Install dependencies
npm install

2. Environment Setup

# Copy environment template
cp .env.example .env

# Add your WalletConnect Project ID (optional for wallet features)
# Get one at: https://cloud.walletconnect.com/
echo "VITE_WALLETCONNECT_PROJECT_ID=your_project_id_here" >> .env

3. Start Development Server

npm run dev

πŸŽ‰ That's it! Open http://localhost:5173 to see RocketStarter in action.


πŸ”— Backend Integration

RocketStarter includes full backend API integration for real-time data management.

Quick Backend Setup

# Clone the backend repository
git clone <backend-repo>
cd rocketstarter-back

# Start with Docker
docker-compose up -d
npm run seed:auto

# Verify connection
curl http://localhost:3000/health

Features

  • Real-time Data Sync - Live project and task updates
  • Wallet Authentication - Automatic user verification
  • Task Workflows - Backend-enforced business rules
  • Connection Monitoring - Visual status indicators

Integration Status

  • βœ… API Client - Axios-based with auto-authentication
  • βœ… React Hooks - Custom hooks for all endpoints
  • βœ… Type Safety - Full TypeScript integration
  • βœ… Error Handling - Comprehensive user feedback
  • βœ… CORS Support - Pre-configured for development

πŸ“– Full setup guide: BACKEND_INTEGRATION.md

Test the integration in the "API Testing" tab within the app.


πŸ“Š Demo

Dashboard Overview

Track your Web3 project progress with visual indicators and step-by-step guidance.

Project Board

Manage tasks with an intuitive Kanban interface designed for Web3 development workflows.

Strategy Templates

Jump-start your project with battle-tested templates for common Web3 use cases.


πŸ› οΈ Available Scripts

Command Description
npm run dev Start development server with hot reload
npm run build Create production-optimized build
npm run preview Preview production build locally
npm run lint Run ESLint code quality checks

πŸ“ Project Structure

rocketstarter/
β”œβ”€β”€ src/
β”‚   β”œβ”€β”€ components/          # Reusable UI components
β”‚   β”‚   β”œβ”€β”€ Build/           # Task & Kanban management
β”‚   β”‚   β”œβ”€β”€ Dashboard/       # Progress tracking
β”‚   β”‚   β”œβ”€β”€ Layout/          # App shell components
β”‚   β”‚   └── Templates/       # Strategy templates
β”‚   β”œβ”€β”€ pages/               # Main application pages
β”‚   β”œβ”€β”€ contexts/            # React context providers
β”‚   β”œβ”€β”€ utils/               # Helper functions
β”‚   β”œβ”€β”€ types/               # TypeScript definitions
β”‚   └── constants/           # App constants
β”œβ”€β”€ public/                  # Static assets
└── docs/                    # Additional documentation

πŸ§‘β€πŸ’» Development Workflow

The RocketStarter 5-Step Process

  1. πŸ“‹ Requirements Analysis - Define Web3 objectives and success metrics
  2. πŸ—οΈ Architecture Choice - Select optimal blockchain platform and tools
  3. πŸ“œ Smart Contracts - Develop, test, and optimize contracts
  4. πŸ” Tests & Audit - Comprehensive security validation
  5. πŸš€ Deployment - Production release and monitoring

Each step includes:

  • βœ… Predefined tasks and checkpoints
  • πŸ‘₯ Team assignments and role guidance
  • ⏱️ Time estimates and milestone tracking
  • πŸ“š Resources and best practices

πŸ”§ Technology Stack

Frontend

  • React 18 - Modern component-based UI
  • TypeScript - Type-safe development
  • Vite - Lightning-fast build tool
  • Tailwind CSS - Utility-first styling

Web3 Integration

  • RainbowKit - Wallet connection interface
  • Wagmi - React hooks for Ethereum
  • viem - TypeScript Ethereum library

UI/UX

  • Framer Motion - Smooth animations
  • @dnd-kit - Drag and drop functionality
  • Lucide React - Modern icon system

🀝 Contributing

We welcome contributions! Please see our Contributing Guide for details.

Development Setup

# Fork and clone the repo
git clone https://github.com/YOUR_USERNAME/rocketstarter.git

# Create a feature branch
git checkout -b feature/amazing-feature

# Make your changes and commit
git commit -m "Add amazing feature"

# Push and create a pull request
git push origin feature/amazing-feature

πŸ“„ License

This project is licensed under the MIT License - see the LICENSE file for details.


πŸ™‹β€β™€οΈ Support & Community


πŸš€ What's Next?

  • Advanced Analytics - Detailed project insights and metrics
  • AI-Powered Recommendations - Smart task prioritization
  • Multi-Chain Expansion - Polygon, Arbitrum, and more
  • Team Collaboration - Real-time editing and comments
  • Integrations - GitHub, Slack, Discord connections

Built with ❀️ by Kudora Labs

Empowering the Web3 transition, one project at a time.

⭐ Star this repo if RocketStarter helps you build amazing Web3 projects!

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •  

Languages