TON Portal is an intelligent gateway to the TON blockchain ecosystem that combines AI technology with essential blockchain tools. It provides developers, DeFi users, and blockchain enthusiasts with a unified platform for accessing TON network services, real-time analytics, and community resources.
- Natural language interaction for TON ecosystem queries
- Context-aware understanding and personalized recommendations
- Intelligent guidance for blockchain operations
- Real-time TON network monitoring
- Transaction volume and network health metrics
- Active wallet statistics and staking data
- Historical data and trend analysis
- TON Faucet: Free testnet tokens for development
- Staking Services: Secure TON token staking with rewards
- Token Swap: Multi-DEX aggregation for best rates
- DeFi Lending: Lending and borrowing platform integration
- Wallet Tools: Comprehensive wallet management utilities
- Developer Tools: Smart contract IDE and debugging suite
- TON ecosystem events aggregation
- Developer conferences and hackathons
- Community AMAs and workshops
- Event submission and promotion
- Centralized TON development documentation
- Step-by-step tutorials for all skill levels
- API references and best practices
- Community forums and support channels
- Node.js 18+
- pnpm (recommended) or npm/yarn
# Clone the repository
git clone https://github.com/TownSquareXYZ/ton-portal
cd ton-portal
# Install dependencies
pnpm install
# Start development server
pnpm devOpen http://localhost:3000 to view the application.
pnpm dev # Start development server with Turbopack
pnpm build # Build for production
pnpm start # Start production server
pnpm lint # Run ESLint- Frontend Framework: Next.js 15 with App Router
- UI Library: React 19
- Language: TypeScript 5.8.3
- Styling: Tailwind CSS v4
- UI Components: shadcn/ui (Radix UI primitives)
- Icons: Lucide React
- Package Manager: pnpm
- Development: Turbopack for fast HMR
- Linting: ESLint with Next.js configuration
- SEO: Comprehensive metadata, sitemap, structured data
- AI: OpenAI API for intelligent assistance
- Blockchain: TON SDK for network interaction
- Charts: Recharts for data visualization
- Animations: Framer Motion
- APIs: Discord/Telegram for community integration
- TON Developers: Access to tools, documentation, and community resources
- DeFi Users: Staking, lending, and token swap services
- Ecosystem Enthusiasts: Analytics, events, and community engagement
- Newcomers: AI-guided onboarding and educational resources
- Next.js 15 + React 19 + TypeScript setup
- Tailwind CSS v4 configuration
- Basic app structure with App Router
- ESLint configuration and clean build
- Landing page with hero section
- Unified responsive navigation and footer
- Feature pages (
/ai,/analytics,/tools,/events,/resources) - shadcn/ui component library integration
- TON official branding and consistent theming
- Mobile-responsive layouts
- Comprehensive SEO optimization
- Sitemap and robots.txt generation
- Structured data for enhanced search results
- AI assistant functionality (OpenAI API)
- Real-time TON network data feeds
- Working blockchain tools (TON SDK)
- Interactive charts and visualizations
- Events calendar with live data
- Community API integrations
- Primary: TON Official Blue (
#0098EA) - oklch(0.581 0.141 257.57) - Secondary: Feature-specific colors (green, purple, orange, emerald)
- Background: Gradient combinations for visual appeal
- Dark Mode: Full support with appropriate contrast ratios
- Font: Geist Sans and Geist Mono
- Hierarchy: Consistent heading and body text scaling
- Responsive: Adaptive text sizes for different screen sizes
- TypeScript strict mode enabled
- ESLint with Next.js recommended rules
- Consistent import ordering and naming conventions
- Component-based architecture with reusable patterns
- Mobile-first approach
- Breakpoints:
sm(640px),md(768px),lg(1024px),xl(1280px) - Flexible grid layouts and adaptive components
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
- Follow existing code style and patterns
- Add TypeScript types for new components
- Ensure responsive design compatibility
- Test on both light and dark modes
- Run
pnpm lintbefore committing
This project is licensed under the MIT License - see the LICENSE file for details.
For support and questions:
- Create an issue in this repository
- Join the TON developer community
- Check the Resource Hub for documentation
Built with ❤️ for the TON ecosystem
© 2025 TON Portal. Built for developers, by developers.