从 Manifold 档案读懂 Remote In Tech：远程公司目录的 frontmatter 规范与页面渲染原理-平芜编程栈

数据集

【免费下载链接】remote-jobs

Source for remoteintech.company — a community-maintained directory of remote-friendly tech companies

项目地址：https://gitcode.com/GitHub_Trending/re/remote-jobs

Manifold 是 Remote In Tech 社区远程公司目录中的一份经典档案，它完整展示了「远程友好型科技公司」如何被结构化记录、校验并被静态站点渲染出来。本文将逐字段拆解这份档案，结合仓库中的标签定义、页面模板与集合逻辑，讲解一份公司档案从 Markdown 数据到最终 HTML 页面的完整链路，读完你既能看懂 Manifold 的团队与远程实践，也能掌握为同类公司新增或维护档案的实操方法。

Manifold 是谁：Company blurb 解读

manifold.md的正文第一节## Company blurb给出了对 Manifold 的定位：

We're an ambitious and well-funded startup, making it compelling for developers to break their deployments free from the closed ecosystems of cloud providers. We connect applications, wherever they are hosted, to independent cloud services made by developers who care.

这段描述传达了两个关键信息：Manifold 是一家资金充足的创业公司，核心产品是让开发者把部署从云厂商的封闭生态中解放出来，并将「托管在任何位置的应用」连接到「由开发者维护的独立云服务」。团队背景上，文档提到多数成员与开源世界联系紧密，曾效力于 Heroku、Salesforce、Red Hat、Canonical 等公司——这也解释了档案技术栈中大量云原生与开源工具的出现。

档案元数据：frontmatter 结构详解

与目录中其他约 850 家公司档案一致，Manifold 的所有结构化元数据都存放在文件开头的 YAML frontmatter 中：

--- title: "Manifold" slug: manifold website: https://manifold.co region: other remote_policy: hybrid company_size: small technologies: - devops - go - javascript - sql addedAt: 2017-07-04 updatedAt: 2018-04-16 ---

各字段的取值约束与含义如下（字段合法值定义在 src/_data/labels.js 中，是全仓库唯一的标签来源）：

字段	本档案取值	含义	允许取值（labels.js / CONTRIBUTING.md）
`title`	`"Manifold"`	公司显示名称	任意字符串
`slug`	`manifold`	页面与文件名标识，必须与文件名`manifold.md`一致	任意小写 slug
`website`	`https://manifold.co`	公司官网	任意合法 URL
`region`	`other`	招聘地区	`worldwide`/`americas`/`europe`/`americas-europe`/`asia-pacific`/`other`
`remote_policy`	`hybrid`	远程政策	`fully-remote`/`remote-first`/`hybrid`/`remote-friendly`
`company_size`	`small`	公司规模档位	`tiny`(1-10) /`small`(11-50) /`medium`(51-200) /`large`(201-1000) /`enterprise`(1000+)
`technologies`	`devops, go, javascript, sql`	技术标签（slug）	见 labels.js 的`tech`映射，共 25 个合法值
`addedAt`/`updatedAt`	`2017-07-04`/`2018-04-16`	收录与更新时间	由维护者管理，PR 中勿自行填写

注意technologies存储的是机器可读的 slug，而不是展示文本。例如本档案中的devops、go、javascript、sql会分别被 labels.js 映射为DevOps、Go、JavaScript、SQL再渲染到页面上。而正文## Company technologies一节列出的则是人类可读的技术栈描述（React、Go、Postgres、Swagger、Terraform、Kubernetes、Manifold、Git 与 GitHub），二者互为补充：frontmatter 用于分类与筛选，正文用于详细说明。

团队规模与远程状态

正文## Company size与## Remote status两节补充了量化的团队信息：

团队规模：约 25 人（截至 2018 年 1 月），与 frontmatter 中company_size: small（11-50 人档位）一致。
远程状态：文档明确标注 "Strongly supported"（强烈支持远程）。约 50% 成员位于加拿大哈利法克斯（Halifax）的总部办公室，少数在旧金山，其余成员完全远程办公；管理层（exec team）则分散在 Halifax、旧金山与远程三个位置。

这种「部分分布式 + 管理层跨地点」的组织形态，正是档案中remote_policy: hybrid的由来——它既不是fully-remote的纯远程，也不是remote-friendly的仅宽容态度，而是混合办公模式。该取值会被 src/_layouts/company.njk 渲染为一个指向/browse/hybrid/的标签链接，方便访客按远程政策浏览同类公司。

跨时区协作：Region 字段的实战含义

## Region一节给出了具体的时间协作范围：

UTC-9 to UTC+1. Time shifting at the boundaries is typically necessary.

