World Vibe Web
The distributed app store for vibe-coded projects. Browse, discover, and install open-source apps from across GitHub.
O delivery mais fofo e rápido da sua cidade
Translation pending
CommerceTypeScript · JavaScriptGitHub @Bear-System-BrasilOnlineOwner unconfirmed
Have you tried it? One tap is enough. No sign-in needed.
No updates detected yet. GitHub releases will appear here.
GitHub star growth between the latest completed 8-hour observations
The distributed app store for vibe-coded projects. Browse, discover, and install open-source apps from across GitHub.
Owners of public repositories under a personal GitHub account can sign in to verify ownership and manage the introduction themselves. No administrator approval is needed.
Sign in, generate a verification file, and commit it to this repository’s default branch within 30 minutes. Files on other branches or forks do not count. Then check the file below to manage the project without administrator approval. Keep the file to retain your access.
If needed, you will go to sign-in. After signing in, return here and press your chosen verification button again.
Run /nomorevibe verify in your project folder to verify ownership and manage the introduction yourself.
Verify in one minuteAsk about other verification options
Loading the full README. The saved excerpt is shown below.
A modern, full-featured food delivery platform built with Next.js 15 and React 19
Bear Delivery is a comprehensive food delivery platform that connects customers with restaurants. The application provides a seamless experience for browsing restaurants, managing orders, and tracking deliveries in real-time.Read the full README ↗A modern, full-featured food delivery platform built with Next.js 15 and React 19
Bear Delivery is a comprehensive food delivery platform that connects customers with restaurants. The application provides a seamless experience for browsing restaurants, managing orders, and tracking deliveries in real-time.
Key Roles (enforced via middleware.ts route protection):
src/middleware.ts)git clone <repository-url>
cd like-delivery-app
npm install
# or
yarn install
# or
pnpm install
cp .env.example .env.local
Edit .env.local and add your configuration:
NEXT_PUBLIC_API_URL=https://bearsystem.tech
NEXT_PUBLIC_APP_URL=http://localhost:3000
npm run dev
npm run build
npm start
like-delivery-app/
├── src/
│ ├── middleware.ts # Role-based route protection
│ ├── app/ # Next.js App Router pages
│ │ ├── (home)/ # Home page (route group)
│ │ ├── layout.tsx # Root layout
│ │ ├── cart/ # Cart page
│ │ ├── checkout/ # Checkout flow
│ │ ├── orders/ # Order history (client)
│ │ ├── order-status/ # Order status tracking page
│ │ ├── profile/ # User profile
│ │ ├── restaurant/[id]/ # Restaurant detail
│ │ ├── restaurant-landing-page/ # Public restaurant landing page
│ │ ├── restaurant-register/ # Restaurant self-registration
│ │ ├── menu-management/ # Management: Menu management
│ │ ├── category-management/ # Management: Category management
│ │ ├── kitchen/ # Cook: Kitchen Display System (KDS)
│ │ ├── financial-management/ # Financial: dashboard, cash-register, finance, orders, customers, settings
│ │ ├── team-management/ # Management: staff & roles
│ │ ├── delivery-dashboard/ # Delivery: driver dashboard
│ │ ├── company-profile/ # Management: Business profile
│ │ └── unauthorized/ # Access denied page
│ │
│ ├── components/ # React components
│ │ ├── ui/ # Base UI components (shadcn/ui)
│ │ ├── auth-modal/ # Authentication modal
│ │ ├── checkout/ # Checkout steps (delivery, payment, review)
│ │ ├── customize-order/ # Product variations/add-ons customization
│ │ ├── kitchen/ # Kitchen Display System components
│ │ ├── financial-dashboard/ # Financial dashboard widgets
│ │ ├── order-detail-sheet/ # Order detail side sheet
│ │ ├── delivery/ # Delivery list/tracking components
│ │ ├── notifications/ # Notification bell/panel
│ │ ├── sidebar-menu-management/ # Admin sidebar navigation
│ │ ├── protected-route/ # Client-side role guard
│ │ ├── footer/ # Footer component
│ │ ├── main-header/ # Header component
│ │ ├── restaurant-info/ # Restaurant info card
│ │ └── ... # Other feature components
│ │
│ ├── hooks/ # Custom React hooks
│ │ ├── use-cart-actions.ts # Cart management
│ │ ├── use-restaurants.ts # Restaurant data
│ │ ├── use-kitchen-orders.ts # KDS real-time order queue
│ │ ├── use-financial-dashboard.ts # Financial dashboard data
│ │ ├── use-cash-register.ts / use-cash-movement.ts # Cash register
│ │ ├── use-delivery-driver.ts # Delivery dashboard logic
│ │ ├── use-team-management.ts # Team/staff management
│ │ ├── use-notifications.ts # Notification bell feed
│ │ └── ... # Other hooks
│ │
│ ├── stores/ # Zustand stores
│ │ ├── auth-store.ts # Auth state
│ │ ├── cart-store.ts # Cart state
│ │ ├── favorites-store.ts # Favorites
│ │ ├── notifications-store.ts # Notification bell feed
│ │ ├── preferences-store.ts # User preferences
│ │ ├── financial-preferences-store.ts # Financial UI preferences
│ │ └── ui-store.ts # Misc UI state
│ │
│ ├── providers/ # App-level providers
│ │ └── notifications-provider.tsx # Socket.IO notifications listener
│ │
│ ├── services/ # API services
│ │ ├── api.ts # Centralized API client
│ │ └── restaurants/ # Restaurant-specific service helpers
│ │
│ ├── utils/ # Utility functions
│ │ ├── storage-manager.ts # Storage abstraction
│ │ ├── format-currency.ts # Currency formatting
│ │ └── ... # Other utilities
│ │
│ ├── contexts/ # React contexts
│ │ └── auth-provider.tsx # Auth context wrapper
│ │
│ ├── types/ # TypeScript types
│ │ └── index.ts # Type definitions
│ │
│ ├── constants/ # Constants
│ │ ├── restaurant-categories.ts
│ │ └── order-management.ts
│ │
│ └── lib/ # Library configurations
│ ├── utils.ts # Shared utilities
│ ├── jwt.ts / session.ts # Auth session helpers
│ ├── socket-auth.ts # Socket.IO auth handshake
│ ├── geocode.ts # Nominatim (OpenStreetMap) geocoding
│ └── notify.ts # Notification dispatch rules
│
├── public/ # Static assets
├── DOCS/ # Documentation
└── like-delivery-backend-dev/ # Backend (separate project)
Feature Component (Smart)
├── UI Components (Presentational)
├── Custom Hooks (Business Logic)
└── API Services (Data Layer)
Zustand Stores (Client State)
auth-store.ts - Authentication state (user, token)cart-store.ts - Shopping cart (orderId for persistence)favorites-store.ts - Favorite restaurantsnotifications-store.ts - Notification bell feed (customer & management)preferences-store.ts - User preferences (theme, language, notifications)financial-preferences-store.ts - Financial dashboard UI preferencesui-store.ts - Misc shared UI stateTanStack Query (Server State)
// Example: Zustand for client state
const { user, isAuthenticated } = useAuthStore()
// TanStack Query for server state
const { data: restaurants, isLoading } = useRestaurants()
User Action
↓
Component Handler
↓
Custom Hook (Business Logic)
↓
├─→ Zustand Store (Client State)
└─→ API Service (Server State)
↓
TanStack Query (Caching & Sync)
↓
UI Update (Optimistic or Real)
Centralized storage via storage-manager.ts:
import { storageManager, STORAGE_KEYS } from '@/utils/storage-manager'
// Use standardized keys
storageManager.local.set(STORAGE_KEYS.AUTH, data)
Centralized API Client (services/api.ts)
import { apiService } from '@/services/api'
// Usage
const response = await apiService.restaurants.getById(id)
const products = await apiService.products.getByCompany(companyId)
Backend URL: https://bearsystem.tech
Key Endpoints:
/auth/* - Authentication/company/* - Restaurants/Companies/product/* - Menu items/order/* - Orders (Redis-based)/delivery/* - Deliveries/address/* - User addresses/upload/* - File uploads (S3)auth-store.ts, persisted)like_session cookie (read by src/middleware.ts on the server)src/middleware.ts decodes the JWT cookie and redirects unauthenticated/unauthorized requests before the page renders (see the PROTECTED route table for role requirements per prefix)<ProtectedRoute allowedRoles={[...]}> component (src/components/protected-route) double-checks the hydrated Zustand auth state and redirects to /?openAuth=true or /unauthorized// Client-side guard example (src/app/kitchen/page.tsx)
export default function KitchenPage() {
return (
<ProtectedRoute allowedRoles={["cook", "manager", "owner", "admin"]}>
<Kitchen />
</ProtectedRoute>
)
}
any types)@/types// Components - PascalCase
export default function RestaurantCard() {}
// Files - kebab-case
restaurant-card.tsx
use-cart-actions.ts
// Hooks - camelCase with 'use' prefix
function useRestaurants() {}
// Constants - UPPER_SNAKE_CASE
export const API_BASE_URL = ''
component-name/
├── index.tsx # Main component
├── component-name.test.tsx # Tests (future)
└── types.ts # Component-specific types
Custom hooks encapsulate business logic and make components clean:
// Good - Logic in custom hook
function useRestaurantActions() {
const router = useRouter()
const { addItem } = useCartStore()
const handleRestaurantClick = (id: string) => {
router.push(`/restaurant/${id}`)
}
return { handleRestaurantClick }
}
// Component stays clean
function RestaurantCard({ restaurant }) {
const { handleRestaurantClick } = useRestaurantActions()
return (
<div onClick={() => handleRestaurantClick(restaurant.id)}>
{restaurant.name}
</div>
)
}
// Good - Server state with TanStack Query
const { data: restaurants } = useQuery({
queryKey: ['restaurants'],
queryFn: () => apiService.restaurants.getAll(),
staleTime: 10 * 60 * 1000, // 10 minutes
})
// Good - Client state with Zustand
const { favorites, toggleFavorite } = useFavoritesStore()
// Dynamic imports for heavy components
const MenuManagement = dynamic(() => import('@/app/menu-management'))
// Expensive calculations
const sortedRestaurants = useMemo(() => {
return restaurants.sort((a, b) => b.rating - a.rating)
}, [restaurants])
// Show content in batches (implemented in home page)
const [visibleCount, setVisibleCount] = useState(3)
useEffect(() => {
if (visibleCount < restaurants.length) {
setTimeout(() => setVisibleCount(prev => prev + 3), 100)
}
}, [visibleCount, restaurants.length])
// Good - Utility classes
<button className="px-4 py-2 bg-brand-500 hover:bg-brand-600 rounded-lg">
Order Now
</button>
// Using class-variance-authority
const buttonVariants = cva(
"px-4 py-2 rounded-lg transition-colors",
{
variants: {
variant: {
primary: "bg-brand-500 hover:bg-brand-600",
secondary: "bg-gray-200 hover:bg-gray-300",
}
}
}
)
// Mobile-first approach
<div className="w-full sm:w-1/2 lg:w-1/3">
// Small screens: full width
// Medium screens: half width
// Large screens: third width
</div>
const mutation = useMutation({
mutationFn: apiService.cart.addItem,
onMutate: async (newItem) => {
// Optimistically add to UI
setItems(prev => [...prev, newItem])
},
onError: (error, newItem, context) => {
// Rollback on error
setItems(context.previousItems)
},
})
try {
const response = await apiService.orders.create(orderData)
if (response.success) {
toast.success('Order placed successfully!')
} else {
toast.error(response.message)
}
} catch (error) {
toast.error('Connection error. Please try again.')
}
git push origin main
Set these in your deployment platform:
NEXT_PUBLIC_API_URL=https://bearsystem.tech
NEXT_PUBLIC_APP_URL=https://your-domain.com
The app is optimized for production:
npm run buildgit checkout -b feature/your-feature-name
git commit -m "feat: add restaurant filtering by cuisine"
git push origin feature/your-feature-name
feat: Add new feature
fix: Bug fix
docs: Documentation changes
style: Code style changes (formatting)
refactor: Code refactoring
perf: Performance improvements
test: Adding tests
chore: Build process or auxiliary tool changes
like-delivery-backend-dev/https://bearsystem.techThis project is private and proprietary.
For questions or support, check the documentation in /DOCS or reach out to the team.
.