Galactic Nights E-Commerce Platform

N3xUs Glass — Premium E-Commerce Platform & Telegram Mini App

N3xUs Glass is a modern, high-performance e-commerce storefront specializing in premium glass and smoking accessories. Built with a "mobile-first, omnichannel" mindset, the platform operates seamlessly as both a standalone web application and a fully integrated Telegram Mini App.

🚀 Tech Stack

Frontend: Next.js 14 (App Router), React, Vanilla CSS

Backend: Next.js API Routes (Serverless)

Database: MongoDB (Mongoose ORM)

Authentication: JWT (JSON Web Tokens) with secure HTTP-only cookies, Google OAuth integration

Media Storage: Cloudinary

Integrations: Telegram Web App SDK, Telegram Bot API (Webhooks)

Deployment: Vercel

🌟 Key Features

Omnichannel Storefront

Responsive Web App: A galactic-themed, highly visual storefront with smooth animations, dynamic glassmorphism UI, and optimized mobile navigation.

Telegram Mini App Integration: Native integration with the Telegram Web App SDK. The storefront can be launched directly inside a Telegram chat, automatically scaling to the user's device and providing a frictionless in-app shopping experience.

Advanced Product & Cart Management

Dynamic Catalog: robust filtering and sorting capabilities (by category, material, price, etc.) utilizing MongoDB aggregation and indexing.

Persistent Cart State: Client-side cart management leveraging the React Context API to ensure a snappy user experience.

Real-Time Inventory: Server-side stock validation during checkout to prevent overselling.

Secure Checkout & Order Processing

Streamlined Checkout Flow: Multi-step checkout process with integrated age-gating verification.

Dynamic Coupon System: Real-time validation for percentage and fixed-amount discount codes.

Telegram Order Receipts: Upon successful checkout within the Mini App, the webview smoothly closes, and a serverless webhook triggers the Telegram Bot to send a markdown-formatted digital receipt directly to the customer's chat.

Custom Admin Dashboard

Role-Based Access Control (RBAC): Secure admin routes protecting sensitive business data.

Inventory Management: Full CRUD capabilities for products, including direct image uploads to Cloudinary.

Order Fulfillment: Comprehensive order tracking and status management.

🧠 Architecture & Challenges Solved

Serverless Telegram Bot via Webhooks

Traditional Telegram bots rely on long-polling scripts that require a dedicated running server. To keep the infrastructure lightweight and costs at zero, the bot was refactored to use Webhooks via Next.js API routes. When a user interacts with the bot, Telegram sends an HTTP POST request to the Vercel-hosted API, which responds instantaneously. This enables the bot to scale infinitely without maintaining a persistent Node.js process.

Universal Session Management

Handling authentication across standard browsers and embedded webviews (like Telegram) presents unique challenges. N3xUs Glass utilizes secure HTTP-only cookies for session management, ensuring that state is maintained securely regardless of where the application is accessed from, without relying on vulnerable localStorage implementations.

Aesthetic Design System

The UI was meticulously crafted using pure, vanilla CSS to maintain maximum control over the "Cosmic/Galactic" aesthetic. Custom keyframe animations (like heroGlow and float) and complex gradients were implemented without the bloat of heavy CSS frameworks, resulting in a unique, premium brand identity that loads incredibly fast.

Galactic Nights is a state-of-the-art, high-performance e-commerce engine designed for digital creator storefronts and next-gen merchants. Built from the ground up to support instant transaction processing, high-density traffic, and a stunning cyberpunk aesthetic, the platform blends cutting-edge web architecture with immersive user experiences.

---

## 🌌 Core Features

### 1. High-Performance Digital Storefront

* **Dynamic Catalog**: Real-time filtering, product searching, and dynamic category switching.

* **Instant Cart & Checkout**: High-fidelity side-cart panel supporting real-time tax, quantity adjustments, and automatic discount coupon validation.

* **Cyberpunk UI/UX**: Immersive dark mode styled with interactive glassmorphism components, custom glowing buttons, and smooth micro-animations.

### 2. Automated Stripe Payment Infrastructure

* **Secure Payment Flows**: Secure checkout sessions routed directly via Stripe's encrypted API.

* **Webhook Provisioning**: Automatic post-payment webhook listeners that instantly generate client projects, invoice records, and client access dashboards upon successful checkout.

* **Customer Portal**: Integrated self-service customer portal allowing users to manage subscription billing, download invoices, and update billing credentials on demand.

### 3. Encrypted Client Portal & Dashboards

* **Admin Control Center**: Comprehensive dashboard allowing full CRUD control over products, services, portfolio items, coupons, and client messages.

* **Interactive Message Hub**: Private real-time messaging interface between clients and the development team.

* **Secure WebAuthn & Passwordless Login**: Passkey support for lightning-fast, high-security administrator authentication.

---

## 🛠️ Technical Stack & Architecture

### Frontend & Rendering

* **Framework**: Next.js 16 (Turbopack compiler) utilizing dynamic page rendering (`force-dynamic`) to bypass static caching bottlenecks.

* **Styling**: Optimized CSS Variable design system for absolute control over variables, themes, responsive grids, and custom animation keyframes.

* **State & Navigation**: Next.js App Router for server-side and client-side optimization.

### Backend & Database

* **Database**: High-concurrency PostgreSQL hosted on **Neon Tech** with connection pooling.

* **ORM**: Prisma ORM for structured migration pipelines, type-safe queries, and schema reliability.

* **Authentication**: NextAuth.js configured with secure JWT session tokens and role-based permissions (ADMIN, OWNER, USER).

### Storage & Serverless hosting

* **Static Assets**: **Vercel Blob Storage** integrated with a client-side direct upload pipeline to bypass 4.5 MB serverless execution limits, allowing upload of media and files up to 500 MB.

* **Hosting**: Vercel Edge Serverless functions.

---

## 🎨 Design Philosophy

Galactic Nights challenges traditional e-commerce designs by utilizing a high-density, dark-mode cosmic theme. Implementing rich gradients (cyan to purple), subtle backlighting, custom scrollbars, and reduced-motion fallbacks, it delivers a visually striking interface without compromising loading performance or core SEO standards.