Skip to main content

Prerequisites

Before starting development, ensure you have the following installed on your system:
1

Node.js

Install Node.js version 18.0.0 or higher. The project uses modern JavaScript features and requires a recent Node.js version.
node --version  # Should be v18.0.0 or higher
2

PostgreSQL

Install PostgreSQL 13 or higher for the database. The schema uses modern PostgreSQL features including:
  • Full-text search with tsvector
  • GIN indexes
  • Triggers and functions
psql --version  # Should be 13.0 or higher
3

Git

Git for version control and cloning the repository.
git --version

Installation

1

Clone the repository

Clone the Inmobiliaria Web repository to your local machine:
git clone <repository-url>
cd inmobiliaria-web
2

Install dependencies

Install all required npm packages using npm:
npm install
This will install all dependencies including:
  • React 19.2.3 - UI framework
  • TanStack Router - Type-safe routing
  • Vite 7 - Build tool and dev server
  • TypeScript 5.8.3 - Type safety
  • Tailwind CSS - Styling
  • Better Auth - Authentication
  • Leaflet & Google Maps - Map integrations
  • Lucide React - Icon library
3

Set up the database

Create a PostgreSQL database and run the schema:
# Create the database
createdb inmobiliaria

# Run the schema file
psql -d inmobiliaria -f inmobiliaria_complete_schema.sql
The schema file includes all table definitions, indexes, triggers, and sample data for property types, operation types, features, and tags.
4

Configure environment variables

Create a .env file in the project root with the required environment variables:
# API Configuration
VITE_API_URL=http://localhost:10000/api
The VITE_ prefix is required for Vite to expose environment variables to the client-side code.
See the Configuration page for all available environment variables.

Development Server

Start the development server with hot module replacement:
npm run dev
The application will be available at http://localhost:5173 (default Vite port).
Vite provides instant hot module replacement (HMR) for a fast development experience. Changes to your code will be reflected immediately without a full page reload.

Available Scripts

The following npm scripts are available:
npm run dev
# Starts Vite dev server with HMR
# Runs on http://localhost:5173 by default

Verify Installation

To verify your setup is correct:
1

Check dependencies

Ensure all packages installed successfully:
npm list --depth=0
2

Verify TypeScript compilation

Check that TypeScript compiles without errors:
npx tsc --noEmit
3

Test database connection

Verify PostgreSQL is running and accessible:
psql -d inmobiliaria -c "SELECT COUNT(*) FROM property_types;"
Should return 14 property types if the schema was loaded correctly.
4

Start the dev server

Launch the development server and verify it runs without errors:
npm run dev
Visit http://localhost:5173 in your browser.

Backend API Setup

The frontend expects a backend API running at the configured VITE_API_URL. Make sure your backend server is running and accessible.
The default API endpoint is http://localhost:10000/api. The API base URL is determined by:
  1. VITE_API_URL environment variable (highest priority)
  2. Falls back to http://localhost:10000/api in both development and production
See src/lib/api.ts:7-17 for the API base URL configuration logic.

Troubleshooting

Vite will automatically try the next available port. You can also specify a custom port:
npm run dev -- --port 3000
Clear node_modules and reinstall:
rm -rf node_modules package-lock.json
npm install
Verify PostgreSQL is running:
pg_isready
Check your database credentials and connection settings in the backend configuration.
Ensure you’re using TypeScript 5.8.3:
npm list typescript
Restart your IDE’s TypeScript server if errors persist.

Next Steps

Now that your environment is set up:

Build docs developers (and LLMs) love