RustFS.com - Official Website
RustFS.com is the official website for the RustFS distributed storage system, built with Next.js, providing a modern user experience and comprehensive documentation showcase.
🚀 Project Overview
RustFS is a high-performance distributed object storage system developed in Rust, compatible with S3 protocol. This website showcases RustFS's product features, architecture design, solutions, and download information.
🛠️ Tech Stack
- Framework: Next.js 16.2.11 (App Router)
- Language: TypeScript (ES2025+, Strict Mode)
- Styling: Tailwind CSS 4 + shadcn/ui
- Icons: Lucide React
- Theme: next-themes (Dark Mode Support)
- Animation: motion + tw-animate-css
- Internationalization: Chinese primary (lang="zh-CN")
📁 Project Structure
rustfs.com/
├── app/ # Next.js App Router directory
│ ├── components/ # Page-level components
│ │ ├── buttons/ # Button component collection
│ │ └── *.tsx # Feature components
│ ├── download/ # Download page
│ ├── layout.tsx # Root layout
│ ├── page.tsx # Home page
│ └── globals.css # Global styles
├── components/ # Common component library
│ ├── ui/ # shadcn/ui components
│ └── magicui/ # Custom UI components
├── data/ # Static data
│ ├── features.tsx # Product feature data
│ ├── reviews.json # User reviews
│ └── *.json # Other configuration data
├── lib/ # Utility functions
│ └── utils.ts # Tailwind merge utilities
└── public/ # Static assets
├── images/ # Image resources
└── svgs/ # SVG icons
🚀 Quick Start
Requirements
Install Dependencies
# Using
pnpm install
Development Server
# Start development server
pnpm dev
Open http://localhost:3000 to view the result.
Build for Production
# Build for production
pnpm build
# Start production server
pnpm start
Homepage Metrics Cache
The rustfs-homepage-metrics Cloudflare Worker refreshes GitHub and Docker Hub
metrics at 05:00 and 17:00 Beijing time. It stores the last successful values in
Workers KV and serves them from https://rustfs.com/api/homepage-metrics.
Each source refreshes independently. A failed upstream request never overwrites
that source's last successful values. The homepage reads the API after hydration
and keeps public/homepage-metrics.json as its build-time and runtime fallback,
so a Worker, KV, or upstream outage cannot reset the displayed values.
The Worker is deployed automatically after relevant changes reach main.
Wrangler creates and binds the KV namespace on the first deployment. Configure
the CLOUDFLARE_ACCOUNT_ID and CLOUDFLARE_API_TOKEN repository secrets once;
subsequent deployments and twice-daily refreshes require no manual action.
Local verification:
pnpm exec wrangler types workers/homepage-metrics/worker-configuration.d.ts \
--config workers/homepage-metrics/wrangler.jsonc
pnpm run check:homepage-metrics-worker
📝 Development Guidelines
Code Style
- Use TypeScript strict mode
- Follow ESLint and Prettier configuration
- Use functional components and Hooks
- Use Tailwind CSS for styling
Component Development
- Client components must be marked with
'use client'
- Use
cn() function to merge class names
- Support dark mode and responsive design
- Follow shadcn/ui component standards
⚠️ CRITICAL: Style and Structure Protection
🚨 ABSOLUTE RULE: Do NOT modify styles or structure unless explicitly specified!
- NEVER change existing CSS classes, layout structure, or component design
- NEVER simplify complex components or remove visual elements
- NEVER replace custom components with basic UI components
- NEVER modify animations, transitions, or interactive behaviors
- NEVER change responsive design or dark mode implementations
When making changes:
- ✅ Only modify what is explicitly requested
- ✅ Preserve ALL existing styles, animations, and interactions
- ✅ Keep complex layouts and visual hierarchies intact
- ✅ Maintain all custom component implementations
This rule applies to ALL development tasks, including:
- Internationalization updates
- Bug fixes
- Feature additions
- Code refactoring
- Performance optimizations
Violation of this rule will result in immediate rollback and review.
Internationalization
- All user interface text uses Chinese
- Support Chinese-English switching
- Use
tw() function to handle bilingual text
🎨 Design System
Theme Colors
- Primary: Primary color
- Secondary: Secondary color
- Muted: Muted color
- Accent: Accent color
Responsive Breakpoints
sm: 640pxmd: 768pxlg: 1024pxxl: 1280px
Dark Mode
Use dark: prefix to support dark mode styles.
📚 Documentation
🤝 Contributing
- Fork this repository
- Create a feature branch (
git checkout -b feature/amazing-feature)
- Commit your changes (
git commit -m 'Add some amazing feature')
- Push to the branch (
git push origin feature/amazing-feature)
- Open a Pull Request
📄 License
This project is licensed under the MIT License - see the LICENSE file for details.
🔗 Related Links
RustFS - High-Performance Distributed Storage System
