ShibaNa Net (Frontend)

Connect. Share. Woof. 🐕

The official frontend client for ShibaNa Net, a modern social network inspired by the friendly Shiba Inu spirit. Built with the latest web technologies to ensure a fast, responsive, and engaging user experience.

✨ Features

• 🔐 Secure Authentication: Modern split-screen login/register UI with comprehensive form validation.
• 🎨 Brand Identity: Custom "Charcoal & Shiba Yellow" design system using Tailwind v4 CSS variables.
• 📱 Fully Responsive: Mobile-first approach, optimized for all screen sizes.
• ⚡ High Performance: Leveraging Next.js App Router, Server Components, and Turbopack.
• 📂 Modular Architecture: Clean code structure separating UI, logic, and assets.

🛠 Tech Stack

This repository contains the Frontend source code.

Category	Technology	Description
Framework	Next.js 16	App Router, Server Actions.
Styling	Tailwind CSS v4	Zero-runtime CSS, Semantic Colors.
Components	Shadcn UI	Accessible and customizable components.
Form Handling	RHF + Zod	Type-safe form validation.
Icons	Lucide React	Consistent and lightweight icons.

📂 Project Structure

shibana-net/
├── 📁 public/              # Static assets (Favicons, Logos)
├── 📁 src/
│   ├── 📁 app/             # Next.js App Router
│   │   ├── 📁 (auth)/      # Authentication Routes (Split Layout)
│   │   ├── 📁 (main)/      # Main App Routes (Sidebar Layout)
│   │   └── layout.tsx      # Root Layout
│   ├── 📁 components/      # React Components
│   │   ├── 📁 auth/        # Auth specific components
│   │   ├── 📁 shared/      # Reusable components (Logo, Sidebar...)
│   │   └── 📁 ui/          # Shadcn UI primitives
│   ├── 📁 lib/             # Utilities (Tailwind merge, etc.)
│   └── 📁 assets/          # SVG Components & Images
├── next.config.mjs         # Configuration
└── tailwind.config.ts      # Tailwind Theme

🚀 Getting Started

Follow these steps to set up the project locally:

1. Clone the repository

git clone [https://github.com/your-username/shibana-net.git](https://github.com/your-username/shibana-net.git)
cd shibana-net

2. Install dependencies

npm install
# or
yarn install
# or
pnpm install

3. Setup Environment

Create a .env.local file in the root directory:

NEXT_PUBLIC_API_URL=http://localhost:8080/api/v1

4. Run the development server

npm run dev

Open http://localhost:3000 with your browser to see the result.

🤝 Contributing

Contributions are always welcome!

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'feat: Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

Part of the ShibaNa Ecosystem 🐕