This design was created for educational purposes only and is not affiliated with Netlify. All rights belong to the original owner.
Push your ideas to the web
Build with AI or code, deploy instantly. One platform with everything you need to make real apps live.
Everything you need to ship. Nothing you don't.
From vibe coding your first app to seving millions of users, Netlify handles the infrastructure so you can focus on building. No devOps required. No complex setup. No surprise bills when you scale.
Ship instantly
Get your app live. Deploy from Bolt, Cursor, Github, or anywhere you build. Every change gets a shareable preview link.
- Deploy from anywhere
- Instant preview links
- Update code with Agent Runners
Build anything
Everything your app needs in one place. Create APIs, save images, store data without juggling a ton of services.
- Marketing sites to AI apps
- Forms, functions, and APIs ready
- Database and image storage built-in
Grows with you
From first user to first million, without worry. Your app handles viral moments automatically. No crashes, no replatforming, just growth
- Free tier that actually works
- Managed security
- Automatic scaling
Ready to use building blocks.
Build APIs, store files, manage data, control performance. No backend setup required—just build and deploy.
Power AI apps with AI Gateway
Call OpenAI, Anthropic, or Gemini directly from your code without juggling keys or accounts. Every request is routed through one gateway, with usage tracking and safeguards included.
- Use AI without managing API keys
- Switch between 30+ models
- Monitor usage and costs in one place
import OpenAI from "openai";
export default async (req: Request) => {
if (req.method !== "POST") {
return new Response("Method not allowed", { status: 405 });
}
try {
const { description } = await req.json();
if (!description) {
return new Response("Missing description", { status: 400 });
}
const client = new OpenAI();
const res = await client.responses.create({
model: "gpt-5-mini",
input: [
{ role: "user", content: `Write concise alt text for: ${description}` },
],
});
return Response.json({ altText: res.output_text });
} catch {
return new Response("Server error", { status: 500 });
}
};
export const config = {
path: "/api/alt-text",
};
Build scalable, fullstack apps with Netlify Functions
Deploy server-side code that works as API endpoints, runs automatically in response to events, or processes more complex jops in the background.
- Send automated email
- Fetch live data from an API
- Return dynamic images
- Validate user input
import type { Context, Config } from "@netlify/functions";
export default async (req: Request, context: Context) => {
if (req.method !== "POST") return new Response("Method not allowed", { status: 405 });
try {
const { name, email, message } = await req.json();
if (!name || !email || !message) return new Response("Missing fields", { status: 400 });
// Mock email API
await fetch("https://api.emailservice.com/send", {
method: "POST",
headers: { "Authorization": `Bearer ${Netlify.env.get("EMAIL_API_KEY")}`, "Content-Type": "application/json" },
body: JSON.stringify({ to: "test@example.com", subject: `Hello world`, text: `Hello ${name}` })
});
return Response.json({ success: true });
} catch {
return new Response("Server error", { status: 500 });
}
};
Agent-friendly storage for full-stack apps
Instantly provision a production-grade database with Netlify DB or use Blobs as a simple key/value store or lightweight database.
- Store and retrieve blobs and unstructured data for frequent reads and infrequent writes
- Use serverless databases to create full-stack apps
- Set up in minutes with the help of a code agent
import { getStore } from "@netlify/blobs";
import type { Context } from "@netlify/functions";
import { v4 as uuid } from "uuid";
export default async (req: Request, context: Context) => {
// Accessing the request as `multipart/form-data`.
const form = await req.formData();
const file = form.get("file") as File;
// Generating a unique key for the entry.
const key = uuid();
const uploads = getStore("file-uploads");
await uploads.set(key, file, {
metadata: { country: context.geo.country.name }
});
return new Response("Submission saved");
};
Better image performance with the Netlify Image CDN
- Transform images on demand without impacting build times
- Optimize the size and format of your images
- Improve both the runtime performance and reliability of your site
<!-- Resize an image to 200x200 pixels -->
<img src="/.netlify/images?url=/photo.jpg&w=200&h=200"
alt="Resized and cached image">
Get information from your users with Netlify Forms
- Automatic form detection with one HTML attribute
- Allows you to create forms in Netlify without extra API calls or additional JavaScript
- Uses HTML forms, a trusted web standard
<form name="contact" method="POST" data-netlify="true">
<p>
<label>Your name: <input type="text" name="name" /></label>
</p>
<p>
<label>Your email: <input type="email" name="email" /></label>
</p>
<p>
<label>Your job title: <input type="text" name="title" /></label>
</p>
<p>
<label>Message: <textarea name="message"></textarea></label>
</p>
<p>
<button type="submit">Send</button>
</p>
</form>
Start building on Netlify
Join millions of developers and teams bringing their ideas online.