Elad Cohen eladcandroid

Claude Code Native LSP Setup Guide

Enable Language Server Protocol support in Claude Code for 900x faster code navigation (~50ms vs ~45s for text-based search).

What LSP Provides

goToDefinition - Jump to symbol definitions
findReferences - Find all usages across codebase
hover - Type info and documentation
documentSymbol - File structure overview

name	browser-debugger
description	Control Chrome browser for debugging, testing, and automation using the browser-debugger-cli (bdg) tool. Use this skill when you need to interact with web pages, capture screenshots, inspect DOM elements, monitor network requests, or automate browser tasks.

Browser Debugger CLI (bdg) Skill

Use this skill to control Chrome browser sessions for debugging, testing, and web automation.

Prerequisites

Getting Started

Description

Model Context Protocol (MCP) is a standardized protocol for connecting AI agents to various external tools and data sources. Imagine it as a USB-C interface - but for AI applications.

Just like USB-C simplifies the way different devices connect to a computer, MCP simplifies the way AI models interact with data, tools, and services.

MCP Diagrams

https://www.claudemcp.com/images/blog/what-is-mcp.png

	#!/bin/bash
	# vpn-run.sh — Connect VPN, run any command, disconnect on exit
	# Usage: ./vpn-run.sh <command> [args...]
	#
	# Examples:
	# ./vpn-run.sh freebuff
	# ./vpn-run.sh curl https://some-blocked-api.com
	# ./vpn-run.sh npm start

	VPN_ID=$(scutil --nc list \| grep "protonvpn" \| grep -oE '[0-9A-F-]{36}' \| head -1)

	import { Component, linkedSignal, signal } from '@angular/core';

	interface ShippingMethod {
	id: number;
	name: string;
	}

	@Component({
	selector: 'app-root',
	template: `

	import { Component, computed, signal } from '@angular/core';

	@Component({
	selector: 'app-root',
	template: `
	<h3>Counter value {{ counter() }}</h3>

	<h3>Derived counter: {{ derivedCounter() }}</h3>

	<button (click)="increment()">Increment</button>

	// Service Locator Pattern Example - Dynamic Service Resolution
	import { Injectable, Injector, Type } from '@angular/core';

	/**
	* Service Locator Pattern
	* Note: This pattern is sometimes considered an anti-pattern because it creates
	* hidden dependencies. Use it sparingly and prefer Angular's DI when possible.
	* Good use cases: Plugin systems, dynamic service loading, runtime service selection
	*/

	// Singleton Pattern Example - Configuration and Logger Services
	import { Injectable } from '@angular/core';
	import { HttpClient } from '@angular/common/http';
	import { APP_INITIALIZER } from '@angular/core';

	// Configuration Model
	export interface AppConfig {
	apiUrl: string;
	version: string;
	features: {

	// Complex subsystems
	import { Injectable } from '@angular/core';
	import { HttpClient } from '@angular/common/http';
	import { Observable, of, throwError, BehaviorSubject } from 'rxjs';
	import { tap } from 'rxjs/operators';

	// User Model
	export interface User {
	id: string;
	name: string;

	#!/bin/bash
	# Make sure this file is executable: chmod +x ~/.claude/statusline-command.sh

	# Claude Code statusline script - optimized with colors and emojis
	# Reads JSON input from stdin and outputs a formatted status line to stdout
	# Add to your ~/.claude/settings.json
	#
	# "statusLine": {
	# "type": "command",
	# "command": "bash ~/.claude/statusline-command.sh"