Skip to content

mangelrfdev/estacion-inmobiliaria

Repository files navigation

EstacionInmobiliaria.cl

🌐 English · Español

Portfolio website to browse apartments and houses for rent or sale in Chile’s Metropolitan Region. It is not a standalone app: it is the end product of a system whose data is produced by Francis Suite — a Python framework with XML workflows that extracts, validates, and normalizes listings from portals and broker sites.

Next.js 14 TypeScript Live demo Status: functional

The overall goal was to prove the framework on a real use case and, at the same time, run a site that framework actually feeds:

Goal Where it lives What it shows
Fetch and normalize listings Francis Suite The XML → NDJSON pipeline works for repeatable real-estate data
Present that data in a usable product This repository Ingestion, Supabase, and a search UI where I also invested in behavior, UX, and visual polish

I spent considerable effort on how the site feels (filters, scroll, dark mode, accessibility), but the ecosystem boundary is clear: Francis Suite delivers the data; this repo persists it and puts it in front of anyone looking for a place.

The project is functional: the live demo and main flows (search, favorites, ingestion) already work. It is also under active development — new sources in Francis, ingestion improvements, and UI refinements.

View live demo →


What you can do here

  • Search by comuna (district), property type, bedrooms, bathrooms, floor area, and price range (CLP or UF).
  • Save favorites in the browser without creating an account.
  • Share a search link so someone else sees the same filters.
  • Use light or dark mode following your system preference.
  • Open each listing and reach the original ad on the source portal.
  • Review ingestion runs toward Supabase from an admin panel.

The interface is built to work well on phone, tablet, and desktop.


How the pieces fit together

Francis Suite produces the data; Estación consumes and displays it. Two repositories, one contract:

Piece Repository Responsibility
Francis Suite github.com/mangelrfdev/francis-suite Extract data from portals and brokers, clean it, validate it, and export NDJSON
Estacion Inmobiliaria (this repo) Here Ingest that NDJSON, persist in Supabase, and show it in the UI

Francis Suite does not replace this site: it does not run the web app, host the database, or upload rows to Supabase. This repo does not do scraping or define XML workflows; it focuses on the end product.

End-to-end flow

Sources (websites, feeds)
            │
            ▼
   Francis Suite
   (XML workflows · Python)
            │
            │  listings.ndjson
            │  RUN_MANIFEST.JSON
            │  (listing record + schema)
            ▼
   Ingestion (this repository)
            │
            ▼
   Supabase / PostgreSQL
            │
            ▼
   Website
   (/buscar · favorites · admin)

Contract between both: listings.ndjson files with a validated listing record, plus a per-run manifest (RUN_MANIFEST.JSON) with execution metadata.


Data pipeline (Francis Suite)

If you came from the site and wonder where the data comes from, Francis Suite is the project to read. It is a low-code XML framework built in Python for extraction and data processing. Here it acts as the acquisition engine: everything you see on /buscar went through its workflows first:

  • Acquisition: HTTP requests with headers, timeouts, and proxies defined in XML.
  • Transformation: portal HTML → clean XML → XPath for each listing field.
  • Modeling: the listing record goes through schema validation, row-level checks, key-based deduplication, and an NDJSON journal.
  • Delivery: each run outputs a listings.ndjson file ready for this repo’s ingestion.

Francis Suite is functional (not a draft): it runs in production to feed Estación, has 150+ pytest tests, and supports hands (XML tags + Python classes) to extend behavior without changing the core engine.

For the data side, the Francis Suite repo has its own documentation and MIT license.


Web layer details I cared about

Once Francis delivers valid listings, this repo makes the search experience reliable. Examples:

  • URL-backed filters: share searches without losing state.
  • Stable filter panel: does not break or overlap the footer on scroll.
  • Responsive header: the site name does not cover buttons on narrow screens.
  • Accessible disclaimer: focus trap, keyboard navigation, solid contrast.
  • Mock mode: run the site locally without Supabase and see sample results.

Tech stack

Application (this repository)

Layer Technology
Frontend Next.js 14 (App Router), React, TypeScript
Styling Tailwind CSS
Database Supabase (PostgreSQL)
Deploy Vercel

Data (sibling project)

Layer Technology
Extraction and normalization pipeline Francis Suite — Python 3.11+, XML, lxml, httpx

Run it locally

npm install
cp .env.example .env.local
npm run dev

On Windows (PowerShell):

Copy-Item .env.example .env.local

By default the site starts with mock data (USE_MOCK_DATA=true in .env.example), so you can explore the UI without configuring Supabase. For real data you need the env vars from the example and a database already loaded.


About the author

I’m Miguel Rojas. With Francis Suite I wanted to show that a data framework can support a real case; with Estación, that the case can look like a product — reliable data on top, a clear interface below.

If you reviewed the demo or the code and have feedback, I’m happy to hear it.


Related projects

  • Francis Suite — low-code XML framework (Python) that extracts, validates, and normalizes the listings you see on this site. Same author, separate repository.

Legal notice

Demonstration project, not for commercial use. Property information is illustrative and comes from public sources for educational purposes. It does not represent any real-estate agency or broker.

Releases

Packages

Contributors

Languages