What is a Large Language Model (LLM)?

A Large Language Model (LLM) is a type of AI system that can generate human-like text. It does this by learning from large datasets (e.g. books, articles, websites, etc.) and using that knowledge to predict the next word in a sequence.

LLMs are now used across a wide range of applications and tasks, like support chatbots, copywriting, translation, summarization, search, and code generation. As an engineer, understanding how LLMs work can help you integrate AI features into your web applications and speed up your development workflow.

Copy link to headingHow do LLMs work?

LLMs are built on a type of neural network called a transformer, which is especially good at understanding context.

While LLMs are complex systems with different implementations, they follow a general process:

Copy link to headingTraining

Before training, text is broken down into tokens, that is, small units like words or subwords (e.g. Hello World! → ["Hello", "World", "!"]). These are then embedded (converted into vectors) so the model can process them.

The model processes hundreds of billions of these tokens, learning to predict the next one in each sequence. Over time, it adjusts its internal parameters (called "weights") to improve these predictions.

Copy link to headingInference

Once trained, you give it a prompt (a natural language input), and it predicts the most likely sequence of tokens based on what it has learned. Try it out:

What is a Large Language Model?

• What happens when you prompt an LLM?

Copy link to headingFine-tuning

Some models are further fine-tuned on domain-specific data to improve quality of responses for particular use cases.

For example, v0 is trained on frontend libraries and documentation to help it generate accurate UI code from natural language prompts like "add a pricing section" or "create a login form". Try it out:

Create a responsive product card with image, title, price, and "Add to Cart" button.

Copy link to headingReinforcement Learning from Human Feedback (RLHF)

After training, some models are further refined using human feedback. Humans rank model outputs, and those preferences are used to adjust the model's responses to be more helpful.

Copy link to headingWhat happens when you prompt a model?

When you send a prompt to an LLM:

Copy link to headingTokenization

Your prompt is tokenized into smaller units.

Copy link to headingVector embedding

Each token is embedded as a high-dimensional vector.

Copy link to headingAttention and feedforward

These vectors pass through multiple transformer layers, which apply attention to weigh the importance of each token in context.

Copy link to headingPrediction

The model predicts the next token in the sequence, repeating the whole process for each token until a complete response is generated.

Copy link to headingDecoding

The final response is then decoded back into human-readable text.

LLMs don't retrieve answers, they generate them using context and probability. That's what makes them flexible and powerful.

Copy link to headingHow can you use LLMs?

LLMs can support your development workflow in a number of ways. Here are some common use cases:

Copy link to headingBuilding AI features

LLMs can be integrated into your own applications to build AI features. Most models are available via API, allowing you to query them just as you would a backend service. For example:

Create a support assistant using the Vercel AI SDK and the OpenAI Model.

Copy link to headingCode and UI generation

You can use LLMs to generate code and UI from natural language, reducing the time spent on routine tasks. For example:

Boilerplate: Reduce time spent setting up new projects and configuring tooling.

Create a starter Next.js App with Drizzle ORM and TailwindCSS.

Prototype: Create POCs to validate ideas before building.

Create a responsive pricing section with three tiers and a call-to-action button.

Logic: Generate code to solve specific problems.

Write a debounce function in TypeScript and React.

LLMs reduce the "grunt work", allowing engineers to spend more time focusing on higher-level coding tasks while becoming the curators of quality.

Copy link to headingPair programming and debugging

LLMs can help diagnose errors, explain stack traces, and suggest potential fixes based on context. They're useful for narrowing down causes of bugs. For example:

What does this Next.js error mean? `TypeError: res.json is not a function`

Review code and recommend fixes:

// This is returning undefined, why?
export default function Form() {
  const handleSubmit = (e) => {
    e.preventDefault();
    const name = e.target.name.value;
    console.log(name);
  };

  return (
    <form onSubmit={handleSubmit}>
      <input type="text" />
      <button type="submit">Submit</button>
    </form>
  );
}

You can also use LLMs within your code editor to act as your "pair programmer". Popular AI-powered IDEs include Cursor, GitHub Copilot in VSCode, and more.

Copy link to headingLearning

LLMs can explain unfamiliar concepts, summarize documentation, or answer questions about tools and frameworks. This makes them useful for onboarding or exploring new APIs. For example:

Explaining concepts:

I'm writing an article on how LLMs work for web developers, could you explain what tokenization is?

Learning new tools:

How do I get started with the Vercel AI SDK?

Copy link to headingPopular LLMs

Here are a few widely used LLMs:

• ChatGPT (OpenAI)
• Claude (Anthropic)
• Gemini (Google)

Copy link to headingNext Steps

Start building AI features by integrating LLMs into your application:

• How to build AI apps: an overview