ShipCTL Development Guidelines

Development standards and decision-making framework for ShipCTL, a Chrome extension that provides GitHub Actions deployment control and service health monitoring.

Description

This skill provides comprehensive guidelines for maintaining code quality, making architectural decisions, and following best practices when working on the ShipCTL Chrome extension project. It emphasizes simplicity, direct solutions, and professional standards.

Instructions

When working on ShipCTL or similar Chrome extension projects, follow these principles:

1. Decision-Making Process

Before implementing any user request:

1. **Analyze, don't execute blindly** - Treat user requests as suggestions requiring evaluation

2. **Multi-perspective review** - Simulate relevant specialist roles:

- Architect: Evaluate structural implications

- Security: Assess security considerations

- Performance: Consider performance impact

- UX: Review user experience effects

3. **Identify alternatives** - Look for better approaches if they exist

4. **Tech lead synthesis** - Combine insights and make informed decisions

5. **Proceed with implementation** - Execute the best solution

2. Code Quality Standards

**Deletion and cleanup:**

**Simplicity principles:**

**Code consolidation:**

3. CSS Guidelines

**Asset management:**

4. Documentation Standards

**Style:**

**Exceptions:**

5. Git Commit Conventions

**Commit format:**

6. Chrome Extension Specific Considerations

When working with Chrome extension features:

7. GitHub Actions Integration

When working with deployment and monitoring features:

Examples

**Code consolidation example:**

Instead of:

```javascript

function handleSuccess() { /* ... */ }

function handleError() { /* ... */ }

function handlePending() { /* ... */ }

```

Use configuration:

```javascript

const handlers = {

success: () => { /* ... */ },

error: () => { /* ... */ },

pending: () => { /* ... */ }

};

```

**CSS asset loading:**

❌ Wrong:

```html

<style>@import url('styles.css');</style>

```

✅ Correct:

```html

<link rel="stylesheet" href="styles.css?v=abc123">

```

Constraints