从 axios.md 看 Remote In Tech 公司档案的结构规范与渲染机制

发布时间:2026/9/30 7:08:48
从 axios.md 看 Remote In Tech 公司档案的结构规范与渲染机制 数据集【免费下载链接】remote-jobsSource for remoteintech.company — a community-maintained directory of remote-friendly tech companies项目地址https://gitcode.com/GitHub_Trending/re/remote-jobs点击查看免费下载Remote In Techremoteintech.company 这份真实档案为完整样例拆解其 frontmatter 字段、正文章节、标签枚举、校验规则以及从 Markdown 到页面的渲染链路帮助你掌握该目录的标准档案格式并理解这类数据驱动站点的底层机制。档案文件概览一个完整的公司档案长什么样在仓库中每一家公司对应src/companies/下的一个 Markdown 文件文件名必须与 frontmatter 中的slug一致如slug: axios对应src/companies/axios.md。文件由两部分组成YAML frontmatter结构化元数据被 Eleventy 解析为页面数据Markdown 正文以##开头的固定章节描述公司的具体信息。axios.md 的 frontmatter 完整展示了所有核心字段--- title: Axios slug: axios website: https://axios.com/ careers_url: https://www.axios.com/careers/ region: americas remote_policy: remote-friendly company_size: medium technologies: - javascript - php - ruby addedAt: 2021-10-30 updatedAt: 2022-10-10 ---其中addedAt与updatedAt两个日期字段由维护者管理社区贡献者在提交 PR 时不应自行填写见 CONTRIBUTING.md 中的说明。frontmatter 字段详解每个字段的值域与含义所有字段的合法取值都定义在 src/_data/labels.js 中该文件是单一事实来源既被前端模板消费也被 CI 校验脚本引用。字段含义允许值来自 labels.js / CONTRIBUTING.mdtitle公司显示名称任意字符串如 AxiosslugURL 标识必须与文件名一致如axioswebsite公司官网必须是完整 URLhttp/https如https://axios.com/careers_url招聘页面 URL指向公司自己的招聘页如https://www.axios.com/careers/region招聘覆盖区域worldwide、americas、europe、americas-europe、asia-pacific、otherremote_policy远程办公政策fully-remote、remote-first、hybrid、remote-friendlycompany_size公司规模档位tiny(1-10)、small(11-50)、medium(51-200)、large(201-1000)、enterprise(1000)technologies技术栈标签数组javascript、typescript、react、python、ruby、go、php、java、rust、devops、cloud、docker、kubernetes、mobile、data、ml等 25 个枚举值以 Axios 为例region: americas表示招聘覆盖美洲remote_policy: remote-friendly属于四档政策中的远程友好档并非完全远程company_size: medium对应 51-200 人规模与正文中 110-250 employees 的描述相印证。technologies 中登记的javascript、php、ruby也与正文 ## Company technologies 列出的技能清单Drupal、WordPress、PHP、Git、HTML、CSS、JavaScript、Ruby保持一致。careers_url与website的区别在页面渲染时很关键布局模板 src/_layouts/company.njk 会优先取careers_url作为主按钮链接并显示 Apply Now否则退回website并显示 Visit Website。正文章节规范必选与可选章节CONTRIBUTING.md 明确规定每个档案必须包含三个##章节axios.md 均一一满足## Company blurb必选一段简短的公司介绍。Axios 的描述为a news and technology company that covers the topics and trends that matter through newsletters, a news stream, a mobile app, podcasts and our HBO show并点出其核心理念Smart Brevity简明扼要地做新闻。## Remote status必选说明公司的远程工作方式。Axios 写道团队遍布全球、采用敏捷交付流程并回馈多个开源社区、拥有创新孵化文化。## How to apply必选提供申请入口Axios 指向其 Careers 页面。以下为可选但常用的章节## Company size公司规模描述Axios 填写为 110-250 employees与company_size: medium标签相互补充。## Region地域说明Axios 注明美国团队成员在家、咖啡馆或共享办公空间工作。## Company technologies技术栈清单以*无序列表呈现。## Office locations办公地点列表Axios 为 Arlington, VA。从 Markdown 到页面渲染链路与自动摘要公司档案的渲染链路依赖三层机制1. 布局指定src/companies/companies.json 为整个companies目录统一声明layout: company使所有公司档案自动套用 src/_layouts/company.njk 布局。该布局输出 Organization 结构化数据 schema并将 frontmatter 中的region、remote_policy渲染为可点击的浏览标签把technologies渲染为独立的 Tech Stack 小节每个技术标签同样链接到/browse/{tech}/浏览页。2. 自动 meta 描述src/companies/companies.11tydata.js 通过eleventyComputed自动为每家公司生成 meta description优先从正文中提取## Company blurb章节的内容清洗掉 Markdown 语法链接、星号、下划线、反引号压缩换行与空白再按句子边界截断到约 155 字符——这正是搜索引擎展示摘要的常见长度。如果 blurb 缺失则回退取 frontmatter 之后的首个段落。3. 日期格式化src/_config/filters/dates.js 提供formatDate过滤器布局中用它将updatedAt渲染为 Last updated: October 10, 2022 这样的易读格式。分类与浏览档案如何进入目录集合src/_config/collections.js 以getFilteredByGlob(./src/companies/**/*.md)一次性加载全部公司档案结果被 memoized避免对约 850 个文件重复过滤并据此派生出多种浏览维度getAllCompanies按title字母序排序供所有公司列表页使用getCompaniesByRegion/getCompaniesByTech按region与technologies分组Axios 因此会出现在美洲公司、以及 JavaScript / PHP / Ruby 技术标签下getRecentCompanies按 frontmatter 的addedAt倒序取最近 12 家getFeaturedCompanies从 src/_data/companyHelpers.js 中手工精选的featuredCompanySlugs如 automattic、stripe、netlify、github、linear 等中随机抽取 8 家展示在首页getCompanyTags从所有档案聚合出 technology / region / remote-policy 三类标签并附带标签名与公司数量。在前端浏览页 src/pages/companies.njk 上所有公司卡片通过 Pagefind 实现全文搜索并支持按 Region 下拉过滤同时会解析 URL 参数?regionamericas在初始加载时直接应用过滤条件。质量保障CI 校验脚本如何检查档案仓库内置了独立的校验程序 .github/scripts/validate-companies.js由 .github/workflows/validate-companies.yml 在 PR 时自动触发。它对每个src/companies/*.md文件执行以下检查必填字段title、slug、website、region、remote_policy、company_size缺失即报错枚举合法性region、remote_policy、company_size、technologies的值必须落在 labels.js 定义的合法集合内——由于校验脚本直接 import 同一份 labels.js新增标签时一处修改即可同时更新站点渲染与 CI 校验slug 与文件名一致性data.slug必须等于文件基名URL 格式website与careers_url必须是 http/https 完整 URL用new URL()解析校验必选章节正文必须存在## Company blurb、## Remote status、## How to apply三个标题正则按行匹配标题文本已做正则转义blurb 非空警告## Company blurb下无内容时给出 warning 而非 error。校验结果以 JSON 输出任何 error 或存在旧格式文件都会导致进程以退出码 1 失败从而阻断合并。本地构建与贡献流程按照 README.md 的说明开发与构建命令如下要求 Node.js 22npm install # 安装依赖 npm run start # 本地开发服务器支持热更新 npm run build # 生产构建新增一家公司的标准流程详见 CONTRIBUTING.md创建src/companies/{slug}.mdslug必须与文件名一致按上述模板填写 frontmatter并补全三个必选章节运行npm run build确认构建通过提交 PR由校验机器人自动检查并在有问题时于评论区指出。值得一提的是src/_layouts/company.njk 页脚还内置了指向公司档案源码的 Edit on GitHub 按钮方便贡献者直接跳转到对应文件发起修改形成了浏览页面 → 定位数据文件 → 提交改进的完整闭环。结语以 axios.md 为窗口可以看到 Remote In Tech 通过frontmatter 数据 固定正文章节 集中式标签定义 CI 校验四层机制把数百家公司的维护成本降到了极低数据结构清晰、枚举统一、校验自动、渲染解耦。这种内容即数据、数据即内容的静态目录架构对任何想构建社区维护型数据站点的开发者都具有直接的参考价值——一份 axios.md 式的档案就是整个系统的最小可运行单元。赞分享数据集【免费下载链接】remote-jobsSource for remoteintech.company — a community-maintained directory of remote-friendly tech companies项目地址https://gitcode.com/GitHub_Trending/re/remote-jobs点击查看免费下载相关推荐解读 Alight Solutions 公司档案Remote In Tech 远程友好企业目录的数据结构与渲染机制解读 Alight Solutions 公司档案Remote In Tech 远程友好企业目录的数据结构与渲染机制 Remote In Tech仓库对应项目数据集Remote In Tech 公司档案编写实战以 Adaface 档案为样本解析 frontmatter 规范、校验规则与渲染链路Remote In Tech 公司档案编写实战以 Adaface 档案为样本解析 frontmatter 规范、校验规则与渲染链路 本文以仓库中 src/co数据集深度解读 BetaPeak 公司档案Remote In Tech 远程公司目录条目的字段结构、渲染流程与源码实现深度解读 BetaPeak 公司档案Remote In Tech 远程公司目录条目的字段结构、渲染流程与源码实现 本文以 Remote In Tech htt数据集上一篇QMK 固件实战为 Bolsa Supply Damapad 宏键盘构建、烧录与定制固件下一篇Grafana Tempo vParquet3 块格式设计解析用可配置的专用属性列加速 TraceQL 搜索创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考