• Townie
    AI
  • Blog
  • Docs
  • Pricing
  • Weโ€™re hiring!
Log inSign up
jex

jex

io

Public
Like
io
Home
Code
4
backend
3
frontend
4
shared
2
README.md
Branches
1
Pull requests
Remixes
History
Environment variables
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data โ€“ all from the browser, and deployed in milliseconds.
Sign up now
Code
/
Code
/
Search
README.md

BubbleSpace - Modern Social Media Platform

A next-generation social media platform featuring a Bento grid layout, 3D illustrations, real-time messaging, and interactive elements.

Features

  • Bento Grid Layout: Clean, modular content organization
  • Custom 3D Illustrations: Unique visual identity with animated elements
  • Real-Time Messaging: Interactive cursors and dynamic chat experience
  • User Profiles: Customizable profiles with creative illustrations
  • Infinite Scroll: Seamless content browsing with lazy loading
  • Micro-interactions: Responsive hover effects and animations
  • Fully Responsive: Optimized for desktop and mobile
  • Accessibility: Full keyboard navigation and screen reader support

Project Structure

โ”œโ”€โ”€ backend/
โ”‚   โ”œโ”€โ”€ database/
โ”‚   โ”‚   โ”œโ”€โ”€ migrations.ts    # Database schema
โ”‚   โ”‚   โ””โ”€โ”€ queries.ts       # Database operations
โ”‚   โ”œโ”€โ”€ routes/
โ”‚   โ”‚   โ”œโ”€โ”€ auth.ts         # Authentication routes
โ”‚   โ”‚   โ”œโ”€โ”€ posts.ts        # Post management
โ”‚   โ”‚   โ”œโ”€โ”€ users.ts        # User management
โ”‚   โ”‚   โ””โ”€โ”€ messages.ts     # Real-time messaging
โ”‚   โ””โ”€โ”€ index.ts            # Main server entry point
โ”œโ”€โ”€ frontend/
โ”‚   โ”œโ”€โ”€ components/
โ”‚   โ”‚   โ”œโ”€โ”€ App.tsx         # Main application
โ”‚   โ”‚   โ”œโ”€โ”€ BentoGrid.tsx   # Grid layout component
โ”‚   โ”‚   โ”œโ”€โ”€ UserProfile.tsx # Profile management
โ”‚   โ”‚   โ”œโ”€โ”€ Chat.tsx        # Messaging interface
โ”‚   โ”‚   โ””โ”€โ”€ Post.tsx        # Post components
โ”‚   โ”œโ”€โ”€ index.html          # Main HTML template
โ”‚   โ”œโ”€โ”€ index.tsx           # Frontend entry point
โ”‚   โ””โ”€โ”€ style.css           # Custom styles
โ””โ”€โ”€ shared/
    โ”œโ”€โ”€ types.ts            # Shared TypeScript types
    โ””โ”€โ”€ utils.ts            # Shared utilities

Tech Stack

  • Backend: Hono.js with SQLite database
  • Frontend: React 18.2.0 with TypeScript
  • Styling: TailwindCSS with custom animations
  • Real-time: WebSocket connections for messaging
  • Storage: Val Town Blob storage for media

Getting Started

The platform is automatically deployed on Val Town. Access the main application through the HTTP endpoint.

API Endpoints

  • GET / - Main application
  • POST /api/auth/login - User authentication
  • GET /api/posts - Fetch posts with pagination
  • POST /api/posts - Create new post
  • GET /api/users/:id - Get user profile
  • PUT /api/users/:id - Update user profile
  • WebSocket /api/messages - Real-time messaging
Code
backendfrontendsharedREADME.md
FeaturesVersion controlCode intelligenceCLI
Use cases
TeamsAI agentsSlackGTM
DocsShowcaseTemplatesNewestTrendingAPI examplesNPM packages
PricingNewsletterBlogAboutCareers
Weโ€™re hiring!
Brandhi@val.townStatus
X (Twitter)
Discord community
GitHub discussions
YouTube channel
Bluesky
Terms of usePrivacy policyAbuse contact
ยฉ 2025 Val Town, Inc.