Skip to main content

Quickstart Guide

This guide will help you get up and running with OdontologyApp quickly. We’ll walk you through accessing the system, logging in with demo credentials, and performing basic operations.
This quickstart assumes you already have OdontologyApp installed and running. If not, see the Installation Guide first.

Prerequisites

Before you begin, ensure:
  • OdontologyApp is installed and the development server is running on http://localhost:5173
  • MySQL database is running with the schema and seed data imported
  • You have the default user credentials (provided below)

Step 1: Access the Login Page

1

Navigate to the application

Open your web browser and navigate to:
http://localhost:5173/login
You’ll see the OdontologyApp login screen with a modern teal/dark gradient background.
2

Understand the login interface

The login screen features three role selector buttons:
  • 🛡️ Administrador (Administrator)
  • 👨‍⚕️ Médico (Doctor)
  • 💼 Secretaria (Secretary)
The role selector automatically fills in the demo credentials for quick testing. You can click any role button to switch between demo users.

Step 2: Login with Demo Credentials

OdontologyApp comes with three pre-configured demo users, one for each role:
Username: admin
Password: admin123
1

Select a role

Click on the Administrador button. The form will automatically populate with:
  • Username: admin
  • Password: admin123
2

Login

Click the “Iniciar sesión →” button. You’ll see a loading state (“Iniciando sesión…”) while authentication occurs.
3

Welcome message

Upon successful login, you’ll receive a toast notification:
Bienvenido/a, Andrea 👋
You’ll be automatically redirected to the dashboard at /dashboard.
If you see “Credenciales inválidas” or “Usuario no encontrado”, verify that:
  1. The database is running
  2. The seed data has been imported from database.sql
  3. You’re using the exact credentials shown above

Step 3: Explore the Dashboard

After logging in as Administrator, you’ll see the executive dashboard with:

Dashboard Statistics

Four key metric cards at the top:
  1. 🏥 Pacientes - Total patient count with link to /patients
  2. 📅 Citas Hoy - Today’s appointment count with link to /appointments
  3. 📦 Inventario - Low stock items count with link to /admin/inventory
  4. 📈 Por Cobrar - Outstanding accounts receivable with link to /admin/reports

Clinical Management Panel

The main section displays:
  • Today’s appointment agenda with patient names, times, doctors, and status
  • Branch filter dropdown to view specific locations
  • Refresh button to update statistics
The sidebar contains:
  • Rendimiento Clínico - Completion rate progress bar
  • Pulso de Operaciones - Recent system activity timeline
  • Quick access buttons - Navigate to Patients, Appointments, Logistics, and Finance
The dashboard is role-specific. Doctors see their assigned patients and appointments, while secretaries see check-in/check-out focused metrics.

Step 4: View Sample Patient

OdontologyApp includes a sample patient “María Pérez” in the seed data.
1

Navigate to patients

Click on the 🏥 Pacientes card on the dashboard, or navigate to:
http://localhost:5173/patients
2

Find the sample patient

You’ll see a searchable patient list. The sample patient has:
  • Name: María Pérez
  • Cedula: 12.345.678-9
  • Medical Record No: 260001
  • Birth Date: March 12, 1985
  • Phone: +56 9 8888 1234
  • Email: [email protected]
  • Blood Group: O+
  • Allergies: Penicilina
  • Branch: Sucursal Central
3

View patient details

Click on the patient row to view the complete patient profile. You’ll see tabs for:
  • Ficha - General information
  • Historia Clínica - Medical records
  • Odontograma - Dental chart
  • Citas - Appointments
  • Archivos - File attachments
  • Finanzas - Financial records

Step 5: Create Your First Appointment

1

Navigate to appointments

Go to the appointments page:
http://localhost:5173/appointments
You’ll see a calendar/agenda view of scheduled appointments.
2

Click 'New Appointment'

Click the “Nueva Cita” or ”+” button to open the appointment creation form.
3

Fill in appointment details

Complete the appointment form:
  • Patient: Select “María Pérez” from the dropdown
  • Doctor: Select “Dr. Carlos Soto”
  • Branch: Select “Sucursal Central”
  • Date: Choose a date (e.g., today or tomorrow)
  • Time: Select a time slot (e.g., 10:00 AM)
  • Duration: 30 minutes (default)
  • Notes: “Consulta de control” (optional)
4

Save the appointment

Click “Guardar” or “Crear Cita”. You’ll receive a confirmation toast and see the appointment appear in the agenda.
The appointment will have a default status of “scheduled”. Secretaries can change it to “confirmed” or “waiting” as the patient arrives.

Step 6: Create a New Patient (Optional)

1

Navigate to patient management

Go to /patients and click “Nuevo Paciente” or the ”+” button.
2

Fill in required fields

The patient form requires:
// Required fields
first_name: "Juan"
last_name: "González"
medrecno: 260002  // Unique medical record number

// Optional but recommended
cedula: "98.765.432-1"  // National ID (must be unique)
birth_date: "1990-05-15"
phone: "+56 9 7777 5555"
email: "[email protected]"
sex: "masculino"  // or "femenino", "otro"
blood_group: "A+"
allergies: "Ninguna conocida"
branch_id: 1  // Sucursal Central
3

