Wanderlust Svelte Themes

Wanderlust

A group project for COMPSCI 719 course. It is a simple travel blog website built with Svelte, allowing users to browse and share travel stories and destination posts.

Wanderlust

Wanderlust is a full-stack travel blogging platform with a browser-based frontend, REST API backend, and a desktop client module. The project includes user authentication, article publishing, comments, profile management, image upload, and admin support.

Key Features

  • User registration and login
  • Profile management with avatar/icon support
  • Browse, search, sort, and paginate articles
  • Create, edit, and delete your own articles
  • Comment on articles with nested replies
  • Like articles and display comment counts
  • Upload images for profile icons and articles
  • Backend user roles including admin support

Repository Structure

  • backend/ - Node.js Express API server
    • src/app.js - main server entry point
    • src/data/ - DAO modules and SQLite database initialization
    • src/routes/ - API router structure
    • src/sql/init-db.sql - database schema and sample seed data
    • .env - backend environment configuration
  • frontend/ - SvelteKit web application
    • src/routes/ - frontend page routes
    • src/lib/components/ - reusable UI components
    • src/lib/js/api-url.js - API endpoint configuration
    • .env - frontend API base URL settings
  • desktop-client/ - Java desktop client module for administrative or offline use

Prerequisites

  • Node.js 18+ (recommended)
  • npm
  • Svelte
  • sqlite3 (optional for manual database initialization)
  • Java JDK (if you want to run the admin interface)

Backend Setup

  1. Open a terminal and go to the backend folder:

    cd backend
    
  2. Install dependencies:

    npm install
    
  3. Confirm or update .env values. The default backend .env includes:

    PORT=3000
    JWT_KEY=CS719ISAWESOME
    DB_FILENAME=project-database.db
    DB_INIT_SCRIPT=src/sql/init-db.sql
    FRONTEND_ORIGIN=http://localhost:5173
    SALTROUND=10
    
  4. Start the backend server in development mode:

    npm run dev
    

The backend listens on http://localhost:3000 and exposes API routes under /api.

Frontend Setup

  1. Open a second terminal and go to the frontend folder:

    cd frontend
    
  2. Install dependencies:

    npm install
    
  3. Confirm the frontend .env values. The default file contains:

    PUBLIC_API_BASE_URL=http://localhost:3000/api
    PUBLIC_IMAGES_URL=http://localhost:3000/images
    PUBLIC_SERVER_URL=http://localhost:3000
    
  4. Start the frontend development server:

    npm run dev
    

The frontend runs on http://localhost:5173 by default.

Running the Application

  1. Start the backend first.
  2. Start the frontend second.
  3. Open the browser at http://localhost:5173.

If the backend database file does not exist, the backend automatically initializes SQLite using backend/src/sql/init-db.sql.

Database Initialization

The backend uses SQLite and initialises the database from backend/src/sql/init-db.sql when DB_FILENAME is missing.

If you want to initialize manually, from backend/ run:

sqlite3 project-database.db < src/sql/init-db.sql

Example Accounts

You can log in with these seeded users:

  • johndoe / Password123.
  • janedoe / Password456!
  • guest / pAssword1!
  • admin / Abc12345@ (admin user)

Desktop Client

A Java desktop client is available under desktop-client/. It provides a separate UI module and can be built with your Java development environment.

Notes

  • Backend and frontend communicate via PUBLIC_API_BASE_URL.
  • Uploaded images are served from http://localhost:3000/images.
  • User authentication uses JWT tokens stored in cookies.

Contact

For questions related to the project, please open an issue or contact the project owner via GitHub.

Top categories

Loading Svelte Themes