Web 开发路线
Codex 很适合已有 design systems 的 web projects。它可以结合 constraints 和 visual inputs,生成 r
Codex 很适合已有 design systems 的 web projects。它可以结合 constraints 和 visual inputs,生成 responsive UI。
如果你正在构建 web apps,并需要持续迭代 frontend designs,这组 use cases 很有用。
配图:
- background:https://developers.openai.com/codex/use-cases/background-codex-collection3.png
- illustration:https://developers.openai.com/codex/use-cases/web-development-illustration.png
Build from Figma
用 Codex 从 Figma 拉取 design context,并转成符合 repo components、styling 和 design system 的 code。
- Turn Figma designs into code Use Codex to pull design context, assets, and variants from Figma, then translate them into code. Front-end · Design
Iterate on the UI
用 Codex 根据 visual inputs 或 prompts 做 targeted changes,并让它在 browser 中 verify work。
-
Build responsive front-end designs Use Codex to translate screenshots and design briefs into code that matches the repo's conventions. Front-end · Design
-
Make granular UI changes Use Codex to make one small UI adjustment at a time in an existing app, then verify it in the browser. Front-end · Design
Pick Up Scoped Slack Tasks
当 Slack 中出现 feature request 或 reported issue 时 tag Codex,让它在 background 中接手任务。
- Kick off coding tasks from Slack
Mention
@Codexin Slack to start a task tied to the right repo and environment. Integrations · Workflow
Deploy a Preview
让 Codex build 或 update web app,用 Vercel deploy,并返回可分享的 live URL。
- Deploy an app or website Use Codex with Build Web Apps and Vercel to turn a repo, screenshot, design, or rough app idea into a preview. Front-end · Integrations
Ship Changes Faster
在 GitHub 中使用 Codex,确认 changes 可以安全 merge,让 development loop 更快。
- Codex code review for GitHub pull requests Use Codex code review in GitHub to automatically surface regressions, missing tests, and high-priority issues. Integrations · Workflow