🚨 Announcement

• 📌 THIS PROJECT CREATED BY "BARIO FANS" NOT OFFICIAL TEAM
• 📌 Punks not dead!

🎮 Bario Punks Simulator: Punks not dead!

This is a simulation website for swapping traits of the Bario Punks NFT Collection on the Base Chain.

(This project is developed by Bario fans, not the official team.)

🔗 Bario Entertainment System - Link Official

• Website - https://baes.so
• Onchain Game Store - https://app.baes.so
• Twitter/X - https://x.com/basebario
• Telegram Community - https://t.me/barioportal
• Discord Community - https://discord.gg/qWuRZ85MwC

🛠️ Tech Stack

• Next.js 15 – Framework for static site generation.
• TailwindCSS 4 – Utility-first CSS framework for styling.
• TypeScript – Strongly typed JavaScript for better maintainability.
• shadcn/ui – Reusable UI components
• Magic UI – Reusable UI components
• Lucide Icons – Modern icon set
• next-themes – Theme management
• Zustand – State Management

📂 Installation & Setup

To run this project locally, follow these steps:

1. Fork & Clone the repository

git clone https://github.com/guysuvijak/bario-punks-simulator.git
cd bario-punks-simulator

2. Install dependencies

npm install
or
bun install
or
pnpm install

3. Start the development server

npm run dev
or
bun run dev
or
pnpm run dev

4. The app will be available

http://localhost:3000

🗂️ Project Structure

bario-punks-simulator/
├── public/               # Static assets
│   ├── icons/            # Website Icon
│   ├── metadata/         # Metadata Image & Readme Image
│   ├── traits/           # Bario Traits Image
│   │   ├── backscope/    # Bario Backscope Traits Image
│   │   ├── brainbox/     # Bario Brainbox Traits Image
│   │   ├── existatron/   # Bario Existatron Traits Image
│   │   ├── gearbit/      # Bario Gearbit Traits Image
│   │   └── skinframe/    # Bario Skinframe Traits Image
│   ├── manifest.json     # Config Metadata (PWA)
│   └── manifest.webp     # Manifest Banner Image
├── src/
│   ├── app/              # layout & page Next.JS
│   │   ├── favicon.ico   # Bario Gearbit Traits Image
│   │   ├── globals.css   # Tailwind CSS & Shadcn/ui
│   │   ├── layout.tsx    # Website Layout
│   │   ├── not-found.tsx # Not found Page (404)
│   │   ├── page.tsx      # Main Page (Bario Traits Simulator)
│   │   ├── robots.ts     # Manual setup robots
│   │   └── sitemap.ts    # Manual setup sitemap
│   ├── components/       # React components
│   │   ├── magicui/      # UI from Magic-UI
│   │   ├── ui/           # UI from shadcn/ui
│   │   ├── BarioNameCard.tsx  # Create Name Card Component
│   │   ├── Footer.tsx         # Footer Component
│   │   ├── LanguageToggle.tsx # Language Toggle Button
│   │   ├── Navbar.tsx         # Navbar Component
│   │   ├── ThemeToggle.tsx    # Theme Toggle Button
│   │   ├── TooltipWrapper.tsx # Tooltip Component
│   │   └── Web3Connect.tsx    # Web3 Connect Component
│   ├── configs/          # Configs File
│   │   ├── bario.tsx     # Bario Traits System
│   │   └── metadata.ts   # Website setup metadata
│   ├── hooks/            # React Custom Hooks
│   ├── lib/              # Auto Create from Library
│   ├── locales/          # Language Files
│   ├── providers/        # Providers File
│   ├── stores/           # Stores File (Zustand)
│   └── types/            # TypeScript File
├── .cspell.json          # for "Code Spell Checker" vscode extension
├── .env.example          # Env Example (Need config)
├── .gitignore            # Git Ignore File
└── .prettierignore       # Prettier Ignore File
└── .prettierrc           # Prettier File (terminal: npm run check --> npm run format)

📜 License

MIT License - Free Learning & Open-source 💡

🙏 Acknowledgments

Thanks for your interest in Bario Punks Simulator. We welcome contributors, feedback, and community support to take this project even further! 🚀