即团队成员横跨从 UTC-9（如美国西海岸/阿拉斯加时区）到 UTC+1（如中欧时区）的约 10 个时区，边界时区的成员通常需要做时间错位（time shifting）来保证重叠工作时间。这与 frontmatter 中region: other的归类一致——它并不局限于某个大洲，因此被归入「Other」而非americas或europe。在 src/_config/collections.js 的按地区分组逻辑中，region缺失或未识别的公司统一落入other分组。

技术栈清单：Company technologies

正文的## Company technologies罗列了 Manifold 的完整技术栈：

React（前端）
Go（后端主力）
Postgres（数据库）
Swagger（API 文档与契约）
Terraform（基础设施即代码）
Kubernetes（容器编排）
Manifold（自家平台产品，同时出现在技术栈中）
Git 和 GitHub（协作与版本控制）

这份清单解释了 frontmatter 中go、devops、javascript、sql四个技术标签的来源：Go 与 DevOps 是核心，JavaScript 对应 React 前端，SQL 对应 Postgres 数据层。在页面渲染时，company.njk 模板会遍历 frontmatter 的technologies数组，为每项生成指向/browse/{tech}/的标签链接，访客点击即可发现使用相同技术的其他远程公司。

办公地点与应聘方式

## Office locations明确了两处实体办公点：

总部（HQ）：加拿大新斯科舍省哈利法克斯（Halifax, NS）
旧金山办公室：San Francisco

## How to apply一节指向 Manifold 官方招聘页面。从数据结构看，Manifold 档案的 frontmatter 中并未设置careers_url字段，因此 company.njk 模板中的主按钮会按careers_url or website的优先级回退到website（公司官网），按钮文案也相应显示为 "Visit Website" 而非 "Apply Now"。这一细节提示维护者：想让求职者直达投递入口，应在 frontmatter 中显式补充careers_url。

档案如何变成页面：渲染链路全景

Manifold 档案从 Markdown 到 HTML 的渲染链路由 Eleventy 驱动，核心节点如下：

数据加载：src/companies/companies.json 为整个目录统一指定layout: company；src/companies/companies.11tydata.js 为每份档案自动生成 SEO meta description——它从## Company blurb标题后截取正文、剥离 Markdown 语法并截断到约 155 字符。
页面模板：src/_layouts/company.njk 读取 frontmatter 渲染标题、地区标签、远程政策标签、技术栈标签以及 "Last updated"（由updatedAt格式化）信息。
集合组织：src/_config/collections.js 中的getAllCompanies将所有档案按标题字母序排列；getCompaniesByRegion与getCompaniesByTech则按地区/技术分组，供/browse/页面与标签页使用；getRecentCompanies依据addedAt选出最近 12 家新收录公司。
标签映射：所有展示文本最终都经由 src/_data/companyHelpers.js 的getRegionLabel、getRemotePolicyLabel、getCompanySizeLabel、getTechLabel从 labels.js 取词，保证枚举值有且仅有一个权威来源。

因此，Manifold 档案中的每一个字段都不是「死数据」，而是会被目录的首页、浏览页、标签页、站点地图（sitemap）与搜索索引复用的结构化实体。

为同类公司新增档案的实操指引

若你想为一家与 Manifold 类似的远程友好型科技公司补充档案，可参照 CONTRIBUTING.md 与 src/pages/contributing.md 中的规范：

在src/companies/下新建{slug}.md，确保文件名与 frontmatter 的slug一致；
填写 frontmatter 模板（title、slug、website、careers_url、region、remote_policy、company_size、technologies）；
正文必须包含三个必需小节：## Company blurb、## Remote status、## How to apply；## Company size、## Region、## Company technologies、## Office locations为常用可选小节（Manifold 档案全部包含，是很好的完整范例）；
运行npm run build验证构建通过（需 Node.js 22+，详见 README.md）；
提交 PR，由 GitHub Action 的校验机器人检查字段合法性与内容完整性。

同时注意目录的收录边界：只收录半远程到全远程的科技公司、直接雇佣员工、提供真正的远程职位（薪资制或时薪制，不含纯佣金销售岗），且careers_url必须指向公司自身的招聘页面。

小结

Manifold 档案是理解 Remote In Tech 目录数据模型的最佳样本之一：frontmatter 提供机器可读的分类维度（地区、远程政策、规模、技术栈），正文小节提供求职者关心的人文信息（团队规模、远程程度、时区、办公室、应聘方式），而 company.njk 模板与 collections.js 集合逻辑把二者无缝衔接成可浏览、可筛选、可检索的页面。对照src/companies/manifold.md逐字段阅读，即可举一反三地掌握整个目录的档案规范。