Documentation
Home GitHub

Project Structure

This page covers the repo layout, the naming convention for example folders, and how the landing page ties every example together.

Layout

Path Content
index.html Landing page: initialized with PDRenderKit, renders README.md with PDMarkdownKit 1.6.0
README.md Landing page content, including the 38-entry example gallery
target/<YYYYMMDD>/ One example; the folder name is its creation date
image/<YYYYMMDD>.jpg Example preview screenshot, named after the folder
image/website.jpg Landing page Open Graph image
css/index.css Landing page styles
sitemap.xml URLs for the landing page and all 38 examples
.gitattributes Excludes .md / .scss / .css from GitHub language statistics

Example Folder Contents

Path Description
index.html Example entry; some examples ship several HTML files (e.g. login.html, search.html in 20240625)
view/, views/ HTML fragments loaded dynamically by the framework (e.g. 20230616, 20230719)
css/ Compiled SCSS output, the file index.html actually loads
sass/ Style sources: an entry file plus _*.scss partials
js/ Example interaction logic and sample data
image/ The example's own assets

Landing Page and Examples

graph TB
    I[index.html] -->|fetch| R[README.md]
    I --> K[PDRenderKit 1.5.2]
    I --> M[PDMarkdownKit 1.6.0]
    R --> M
    M --> G[Example gallery]
    G --> P["image/&lt;YYYYMMDD&gt;.jpg"]
    G -->|click| T["target/&lt;YYYYMMDD&gt;/index.html"]
    T --> C[css/ compiled output]
    T --> J[js/ interaction logic]
    T --> F["PDRenderKit / QuickUI CDN"]
    S[sass/] -->|Dart Sass| C
中文