diff --git a/apps/web/src/components/interviews/questions/common/QuestionsTypes.ts b/apps/web/src/components/interviews/questions/common/QuestionsTypes.ts index 3caceee2b..7a186fdbc 100644 --- a/apps/web/src/components/interviews/questions/common/QuestionsTypes.ts +++ b/apps/web/src/components/interviews/questions/common/QuestionsTypes.ts @@ -17,7 +17,6 @@ export type QuestionCompany = | 'linkedin' | 'lyft' | 'microsoft' - | 'openai' | 'palantir' | 'salesforce' | 'snap' diff --git a/apps/web/src/components/interviews/questions/listings/filters/hooks/useQuestionCompanyFilter.tsx b/apps/web/src/components/interviews/questions/listings/filters/hooks/useQuestionCompanyFilter.tsx index ccade99e6..571ad02bf 100644 --- a/apps/web/src/components/interviews/questions/listings/filters/hooks/useQuestionCompanyFilter.tsx +++ b/apps/web/src/components/interviews/questions/listings/filters/hooks/useQuestionCompanyFilter.tsx @@ -15,7 +15,6 @@ const COMPANY_OPTIONS: ReadonlyArray = [ 'apple', 'bytedance', 'microsoft', - 'openai', 'tiktok', 'uber', 'linkedin', diff --git a/apps/web/src/content/interviews/study-list/company/openai/en-US.langnostic.json b/apps/web/src/content/interviews/study-list/company/openai/en-US.langnostic.json deleted file mode 100644 index c9c75d530..000000000 --- a/apps/web/src/content/interviews/study-list/company/openai/en-US.langnostic.json +++ /dev/null @@ -1,50 +0,0 @@ -{ - "frontmatter": { - "name": "f1e6eb12", - "longName": "94bafea2", - "description": "94bafea2", - "shortDescription": "21b08c0c", - "seoTitle": "ae7fddfe", - "seoDescription": "44fbb573", - "socialTitle": "895674e2" - }, - "content": { - "source": { - "locale": "en-US", - "hashes": [ - "906d9cb4", - "576bc86f", - "825b0ec0", - "9332eac7", - "585f525c", - "294c1f9e", - "af2ee3a2", - "152868aa", - "fe3edffd", - "ddcf8516", - "16ced5e9", - "af938bdf", - "8580da9a", - "f4ab7aa" - ] - }, - "targets": { - "zh-CN": [ - "906d9cb4", - "576bc86f", - "825b0ec0", - "9332eac7", - "585f525c", - "294c1f9e", - "af2ee3a2", - "152868aa", - "fe3edffd", - "ddcf8516", - "16ced5e9", - "af938bdf", - "8580da9a", - "f4ab7aa" - ] - } - } -} diff --git a/apps/web/src/content/interviews/study-list/company/openai/en-US.mdx b/apps/web/src/content/interviews/study-list/company/openai/en-US.mdx deleted file mode 100644 index 28bba2a34..000000000 --- a/apps/web/src/content/interviews/study-list/company/openai/en-US.mdx +++ /dev/null @@ -1,63 +0,0 @@ ---- -name: OpenAI -logoUrl: /img/company-logos/openai-logomark.svg -access: premium -longName: OpenAI Front End Interview Guide -description: OpenAI Front End Interview Guide -shortDescription: The one-stop to prepare well for your OpenAI front end interviews -seoTitle: OpenAI Front End Interview Guide - Prep Strategies and Practice Questions -seoDescription: The one-stop to prepare well for your OpenAI front end interviews. Discover insider tips, optimal prep strategies, and practice questions known to be tested. -socialTitle: OpenAI Front End Interview Guide | GreatFrontEnd -ranking: 5 ---- - -OpenAI's front end technical interviews tend to be more practical and relevant to company's product offerings. It is not necessary to grind traditional algorithms questions. - -### Interview process - -The interview process can be split into two parts, the technical screen and the onsite/full loop. Front end engineer candidates can expect to have both coding and system design round within the screening stage. - -#### Coding rounds - -The coding questions tend to be practical and related to OpenAI's product offerings; it will not be hardcore LeetCode-style algorithm questions. CoderPad is used for the coding interviews. - -- **Practical question on building a user interface**: Build a small section of an existing OpenAI product using a JavaScript framework of your choice (e.g. streaming chat messages). Candidates may be given a UI mockup, some starter code, and can see a live preview of the UI they are building -- **Code refactoring exercise**: Given some code, refactor and improve the quality. Study SOLID and clean code principles, e.g. single source of truth, remove duplicate state, remove state that can be computed, etc. - -#### System design rounds - -OpenAI's system design interviews questions are also related to OpenAI's product offerings. However, candidates should present a holistic full stack design instead of only focusing on the front end. The discussion will be carried out over [Excalidraw](https://excalidraw.com/). - -Imagine you're an OpenAI engineer and have to build an MVP in 2 weeks, what components would the product/system need? First present a full stack architecture, then dive deep into the front end. Some points and questions to consider: - -- **Product**: Consider what you'd expect in an AI product. Non-exhaustive list of possible products – streaming chat interfaces, inline editing (ChatGPT canvas), voice input, browser agents (ChatGPT operator) -- **Full stack design**: Design a full stack architecture for the product. You do not need to know the intricate technical details of the back end components, but you should be aware of basic distributed system components (e.g. servers, databases, CDNs, caches, message queues), what they do, and when to use them -- **AI models**: For the most parts, AI models can be treated as a black box. However, you should be aware of the features, limitations, common parameters, of AI models. Having basic prompt engineering knowledge would also be useful -- **Network communication**: How clients and servers should communicate – Long polling, WebSockets, Server-side streaming, WebTRC. Which protocols or approaches to use for certain features -- **API design**: Design the back end APIs needed by the product – the routes, the parameters, the responses. Decide between API approaches – RESTful vs GraphQL -- **Front end client design**: Various rendering approaches: SSR vs CSR vs SSG, etc., state management and design, networking, performance, accessibility, user experience, etc. Refer to [GreatFrontEnd's Front End System Design Playbook](/front-end-system-design-playbook) -- **Best practices**: Developing AI apps involve some best practices that aren't commonly see in typical apps such as prompt engineering, dealing with request latency, optimizing for accuracy, etc. OpenAI has published a set of [Best Practices](https://platform.openai.com/docs/guides/prompt-engineering) -- **User experience**: Beyond the usual established user experience practices, AI products have certain characteristics that require special attention when related to user experience. Check out Tiger Abrodi's article on [Principles for building great AI interfaces](https://tigerabrodi.blog/principles-for-building-great-ai-interfaces) - -### Recommended preparation strategy - -1. **OpenAI products**: Firstly, be familiar with the various product offerings by OpenAI - - [ChatGPT](https://chatgpt.com): Streaming AI chat interface with rich results, voice input, image generation. Read GreatFrontEnd's [Chat App](/questions/system-design/chat-application-messenger) system design solution - - [Search](https://openai.com/index/introducing-chatgpt-search/): Use ChatGPT to get fast, timely answers with links to relevant web sources, similar to Perplexity - - [Canvas](https://openai.com/index/introducing-canvas/): An alternative interface of working with ChatGPT to write and code, optimized for editing and revising content. Read GreatFrontEnd's [Rich Text Editor](/questions/system-design/rich-text-editor) and [Google Docs](/questions/system-design/collaborative-editor-google-docs) system design solutions - - [Operator](https://openai.com/index/introducing-operator/): Agent that can use its own browser to perform tasks for you - - [Deep Research](https://openai.com/index/introducing-deep-research/): Agent that uses reasoning to synthesize large amounts of online information and complete multi-step research tasks for you - - [OpenAI Playground](https://platform.openai.com/playground/): Interactive web-based tool that allows users to experiment with and test OpenAI’s language models by inputting prompts and receiving AI-generated responses in real-time - - [Sora](https://sora.com/): Tool to generate videos from prompts using OpenAI's Sora model -2. **Research**: Consider how you would build OpenAI's products - 1. Try out [OpenAI's developer APIs](https://platform.openai.com/). Understand the capabilities, parameters, responses. Experiment with the APIs in the [developer playground](https://platform.openai.com/playground/) - 2. Look up open source examples of the products on GitHub and study the code - 3. Analyze the technical and UX decisions made -3. **Practice**: Practice interview questions on GreatFrontEnd - - **Fundamentals**: Strengthen your front end fundamentals through [GreatFrontEnd's quiz questions](/questions/quiz) - - **Technical coding**: Build up your confidence in coding UI interfaces through [GreatFrontEnd's user interface coding questions](/questions/formats/ui-coding). Focus on form interfaces, state management, and data fetching - - **System design**: Study [GreatFrontEnd's system design questions](/questions/system-design). Many existing solutions cover design patterns and technical topics that would be useful for building complex front end interfaces found in AI apps - -### Official guides - -Refer to [OpenAI's official interview guide](https://openai.com/interview-guide/). diff --git a/apps/web/src/content/interviews/study-list/company/openai/zh-CN.mdx b/apps/web/src/content/interviews/study-list/company/openai/zh-CN.mdx deleted file mode 100644 index 182ee933a..000000000 --- a/apps/web/src/content/interviews/study-list/company/openai/zh-CN.mdx +++ /dev/null @@ -1,63 +0,0 @@ ---- -name: OpenAI -logoUrl: /img/company-logos/openai-logomark.svg -access: premium -longName: OpenAI 前端面试指南 -description: OpenAI 前端面试指南 -shortDescription: 为 OpenAI 前端面试做好充分准备的一站式指南 -seoTitle: OpenAI 前端面试指南 - 准备策略和实践问题 -seoDescription: 为 OpenAI 前端面试做好充分准备的一站式指南。 发现内幕技巧、最佳准备策略和已知会被测试的实践问题。 -socialTitle: OpenAI 前端面试指南 | GreatFrontEnd -ranking: 5 ---- - -OpenAI 的前端技术面试往往更注重实践，与公司的产品更相关。 没有必要死记硬背传统的算法题。 - -### 面试流程 - -面试流程可以分为两个部分：技术筛选和现场/全流程。 前端工程师候选人预计在筛选阶段同时进行编码和系统设计环节。 - -#### 编码环节 - -编码问题往往是实践性的，与 OpenAI 的产品相关； 它不会是硬核的 LeetCode 风格的算法题。 CoderPad 用于编码面试。 - -* **构建用户界面的实践问题**：使用您选择的 JavaScript 框架（例如流式聊天消息）构建现有 OpenAI 产品的一小部分。 候选人可能会获得 UI 模型、一些入门代码，并且可以看到他们正在构建的 UI 的实时预览 -* **代码重构练习**：给定一些代码，重构并提高质量。 学习 SOLID 和干净的代码原则，例如单一事实来源、删除重复状态、删除可以计算的状态等。 - -#### 系统设计环节 - -OpenAI 的系统设计面试问题也与 OpenAI 的产品相关。 但是，候选人应该展示一个整体的全栈设计，而不是只关注前端。 讨论将在 [Excalidraw](https://excalidraw.com/) 上进行。 - -假设您是一名 OpenAI 工程师，必须在 2 周内构建一个 MVP，该产品/系统需要哪些组件？ 首先呈现一个全栈架构，然后深入研究前端。 一些需要考虑的要点和问题： - -* **产品**：考虑您对 AI 产品的期望。 可能产品的非详尽列表 – 流式聊天界面、内联编辑（ChatGPT 画布）、语音输入、浏览器代理（ChatGPT 运营商） -* **全栈设计**：为产品设计一个全栈架构。 您不需要了解后端组件的复杂技术细节，但您应该了解基本的分布式系统组件（例如服务器、数据库、CDN、缓存、消息队列）及其作用以及何时使用它们 -* **AI 模型**：在大多数情况下，AI 模型可以被视为一个黑盒。 但是，您应该了解 AI 模型的功能、局限性和常见参数。 具备基本的提示工程知识也很有用 -* **网络通信**：客户端和服务器应该如何通信 – 长轮询、WebSockets、服务器端流、WebTRC。 对某些功能使用哪些协议或方法 -* **API 设计**：设计产品所需的后端 API – 路由、参数、响应。 在 API 方法之间进行选择 – RESTful 与 GraphQL -* **前端客户端设计**：各种渲染方法：SSR vs CSR vs SSG 等、状态管理和设计、网络、性能、可访问性、用户体验等。 参考 [GreatFrontEnd 的前端系统设计手册](/front-end-system-design-playbook) -* **最佳实践**：开发 AI 应用程序涉及一些在典型应用程序中不常见的最佳实践，例如提示工程、处理请求延迟、优化准确性等。 OpenAI 已经发布了一组 [最佳实践](https://platform.openai.com/docs/guides/prompt-engineering) -* **用户体验**：除了通常已建立的用户体验实践之外，AI 产品具有某些特性，在与用户体验相关时需要特别注意。 查看 Tiger Abrodi 关于 [构建出色 AI 界面原则](https://tigerabrodi.blog/principles-for-building-great-ai-interfaces) 的文章 - -### 推荐的准备策略 - -1. **OpenAI 产品**：首先，熟悉 OpenAI 的各种产品 - * [ChatGPT](https://chatgpt.com)：具有丰富结果、语音输入、图像生成的流式 AI 聊天界面。 阅读 GreatFrontEnd 的 [聊天应用程序](/questions/system-design/chat-application-messenger) 系统设计解决方案 - * [搜索](https://openai.com/index/introducing-chatgpt-search/)：使用 ChatGPT 获取快速、及时的答案以及指向相关网络资源的链接，类似于 Perplexity - * [画布](https://openai.com/index/introducing-canvas/)：使用 ChatGPT 编写和编码的替代界面，针对编辑和修改内容进行了优化。 阅读 GreatFrontEnd 的 [富文本编辑器](/questions/system-design/rich-text-editor) 和 [Google Docs](/questions/system-design/collaborative-editor-google-docs) 系统设计解决方案 - * [Operator](https://openai.com/index/introducing-operator/)：可以使用自己的浏览器为您执行任务的代理 - * [深度研究](https://openai.com/index/introducing-deep-research/)：使用推理来综合大量在线信息并为您完成多步研究任务的代理 - * [OpenAI Playground](https://platform.openai.com/playground/)：交互式基于网络的工具，允许用户通过输入提示并实时接收 AI 生成的响应来试验和测试 OpenAI 的语言模型 - * [Sora](https://sora.com/)：使用 OpenAI 的 Sora 模型从提示生成视频的工具 -2. **研究**：考虑如何构建 OpenAI 的产品 - 1. 试用 [OpenAI 的开发者 API](https://platform.openai.com/)。 了解功能、参数、响应。 在 [开发者游乐场](https://platform.openai.com/playground/) 中试验 API - 2. 查找 GitHub 上产品的开源示例并研究代码 - 3. 分析所做的技术和 UX 决策 -3. **实践**：在 GreatFrontEnd 上练习面试问题 - * **基础知识**：通过 [GreatFrontEnd 的测验问题](/questions/quiz) 加强您的前端基础知识 - * **技术编码**：通过 [GreatFrontEnd 的用户界面编码问题](/questions/formats/ui-coding) 建立您在编码 UI 界面方面的信心。 专注于表单界面、状态管理和数据获取 - * **系统设计**：研究 [GreatFrontEnd 的系统设计问题](/questions/system-design)。 许多现有的解决方案涵盖了设计模式和技术主题，这些主题对于构建 AI 应用程序中复杂的前端界面很有用 - -### 官方指南 - -参考 [OpenAI 的官方面试指南](https://openai.com/interview-guide/)。 diff --git a/apps/web/src/db/QuestionsUtils.ts b/apps/web/src/db/QuestionsUtils.ts index 43b32bc08..3b346f762 100644 --- a/apps/web/src/db/QuestionsUtils.ts +++ b/apps/web/src/db/QuestionsUtils.ts @@ -453,7 +453,6 @@ export function categorizeQuestionsByCompany( linkedin: [], lyft: [], microsoft: [], - openai: [], palantir: [], salesforce: [], snap: [], diff --git a/apps/web/src/hooks/useCompanyNames.ts b/apps/web/src/hooks/useCompanyNames.ts index 0170a7d0a..d5c604894 100644 --- a/apps/web/src/hooks/useCompanyNames.ts +++ b/apps/web/src/hooks/useCompanyNames.ts @@ -15,7 +15,6 @@ import { FaYelp, } from 'react-icons/fa'; import { FaAtlassian, FaTiktok } from 'react-icons/fa6'; -import { RiOpenaiLine } from 'react-icons/ri'; import { SiBytedance, SiPalantir, SiToptal } from 'react-icons/si'; import { TbBrandWalmart } from 'react-icons/tb'; @@ -112,14 +111,6 @@ export default function useCompanyNames(): Record< }), logo: FaMicrosoft, }, - openai: { - label: intl.formatMessage({ - defaultMessage: 'OpenAI', - description: 'Company name for OpenAI', - id: 'syNZit', - }), - logo: RiOpenaiLine, - }, palantir: { label: intl.formatMessage({ defaultMessage: 'Palantir',