Frontend

Baseline uses a Vue-based SPA (Single Page Application) architecture. The frontend remains entirely decoupled from the backend, communicating exclusively through the API.

Technology Overview

Use these core libraries to build and manage your application:

Library	Purpose
vue-router	Manages client-side navigation.
@codingkiwi/hop	Provides Vue components and styling.
baseline-client	Simplifies all API interactions.
vite.	Bundles the assets

Authentication

By default, the baseline.auth module handles user authentication automatically.

INFO

Accessing baseline.auth.isAuthenticated within your client/router.js configuration automatically retrieves the session from localStorage and redirects unauthenticated users to the login page.

Interact with APIs

Use the baseline instance imported from your client root to perform CRUD operations on entities.

import { baseline } from "../baseline.js";

// Create a new entity with an attached file
baseline.api.create("custom_entity_name", {
    title: "example",
    user_id: baseline.auth.user.value.id,
    attached_file: new File([blob], "example image"),
});

Build User Interfaces

Leverage vue-router for navigation and @codingkiwi/hop for ready-to-use UI components.