| // 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" |
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.
| ## Getting Started | |
| ### Open the configuration file | |
| ```console | |
| code ~/Library/Application\ Support/Claude/claude_desktop_config.json | |
| ``` | |
| ```console | |
| code %APPDATA%\Claude\claude_desktop_config.json | |
| ``` |
| export const products = [ | |
| { | |
| name: 'Phone XL', | |
| price: 799, | |
| description: 'A large phone with one of the best screens' | |
| }, | |
| { | |
| name: 'Phone Mini', | |
| price: 699, | |
| description: 'A great phone with one of the best cameras' |
| /* Global Styles */ | |
| * { | |
| font-family: "Roboto", Arial, sans-serif; | |
| color: #616161; | |
| box-sizing: border-box; | |
| -webkit-font-smoothing: antialiased; | |
| -moz-osx-font-smoothing: grayscale; | |
| } |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>GoCode</title> | |
| <script src="https://unpkg.com/redux@latest/dist/redux.min.js"></script> | |
| </head> | |
| <body> | |
| <div> | |
| <p> | |
| Counter: <span id="value">0</span> times |
| <template> | |
| <div class="layout bg-gray-200 font-sans leading-normal tracking-normal"> | |
| <div | |
| class="w-full m-0 p-0 bg-cover bg-bottom" | |
| style="background-image:url('/cover.jpg'); height: 40vh; max-height:260px;" | |
| > | |
| <div | |
| class="container max-w-4xl mx-auto pt-16 md:pt-15 text-center break-normal" | |
| > | |
| <!--Title--> |
