Log inSign up
David_Navi
David_NaviBlogged
Public
Like
Blogged
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in miliseconds.
Sign up now
Code
/
Search
index.ts
https://David_Navi--0630a7d23fbe11f0b6c376b3cceeab13.web.val.run
README.md

Daily Blog - Social Blogging Platform

A social blogging platform where users can share their daily experiences, thoughts, and stories with the community.

Features

  • User Profiles: Create and customize personal profiles
  • Blog Posts: Write and publish daily blog posts with rich text
  • Social Interactions: Like, comment, and share posts
  • Feed: Browse post summaries on the main page
  • Full Post View: Click to read complete posts
  • Responsive Design: Works on desktop and mobile

Project Structure

├── backend/
│   ├── database/
│   │   ├── migrations.ts    # Database schema setup
│   │   └── queries.ts       # Database query functions
│   ├── routes/
│   │   ├── auth.ts         # Authentication routes
│   │   ├── posts.ts        # Post CRUD operations
│   │   ├── users.ts        # User profile operations
│   │   └── static.ts       # Static file serving
│   └── index.ts            # Main Hono app entry point
├── frontend/
│   ├── components/
│   │   ├── App.tsx         # Main React app
│   │   ├── PostCard.tsx    # Post summary component
│   │   ├── PostDetail.tsx  # Full post view
│   │   ├── UserProfile.tsx # User profile component
│   │   └── CreatePost.tsx  # Post creation form
│   ├── index.html          # Main HTML template
│   ├── index.tsx           # Frontend entry point
│   └── style.css           # Custom styles
├── shared/
│   └── types.ts            # Shared TypeScript types
└── README.md

Tech Stack

  • Backend: Hono (TypeScript API framework)
  • Frontend: React 18.2.0 with TypeScript
  • Database: SQLite
  • Styling: TailwindCSS
  • Storage: Val Town Blob for user avatars

Getting Started

  1. The backend automatically sets up the database on first run
  2. Visit the main page to start browsing posts
  3. Create an account to start posting and interacting
  4. Customize your profile and start sharing your daily experiences

API Endpoints

  • GET / - Main feed page
  • GET /api/posts - Get all posts (with pagination)
  • GET /api/posts/:id - Get specific post with comments
  • POST /api/posts - Create new post
  • POST /api/posts/:id/like - Like/unlike a post
  • POST /api/posts/:id/comments - Add comment to post
  • GET /api/users/:id - Get user profile
  • POST /api/users - Create/update user profile
HTTP
Code