Training course · Windsurf · Web Development

Windsurf for Web Developers

Develop with the Windsurf AI IDE and its Cascade agent: flows, memories, rules, workflows and safe use across the team.

Duration
2 days (14 hrs)
Format
Online or on-site
Language
German or English
Participants
open dates or exclusive for your team
Certificate
Certificate of attendance

Overview

“Windsurf for Web Developers” is a hands-on course for roles such as Web developers in agencies and in-house teams, Freelancers building websites and web applications and Developers on CMS projects using WordPress, TYPO3 or headless CMS. Rather than learning Windsurf in the abstract, you work on tasks from your daily routine – with examples, exercises and templates from Web Development.

Windsurf is an AI-powered development environment built around its agent, Cascade. Cascade understands the structure of your project, follows your actions in the editor and terminal, and works with you according to the flow principle: you and the agent take turns on the same task without having to re-explain context over and over. In this two-day course you will learn how to use Cascade effectively for features, debugging and refactoring, and how to make the most of intelligent completion in your daily development work.

To keep results consistent across a team, you steer Cascade with global and workspace rules, rely on memories for lasting project knowledge and automate recurring procedures with workflows that run from a slash command. You will connect external tools through MCP, control how terminal commands are executed and decide which data Cascade is allowed to see. Finally, you will define rules for code review, security and data protection so that Windsurf can be used responsibly within your organisation and its existing processes.

Web development today covers far more than HTML, CSS and a bit of JavaScript: responsive layouts, accessibility, SEO, performance, forms, content management systems, APIs, hosting and deployment are all part of the job. In small teams and agencies especially, web developers have to cover all of it. AI coding assistants and agents are a huge lever here: they turn designs into layouts, write semantic HTML and modern CSS with grid and container queries, audit pages for accessibility and Core Web Vitals, build CMS templates and automate deployments. Vibe coding also makes rapid prototypes possible that used to take days. This course teaches you to combine that speed with clean structure, maintainability and quality assurance.

The course is delivered live – either online in a virtual classroom or on-site in our training rooms in Munich, Salzburg, Berlin, Augsburg, Hanover, Bremen, Stuttgart and Kaiserslautern. We can also run it exclusively for your team.

Who is this course for?

  • Web developers in agencies and in-house teams
  • Freelancers building websites and web applications
  • Developers on CMS projects using WordPress, TYPO3 or headless CMS
  • Career changers with a grounding in HTML, CSS and JavaScript

Typical challenges we address

  • A broad remit from layout and SEO to hosting in small teams
  • Rising expectations around accessibility, performance and privacy
  • Maintaining many client projects built on different technologies and versions
  • Time pressure on relaunches, landing pages and campaign sites

What you will be able to do

  • You use Cascade productively in flow for features, debugging and refactoring.
  • You steer Windsurf’s context precisely and keep sensitive content protected.
  • You maintain memories and rules that reliably enforce your project conventions.
  • You automate recurring procedures with workflows and connect external tools via MCP.
  • Deliver websites and web applications faster and with clean structure using AI support.
  • Use AI deliberately for accessibility, performance and technical SEO.
  • Turn vibe-coded prototypes into maintainable, secure and privacy-compliant projects.

Course outline

Day 1

Module 1 Getting to know Windsurf and Cascade
  • Installation, importing existing editor settings and basic configuration
  • Cascade in code and chat mode: when the agent edits and when it only advises
  • The flow principle: how Cascade takes your editor and terminal actions into account
  • Intelligent completion and inline commands in everyday development
Module 2 Steering context
  • Understanding codebase indexing and referencing relevant files or directories
  • Bringing documentation, web sources and terminal output into context
  • Excluding sensitive content from context with ignore files
  • Structuring sessions and starting afresh when the topic changes
Module 3 Memories and rules for consistent results
  • Reviewing and maintaining auto-generated and manually created memories
  • Creating and versioning global and workspace rules
  • Expressing architecture, style and testing guidelines as effective rules
  • Activating rules selectively by file pattern or occasion
Module 4 Workflows and automation
  • Defining recurring procedures as workflows and launching them via slash command
  • Building workflows for release preparation, testing or code maintenance
  • Connecting MCP servers for issue trackers, databases or internal services
  • Controlling terminal command execution with allow and deny lists

Day 2

Module 5 Quality, review and governance
  • Tracing Cascade’s changes, accepting them partially or reverting them
  • Using a test-driven approach and preview features for verification
  • Team settings, data protection options and handling of secrets
  • Defining review processes and accountability for AI-generated code
Module 6 Practice lab: Web Development
  • Turning designs into layouts
  • Accessibility audit
  • Performance and Core Web Vitals
  • CMS templates and extensions
  • Technical SEO
  • Forms and integrations
Module 7 Data protection, quality & transfer to daily work
  • Websites are subject to GDPR, ePrivacy rules and, in many cases, accessibility legislation under the European Accessibility Act: generated code must not embed tracking or external resources without consent and must be checked for accessibility. Also watch the licences of fonts, images and code snippets, and keep hosting and CMS credentials out of prompts.
  • Ground rules for safe AI use in your team
  • Checking results: facts, sources, tests and the four-eyes principle
  • Personal action plan for the next 30 days
  • Open questions, outlook and resources for further learning

