Project Structure

Observable Framework documentation: Project Structure Source: https://observablehq.com/framework/project-structure

A Framework project consists of a home page (index.md) and any of the following:

• Additional pages (.md)
• Data loaders (.csv.py, .json.ts, etc.)
• Static data files (.csv, .json, .parquet, etc.)
• Other static assets (.png, .css, etc.)
• Shared components (.js)
• An app configuration file (observablehq.config.js)

Pages are written in Markdown (.md) intermingled with HTML, JavaScript, SQL, and other languages. JavaScript can also be imported from local modules (.js) and npm. Data loaders can be written in Python, R, JavaScript, or any other language, and output data snapshots. These snapshots, along with static data files, can be loaded into pages to render charts, tables, and other dynamic content.

And a typical project is structured like this: