ai
Building Local AI Agents with Next.js 16, Ollama, and Vercel AI SDK
Learn how to build zero-latency, privacy-first local AI agents in Next.js 16 using Ollama, tool calling, and React Server Components.
v2026· Frontend Engineering Notes
Engineering patterns
for production
Practical guides on React architecture, TypeScript patterns, CSS layout, and the modern web platform — written by engineers who ship code.
React Server Component
▎- 10
- Technologies
- 77
- Tutorials
- 385+
- Code Examples
- 114+
- Hours Content
Learning paths
From HTML fundamentals to advanced React patterns — each path follows a progression that builds on itself.
HTML
Learn HTML5, semantic markup, accessibility standards, and modern HTML best practices.
Start learning
CSS
Learn CSS3, modern layouts with Flexbox and Grid, animations, responsive design, and advanced styling techniques.
Start learning
React
Master React hooks, components, state management, and build powerful, scalable web applications from fundamentals to advanced concepts.
Start learning
Next.js
Master the Next js App Router, Server Components, data fetching, and deployment to build fast, SEO-friendly production-ready applications.
Start learning
Angular
Learn Angular framework with TypeScript, components, services, dependency injection, and RxJS.
Start learning
Latest tutorials
Recent additions to the library
css
CSS Corner Properties: border-radius, corner-shape, and Superellipse
A practical guide to modern CSS corner styling using border-radius and corner-shape, including production patterns, caveats, and progressive enhancement.
css
CSS Anchor Positioning API: A Complete Guide
Master the CSS Anchor Positioning API to build context-aware UIs like tooltips and menus without JavaScript. A deep dive into modern declarative positioning.
react
Mastering React 19 Actions for Data Mutation
A comprehensive guide to React 19 Actions. Learn how to simplify form handling, manage server and client integration, and handle data mutations without the boilerplate.
typescript
Advanced TypeScript: Conditional Types & Inference
Unlock the full potential of static analysis by mastering TypeScript conditional types and inference. Learn to build flexible, type-safe code that adapts dynamically.
react
React 19 useOptimistic: Instant UI Updates Guide
Master React 19's useOptimistic hook for instant UI feedback. Learn to implement optimistic updates, improving user experience in your React apps with practical examples.
From the blog
Longer thoughts and deep dives
Stop Over-Engineering React State: Why Server Actions and Optimistic UI Are Replacing Redux in 2026
A pragmatic deep dive into modern React state architecture. Learn why server-driven mutations and React 19's useOptimistic hook make heavy client state libraries obsolete for most apps.
LearnWebCraft Team
Form State Management in 2026 (No Libraries)
Master managing form state without libraries using modern vanilla JavaScript. Learn efficient, native techniques to build robust forms in 2026.
LearnWebCraft Team
Speculation Rules API Production Implementation: Boost LCP
Engineer instant page loads. Deep dive into implementing the Speculation Rules API for production apps to optimize LCP and Core Web Vitals.
LearnWebCraft Team
Free tools
Utilities for daily frontend work
Advanced Password Generator
Generate high-entropy passwords with charset controls and ambiguity filters.
Hash Generator and Verifier
Generate MD5, SHA-1, SHA-256, and SHA-512 for verification workflows.
CSS Gradient Generator
Create linear, radial, and conic gradients with live preview and copy-ready CSS.
CSS Border Radius Generator
Generate border-radius values visually with linked and independent corner controls.