Practical scenarios from your field

Turning designs into layouts

From screenshots or design files, the assistant produces semantic HTML and modern CSS using grid, flexbox and custom properties, responsive across all breakpoints and consistent with existing stylesheets.

Accessibility audit

The AI checks pages for heading structure, alt text, form labels, keyboard operability and contrast, interprets automated test results and fixes findings against WCAG success criteria.

Performance and Core Web Vitals

Lighthouse reports are analysed, images converted to modern formats with responsive sources, critical CSS extracted, scripts deferred and layout shifts eliminated in a targeted way.

CMS templates and extensions

The agent builds themes, blocks or plugins for WordPress, TYPO3 or a headless CMS, including content models, templates and protection against common security flaws. The system’s coding standards are respected.

Technical SEO

The AI adds structured data, meta tags, hreflang annotations, readable URLs and XML sitemaps, and checks internal linking and canonicals for consistency. Broken redirects and duplicate content are uncovered.

Forms and integrations

Contact and enquiry forms are built with validation, spam protection and server-side processing, alongside integrations with newsletter, CRM or booking systems via their APIs. Errors and timeouts are handled cleanly.

Possible hands-on projects

Static website with a generator

A multilingual company website built with a static site generator, structured data, a sitemap and automated deployment through a CI pipeline.

Accessibility checker

A small tool that automatically audits a list of URLs, sorts findings by severity and generates a readable HTML report.

Appointment booking widget

An embeddable widget that loads available slots from an API, accepts bookings and triggers confirmation emails. The widget is accessible and fully responsive on all devices.

Prerequisites

You program regularly in at least one language and are familiar with Git and a modern IDE. Good knowledge of HTML, CSS and JavaScript plus some experience with Git, a CMS or a front-end framework.

Technical requirements

Your own laptop with the Windsurf editor, Git and your usual toolchain installed; a Windsurf account with access to Cascade is required.

Data protection & compliance

Websites are subject to GDPR, ePrivacy rules and, in many cases, accessibility legislation under the European Accessibility Act: generated code must not embed tracking or external resources without consent and must be checked for accessibility. Also watch the licences of fonts, images and code snippets, and keep hosting and CMS credentials out of prompts.

Suggested dates

All dates are suggestions – your preferred date is always possible.

  • Thu, 26 November 2026 – Fri, 27 November 2026 Online Request
  • Tue, 8 December 2026 – Wed, 9 December 2026 Berlin Request
  • Thu, 17 December 2026 – Fri, 18 December 2026 Online Request
  • Tue, 19 January 2027 – Wed, 20 January 2027 Online Request
  • Thu, 28 January 2027 – Fri, 29 January 2027 Hanover Request
  • Thu, 4 February 2027 – Fri, 5 February 2027 Online Request

Frequently asked questions

What does Windsurf mean by flows?

Flows describe the close collaboration between you and Cascade. The agent observes what you do in the editor and terminal and takes those actions into account in its next steps. As a result you do not have to keep explaining where you are, and you can move smoothly between doing the work yourself and delegating it to the agent.

How do memories, rules and workflows differ?

Memories store knowledge that Cascade has gathered while working or that you have explicitly recorded. Rules are guidelines you write that shape the agent’s behaviour permanently. Workflows are reusable sequences of steps for recurring tasks, launched with a slash command. Together they keep results consistent across the whole team.

Can I use Windsurf with my existing projects and languages?

Yes. Windsurf is language-agnostic and works with your existing toolchain, including build tools, package managers and test frameworks. Whether you work on back end, front end, data processing or infrastructure code, what matters is giving Cascade good rules and clear context. Each course variant adds the specific focus for your field.

Can AI build an entire website for me?

For prototypes and simple sites, yes – and remarkably quickly. Production websites, however, need structure: clean components, verified accessibility, privacy compliance, performance and a well-designed deployment. On the course you learn to move AI-generated output into a maintainable project structure and safeguard it systematically.

Is the course suitable for career changers?

Yes, provided you have a grounding in HTML, CSS and JavaScript. AI explains code and concepts clearly and helps close knowledge gaps quickly. We make sure you understand the generated solutions and can evaluate them independently, rather than simply accepting whatever the assistant produces.

How much does “Windsurf for Web Developers” cost?

The course costs a flat €949 plus VAT per participant – whether online or on-site. This includes 2 training day(s) with a live trainer, course materials, a lab environment and a certificate of attendance.

Can I suggest my own date?

Yes. Our suggested dates are just a guide. In the request form you can always describe your preferred date or period in free text – we check availability and confirm within one working day.

Is the course online or on-site?

Both are possible: live online in a virtual classroom or on-site in Munich, Salzburg, Berlin, Augsburg, Hanover, Bremen, Stuttgart or Kaiserslautern. We can also run the course exclusively for your team.

More courses for Web Developers

More Windsurf courses

All 32 Windsurf courses

Windsurf · MunichWindsurf · SalzburgWindsurf · BerlinWindsurf · AugsburgWindsurf · HanoverWindsurf · BremenWindsurf · StuttgartWindsurf · KaiserslauternWindsurf · Online