Save the patient

Click “Guardar”. The system will:
  1. Validate the data (Zod schema validation)
  2. Generate a unique UUID for the patient
  3. Create the patient record in the database
  4. Redirect you to the patient’s profile page

Understanding User Roles

Each role has different capabilities:
// Full system access
- Manage users, branches, doctors
- View all patients and appointments
- Access financial reports and inventory
- Configure system permissions
- View audit logs
- Manage treatment catalog

Authentication Flow

Understanding how authentication works in OdontologyApp:
// src/routes/api/auth/login/+server.js

1. User submits credentials (username + password)
2. System queries database: CALL sp_authenticate_user(username)
3. bcrypt compares password with hashed password
4. On success:
   - Create session object with user data
   - Set HTTP-only cookie (24-hour expiration)
   - Log the login event to audit logs
   - Return user data to client
5. Client stores auth state in Svelte store
6. Redirect to /dashboard
The session cookie structure:
{
  id: number,
  name: string,
  email: string,
  role: 'admin' | 'doctor' | 'secretary',
  initials: string,
  theme: 'light' | 'dark',
  branch: string,
  avatar_url: string | null
}

Route Protection

OdontologyApp uses SvelteKit hooks to protect routes:
// src/hooks.server.js

// Protected routes for admin only:
- /admin/settings
- /admin/treatments
- /admin/reports
- /users
- /branches
- /logs

// Public routes (no authentication):
- /login
- /api/auth/login
- /

// All other routes require authentication
If you attempt to access an admin route without admin privileges, you’ll be redirected to /dashboard?error=unauthorized.

API Endpoints Reference

Key API endpoints you’ll work with:
# Authentication
POST   /api/auth/login      # Login
DELETE /api/auth/login      # Logout

# Patients
GET    /api/patients        # List patients
POST   /api/patients        # Create patient
GET    /api/patients/[id]   # Get patient details
PUT    /api/patients/[id]   # Update patient
DELETE /api/patients/[id]   # Delete patient

# Appointments
GET    /api/appointments    # List appointments
POST   /api/appointments    # Create appointment
PUT    /api/appointments/[id] # Update appointment
DELETE /api/appointments/[id] # Cancel appointment

# Medical Records
GET    /api/patients/[id]/records      # Get medical history
POST   /api/patients/[id]/records      # Create record

# Odontogram
GET    /api/patients/[id]/odontogram   # Get odontogram
PUT    /api/patients/[id]/odontogram   # Update tooth status

# Dashboard
GET    /api/dashboard/stats?branchId=all # Get dashboard statistics

Common Operations

Checking Today’s Appointments

// The dashboard automatically fetches today's appointments
// Filter by branch:
GET /api/dashboard/stats?branchId=1  // Sucursal Central
GET /api/dashboard/stats?branchId=2  // Sucursal Norte
GET /api/dashboard/stats?branchId=all // All branches

Changing Appointment Status

// Update appointment status workflow:
// scheduled → confirmed → waiting → completed

PUT /api/appointments/[id]
{
  "status": "waiting"  // Patient arrived and checked in
}

Viewing Audit Logs (Admin Only)

// Navigate to /logs to see:
- User login/logout events
- Patient CRUD operations
- Appointment changes
- Permission modifications
- IP addresses and timestamps

Troubleshooting

”Error de conexión con el servidor”

Cause: Backend server is not running or database connection failed. Solution:
  1. Verify MySQL is running: sudo systemctl status mysql
  2. Check database credentials in .env file
  3. Ensure development server is running: npm run dev

”Credenciales inválidas”

Cause: Wrong username/password or seed data not imported. Solution:
  1. Re-import seed data: mysql -u root -p ontology_db < database.sql
  2. Verify passwords match the bcrypt hashes in database.sql

Page redirects to /login immediately

Cause: Session cookie expired or was cleared. Solution:
  1. Log in again (sessions expire after 24 hours)
  2. Check browser console for cookie errors
  3. Verify hooks.server.js is properly configured

”No tienes permisos para acceder a esa sección”

Cause: Attempting to access admin-only routes without admin role. Solution:
  1. Log out and log back in as admin user
  2. Or request permission assignment from an administrator

Next Steps

Installation Guide

Learn how to deploy OdontologyApp to production

API Reference

Explore the complete API documentation

Configuration

Configure environment variables and system settings

User Management

Learn how to manage users and permissions

Tips for Getting Started

Tip 1: Start by exploring the dashboard as each role (admin, doctor, secretary) to see how the interface adapts to different permission levels.
Tip 2: Use the sample patient “María Pérez” to test clinical features like creating medical records, updating odontograms, and uploading files before creating new patients.
Tip 3: The audit logs (accessible at /logs for admins) are invaluable for understanding system activity and debugging issues.
Tip 4: Each appointment has a UUID that can be used for public-facing reminder URLs without exposing database IDs.

Build docs developers (and LLMs) love