Frontend Beauty
ESC

Type to search the knowledge base.

AI Engineering Learning Path

An AI engineering roadmap for frontend engineers: LLM APIs, RAG, agents, evals, then production. Checkpoints you can build, not course trophies.

beginner6 min read
  • roadmap
  • learning-path
  • career

Collecting 14 certificates is not a path. Shipping a cited chatbot with an eval set is. This AI engineering roadmap assumes you already ship TypeScript. You do not need a year of Coursera before your first fetch to a model. You need a sequence, a checkpoint you can demo, and the honesty to skip multi-agent theatre until a single tool loop is boring.

The ordered checklist of every guide lives on the AI engineering roadmap page. Use that as the syllabus index. Use this page as the why, the time, and the stall to avoid at each stage.

Key takeaways

  • Product loops first: generate, retrieve, tool loop, eval. Training waits.
  • Each stage ends with a thing you can run, not a playlist you finished.
  • RAG before agents. Evals before you argue about prompts in Slack.
  • Fine-tuning and multi-agent crews are late, optional, and easy to hide behind.
  • Frontend instincts transfer: types, abort, XSS-shaped distrust, keys off the client.

Why this AI engineering roadmap is ordered this way

LLMs fail like flaky HTTP with a poetry habit. If you start in embeddings math, you will delay the moment you see a wrong citation. If you start in agents, you will debug a loop you cannot eval. If you start in fine-tuning, you will memorize your own bugs.

Approximate calendar if you already write React and route handlers:

Stage Hours, not days-in-a-course You are done when
0. Server call + stream 3-6 Stop button aborts, key is in env on the server
1. LLM literacy 8-12 You extract a typed object and fail closed
2. Prompts as code 8-12 Prompt has a version id in the trace
3. RAG 15-25 Citations resolve to real URLs, empty retrieval refuses
4. One agent 10-15 One side-effect tool waits for approval, max steps in code
5. Quality + safety ongoing ~30 golden cases in CI, a forbidden doc never packs
6. Production ongoing You can explain p95 TTFT and cost per successful answer

Those hours assume you read official docs, not that you watch a 40-hour bootcamp at 1.5x. Do you need ML first? if that question is blocking you. Short answer: no, not to start.

Stage 0: the call is just fetch

Build a Route Handler that reads process.env for the key, accepts { messages }, and streams tokens. Wire AbortController from the composer’s Stop button. If this step feels too small, good. Most “AI apps” skip it and leak a key or hang the UI.

export async function POST(req: Request) {
  const { messages } = await req.json();
  const upstream = await fetch('https://api.example.com/v1/chat/completions', {
    method: 'POST',
    headers: {
      Authorization: `Bearer ${process.env.MODEL_API_KEY}`,
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({ model: 'replace-me', messages, stream: true }),
    signal: req.signal,
  });
  if (!upstream.body) return new Response('no stream', { status: 502 });
  return new Response(upstream.body, {
    headers: { 'Content-Type': 'text/event-stream' },
  });
}

Stall: wrapping a client SDK in a 'use client' file because a tutorial did. Read client vs server LLM calls and secrets in frontend bundles before you write another line.

Stage 1: literacy, not transformer math

You need a working picture of what AI engineering is, tokens, chat roles, sampling, and structured outputs.

Checkpoint: messy user text in, Zod object out, parse failure is a 422, not a JSON.parse in a try/catch you ignore. Temperature is pinned low. You can explain, out loud, that temperature 0 is not a promise of determinism.

Stall: deriving attention in a notebook so you feel licensed to call fetch.

Stage 2: the prompt is a function spec

Prompt engineering here means inputs, constraints, output shape, version. Not “act as a senior.” Add streaming and a React chat UI so you feel TTFT instead of arguing about tokens per second.

Checkpoint: changing the prompt updates a version field in logs. Stop works. You do not send the entire 80-turn thread if a summary would do (conversation state).

Stage 3: retrieval, the first real product

This is the portfolio piece. Ingest this site’s MDX (or your own docs), embed, retrieve, stream an answer with citations. The walkthrough is building a docs RAG chatbot.

Read the RAG mental model, then chunking, hybrid search, and citations when the bot starts lying with footnotes. When RAG is the wrong tool is the page that saves you from embedding your SQL catalog.

Checkpoint: a question whose answer is on /learn/javascript/event-loop cites that URL. A question about a page you did not ingest refuses. You can rebuild the index from source files.

Stall: picking a vector database before you have 200 chunks and a labeled query set.

Stage 4: one loop, two tools

Agents start when the model can change something outside the string, inside a cap you own. Implement the loop, function calling, and human in the loop for the side effect.

Checkpoint: search_docs (read) and open_ticket (side effect). The second waits for approval. Max steps enforced in code, not in a please-stop sentence.

Stall: multi-agent crews, MCP everything, a run tool with a string argument.

Stage 5 and 6: prove it, then operate it

Quality is evals, a golden set you did not invent from memory, injection assumptions, and permission-aware retrieval. Production is tracing, cost, TTFT, retries.

Checkpoint: a prompt PR can fail CI. You can open a trace id from a bug report. You know whether you are on batch or realtime for embeddings (batch vs realtime).

What to skip (for now)

  • Training a base model
  • Fine-tuning before an eval the prompt cannot move
  • Multi-agent before a single tool loop is reliable
  • Buying a gateway before you have two routes and a 429

When you want interview reps, use AI engineering interview questions, then the RAG and agent system design sets. The full slug list and stage gates stay on the roadmap.

Interview answer (out loud)

“I would learn this as production software: a streaming server route, structured outputs, a cited RAG chatbot I can eval, then one tool loop with approval and max steps. I would not start with fine-tuning or multi-agent. The checkpoint is a golden set in CI and a trace I can read, not a certificate.”

Further reading (primary sources)

Related guides