Akademia · Serwery MCP

Serwery MCP: rozszerz możliwości Claude Code.

Model Context Protocol to standardowy sposób łączenia narzędzi AI z zewnętrznymi systemami. Dzięki serwerom MCP Claude Code kontroluje przeglądarkę, sięga do baz danych i automatyzuje złożone zadania. Na warsztat bierzemy Chrome DevTools MCP — agent testuje i debuguje aplikacje webowe wprost w Chrome.

Ostatnia aktualizacja:

Rozszerzalnośćnowe możliwości dla agenta
Chrome DevTools MCPtesty, debug i wydajność w przeglądarce
Node LTSi zainstalowany Google Chrome

01 / MCP · Czym jest i jak zacząć

Model Context Protocol w codziennej pracy.

Model Context Protocol to standardowy sposób łączenia narzędzi AI z zewnętrznymi systemami i usługami. Serwery MCP działają jako pomosty między agentem a narzędziami — dzięki nim Claude Code może kontrolować przeglądarki, łączyć się z bazami danych, zarządzać plikami i wykonywać zadania wykraczające poza podstawowe możliwości.

  • Rozszerzalność. Dodajesz nowe możliwości do Claude Code.
  • Integracje. Łączysz agenta z zewnętrznymi narzędziami.
  • Automatyzacja. Automatyzujesz złożone przepływy pracy.
  • Monitoring. Śledzisz i debugujesz aplikacje w czasie rzeczywistym.

Chrome DevTools MCP

Chrome DevTools MCP daje Claude Code bezpośrednią kontrolę nad przeglądarką Chrome. Agent testuje, debuguje i optymalizuje kod w rzeczywistym środowisku — analizuje błędy, mierzy wydajność i symuluje interakcje użytkownika.

Wymagania

  • Node.js w aktualnej wersji LTS.
  • Zainstalowany Google Chrome (wersja stable lub nowsza).
  • Claude Code — zamknij go przed instalacją serwera.
# weryfikacja wersji Node.js
node --version

Instalacja

Zamknij Claude Code, a następnie uruchom w terminalu:

claude mcp add chrome-devtools --scope user npx chrome-devtools-mcp@latest

Aktualizacja: kanoniczna składnia stdio ma separator: claude mcp add [options] <name> -- <command> [args...]. Separator -- jest opcjonalny przy prostym npx bez flag, ale wymagany, gdy przekazujesz serwerowi flagi z myślnikiem — inaczej trafią one do claude mcp add, a nie do serwera. Wymagane jest aktualne LTS Node.js oraz zainstalowany Chrome.

Aby wyłączyć telemetrię, dołącz flagę serwera:

claude mcp add chrome-devtools --scope user -- npx chrome-devtools-mcp@latest --no-usage-statistics

Uwaga: po instalacji uruchom Claude Code ponownie, aby serwer MCP został wczytany.

Instalacja jako plugin (rekomendowana)

Zalecaną drogą jest plugin z marketplace — w pakiecie z serwerem MCP dostajesz Skills (umiejętności), których sama instalacja przez CLI nie dokłada. Jeśli serwer dodałeś wcześniej przez CLI, najpierw go usuń, żeby wpisy się nie dublowały, a potem:

# jeśli był dodany przez CLI — najpierw usuń
claude mcp remove chrome-devtools

# w Claude Code:
/plugin marketplace add ChromeDevTools/chrome-devtools-mcp
/plugin install chrome-devtools-mcp@chrome-devtools-plugins

Aktualizacja: po instalacji pluginu zrestartuj Claude Code i sprawdź dołączone Skills komendą /skills. Wymagania bez zmian: Node.js w aktualnej wersji LTS oraz Chrome w wersji stable lub nowszej.

Przykłady użycia

  • „Przeanalizuj wydajność strony https://example.com".
  • „Sprawdź błędy JavaScript i wygeneruj poprawki".
  • „Przetestuj formularz kontaktowy".
  • „Zrób screenshot responsywności na różnych urządzeniach".

Możliwości Chrome DevTools MCP

  • Interakcja z elementami i wypełnianie formularzy.
  • Zarządzanie oknami i emulacja urządzeń.
  • Monitoring sieci i analiza wydajności.
  • Screenshoty i dostęp do konsoli JavaScript.

02 / Akademia · Czytaj dalej

Powiązane szkolenia.

Claude Code

Instalacja, poziomy myślenia i workflow agentowy od podstaw.

MCP Supabase

Połączenie agenta z bazą Supabase — tryb read-only i bezpieczeństwo.

MySQL MCP Server

Agent na bazie MySQL: konfiguracja, operacje zapisu, pułapki wersji.

Wdrożenie u Was

Chcecie, żeby tak pracował cały Wasz zespół?

Akademia to materiały. Wdrożenie to dwa kwartały na Waszym kodzie — z pomiarem efektu w DEVLens. 30 minut wystarczy, żeby sprawdzić, czy ma to u Was sens.

Umów rozmowę +48 505 091 200