Permit's MCP-gateway: https://permit.io/mcp-gateway (sponsored)
Permit MCP Gateway is a drop-in zero-trust proxy that adds authentication, fine-grained authorization, consent, and audit logging to any MCP server. Swap one URL. No code changes. Works with Salesforce, GitHub, Slack, Jira, and any MCP server you already use.

👉 React & Next.js Course: https://bytegrad.com/courses/professional-react-nextjs

Hi, I'm Wesley. I'm a brand ambassador for Kinde (paid sponsorship).
👉 Kinde $50 credit for auth and more https://kinde.com/r?kinde_ref=e95bc6f8f17eda7c
👉 Work with me: support@bytegrad.com

👉 React & Next.js Course: https://bytegrad.com/courses/professional-react-nextjs
👉 Professional JavaScript Course: https://bytegrad.com/courses/professional-javascript
👉 Professional CSS Course: https://bytegrad.com/courses/professional-css

👉 Web development roadmap: https://email.bytegrad.com
👉 Email newsletter (BIG update soon): https://email.bytegrad.com
👉 Discord: all my courses have a private Discord

⏱️ Timestamps:
00:00 MCP is not dead
02:29 MCP gateway
02:45 Figma MCP server
10:03 Paper MCP
13:47 Pencil MCP
16:15 MCP gateway (MCP auth & authorization)
19:50 shadcn/ui MCP
23:42 Context7 MCP
27:37 GitHub MCP
30:46 MCP gateway
31:59 Playwright MCP
34:51 Chrome DevTools MCP
37:14 Reuse existing browser session
40:41 Web search / web access MCPs
42:44 Vercel, Supabase, Notion, Slack, n8n, Linear
47:13 Build your own MCP server
48:33 Web MCP
50:37 MCP gateway setup demo
57:43 Permission denied demo
1:00:01 Outro

#webdevelopment #reactjs #nextjs

Note that my videos may contain mistakes. Always verify yourself that your code is safe and does what you want it to do for your specific situation. You agree by watching the videos that you are solely responsible for any mistakes in your code.

This channel and all its content is owned & operated by ByteGrad Sp. z o.o. with Tax ID: PL6762676561 and KRS-number: 0001125554

ByteGrad

A walkthrough of 11 MCP servers worth integrating into AI coding agent workflows (Claude Code, Cursor, Codex, OpenCode). Covers design tools (Figma MCP, Paper MCP, Pencil), UI component access (shadcn/ui MCP), up-to-date documentation (Context7), GitHub repo access, browser automation (Playwright MCP, Chrome DevTools MCP), web search providers (Brave, Firecrawl, Perplexity), third-party service integrations (Vercel, Supabase, Notion, Slack, Linear, n8n), and building custom MCP servers. Also introduces the Permit MCP Gateway for handling authentication, authorization, and auditing across MCP tool calls.

Top 11 MCP-Servers EVERY Developer Should Use With Claude Code / Cursor / Codex / OpenCode

<p>MCP Servers every FRONTEND developer should use. Most of these aren’t new or broadly usable.</p>


<p>You don’t need most of these if you just tell claude to use the tools to do exactly what you need. I can see the security aspect of MCPs, but those “public MCPs” are becoming too many and uncontrolled.
Without a central system governing them we can never trust any of them to not steal our info when claude interacts with them.
It’s safer to setup our own, and frankly, not all that hard to do.</p>
