Upgrade to Pro — share decks privately, control downloads, hide ads and more …

AI-Powered Development | Angular Meetup Munich ...

AI-Powered Development | Angular Meetup Munich 2025

AI has become an essential part of modern software development, promising significant boosts in productivity and efficiency. However, for web developers — especially those working with the Angular framework — the sheer number of AI tools and large language models available today can create complexity rather than clarity. Constantly evolving APIs, shifting web standards, and dynamic client requirements further complicate effective adoption, often leading to frustration and suboptimal outcomes when using tools like GitHub Copilot, Cursor, or Windsurf. In this talk, I’ll guide you through the AI tool landscape, highlighting which solutions truly enhance productivity in real-world Angular development scenarios. You’ll learn practical strategies for integrating these AI tools effectively into your workflows, and you’ll gain insights into their limitations and potential pitfalls. By the end of this session, you’ll be equipped to confidently leverage AI tools to streamline and optimize your Angular development workflow.

Avatar for Daniel Sogl

Daniel Sogl

July 10, 2025
Tweet

More Decks by Daniel Sogl

Other Decks in Programming

Transcript

  1. AI-Powered Development Transform Your Workflow with Coding Tools and MCP

    Servers Daniel Sogl @sogldaniel Software architect
  2. Daniel Sogl • Software architect @ Thinktecture AG • Focus:

    Angular, Capacitor and AI-Coding • Socials: https://linktr.ee/daniel_sogl About me Transform Your Workflow with Coding Tools and MCP Servers AI-Powered Development
  3. Accelerate development: generate boilerplate code instantly Improve quality: AI can

    suggest best practices or detect issues Focus on logic: reduce time spent on repetitive tasks Documentation, tests, configs - automated AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Why use Generative AI for software development?
  4. Can produce incorrect or insecure code Output must always be

    reviewed by humans Lacks true understanding of project context Legal/ethical questions: IP, licensing, data privacy AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Limitations and risks
  5. • AI reduces critical thinking and problem-solving skills in the

    long term • Danger of cognitive laziness - “automation bias” • Blind trust in AI results increases the risk of errors AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Cognitive offloading
  6. The promises • Developers complete tasks 26% faster (MIT, 2023)

    • Coding tasks are on average 55% faster (GitHub, 2024) The (current) reality • AI-generated code with security vulnerabilities: 44% (Stanford, 2025) • Code duplicates increased by a factor of 4 after AI deployment (GitClear, 2024) AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Productivity claims over productivity claims https://mitsloan.mit.edu/ideas-made-to-matter/how-generative-ai-affects-highly-skilled-workers https://github.blog/news-insights/research/research-quantifying-github-copilots-impact-in-the-enterprise-with-accenture https://ee.stanford.edu/dan-boneh-and-team-find-relying-ai-more-likely-make-your-code-buggier https://www.gitclear.com/ai_assistant_code_quality_2025_research
  7. Why coding tools fail to support you • LLMs were

    trained on older data • LLMs don’t understand your architecture without help • LLMs don’t know your company domains • LLMs don’t know your coding standards • Developers don’t write prompts describing every edge case or needed context to solve tasks • Different tasks require different context AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Limitations of LLMs
  8. Context. Context. Context • We can define so-called custom instructions

    to provide extra context to all Copilot actions • A custom instruction is a markdown file with rules, instructions and guidelines defined by developers • Custom instructions can be added in a fine-grained way to specific file types • Custom instructions are part of a project and can be shared with all other developers • This pattern can also be used with Cursor, Windsurf, Claude Code or Gemini CLI Info: There is currently no unified format supported by all tools - you need to create separate configuration files for each tool individually AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers How to solve that problem?
  9. Usage with Copilot • Copilot knows two types of instruction

    files • Global instructions: copilot-instructions.md • Fine-tuned instructions: custom.instructions.md • Instructions can be scoped so they are included for defined file types such as *.ts, *.html, *.css • Instructions can also be scoped for Copilot specific tasks like generating commit messages, generating tests or reviewing code • This pattern also works with other tools like Cursor or Windsurf Tip: Keep your instructions short. Each condition will be part of your context window AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Custom instructions hierarchy
  10. • Custom instructions can be generated based on your current

    project architecture and existing files • Let the AI tool analyze your project • Use an example instructions file as reference • Generate instructions for your architecture, dependencies, best practices and code style with the help of the AI tool, adding extra context – for example, your eslint.json file • Use predefined instructions • https://codingrules.ai • https://www.cursordirectory.com • https://github.com/github/awesome-copilot • https://angular.dev/ai/develop-with-ai AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers How to create custom instructions
  11. Fragmented AI Landscape: Multiple AI providers with different APIs, authentication

    and response types Complex Integration: Context management, tooling and response handling are challenging Security: Access control, 3rd party providers, private data can’t be accessed or shared AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Why MCP matters
  12. The key for ”intelligent” workflows • Open-source protocol developed by

    Anthropic • Provides a consistent way for LLMs to interact with external resources • Client-Server architecture: AI applications (clients) request context from external services (servers) • Official servers are available for GitHub, Atlassian, Playwright, Stripe, Databases and more • It’s the key to useful AI-coding setups in complex environments AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Model Context Protocol (MCP)
  13. AI-Powered Development Transform Your Workflow with Coding Tools and MCP

    Servers MCP workflows Developer asks: “Explain failing tests in PR #42.” Copilot calls GitHub MCP → fetches PR diff + CI log LLM reviews context → returns root-cause & fix steps Dev clicks “Apply fix” → Copilot edits code & opens new PR
  14. • Microsoft verified MCP Servers for Agent Mode: https://code.visualstudio.com/mcp •

    MCP GitHub Repo: https://github.com/modelcontextprotocol/servers • Awesome MCP Server: https://github.com/punkpeye/awesome-mcp-servers • MCP Collection: https://glama.ai/mcp • Official provider websites like Atlassian, GitHub or PayPal AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers How to find MCP servers?
  15. GitHub MCP – connect to the GitHub API Atlassian MCP

    – connect to the Atlassian API (Jira, Confluence) Playwright MCP – control the browser Context7 – fetch library documentations (Angular, React, .Net) Perplexity MCP – search for web content File System MCP – access local file system Memory MCP – share memories between sessions and clients AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers MCP server recommendations
  16. • Not all LLMs are equal: Performance varies widely •

    Understand reasoning vs. non-reasoning models • Context size matters greatly in coding scenarios • Benchmarks help guide practical model choice AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Choosing the right LLM for your tasks
  17. Reasoning • Chain-of-thought: Write internal planning steps before generating answers

    • Tool calls: Actively fetch data or run tools during generation • Self-reflection: Score multiple solution paths and choose the best one • Best for: Debugging, complex algorithms, architectural analysis • Examples: GPT-4o, Claude 4 (Sonnet, Opus) Non-Reasoning • Direct token prediction: Output tokens without internal planning • Optimized for: Fast code completions, simple tasks, boilerplate generation • Examples: GPT-4.1, Gemini 2.5-Flash AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Reasoning vs. Non-Reasoning LLMs
  18. • Determines how much code/context an LLM can handle simultaneously.

    • Larger context → easier multi-file refactoring, whole-project reasoning. • Example contexts: • Small (~4k tokens): Single file, short functions. • Medium (16k–32k): Full modules, long functions. • Large (100k+): Entire repositories, API docs, complex integrations. AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Why context size matters
  19. AI-Powered Development Transform Your Workflow with Coding Tools and MCP

    Servers Popular LLMs for software development Model Provider Reasoning Context Window SWE-bench Claude 4 Opus Anthropic 200k tokens 79.4% Claude 4 Sonnet Anthropic 200k tokens 73.2% GPT-4.1 OpenAI 1M tokens 54.6% GPT-4o OpenAI 128k tokens 52% GPT-o3-mini OpenAI 200k tokens 50% Gemini 2.5 Pro Google 1M tokens 63% DeepSeek R1 DeepSeek 128k tokens 69%
  20. Which LLM Should You Choose Use Claude 4 or Gemini-2.5

    for high-quality coding tasks Use Gemini 2.5 Pro for large context + Google ecosystem Use DeepSeek for open/local development Use reasoning models when debugging, planning, or testing Pay attention to context size for repo-scale automation Always refer to benchmarks for grounded comparison Compare prices and premium request counters AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Practical recommendations
  21. • AI tools promise enormous productivity gains, but the current

    reality looks frustrating • Expectations for an LLM are either too high or too low • Developers must understand the limitations of LLMs and the AI tooling behind them • Add as much relevant context to your prompts as possible to help the LLM understand your goals • Specify custom instructions to document your architecture, framework specific rules and coding styles • Expand the available context with the help of MCP servers • Validate generated code and refine your tools and rules based on the results AI-Powered Development Transform Your Workflow with Coding Tools and MCP Servers Conclusion
  22. AI-Powered Development Transform Your Workflow with Coding Tools and MCP

    Servers The best developers won’t be replaced by AI, they’ll be the ones who learn to wield it