KS
Killer-Skills

www — how to use www how to use www, what is www, www alternative, www vs Astro, www install, www setup guide, Astro website development, Python Un-Notebook, npm run dev

v1.0.0
GitHub

About this Skill

Perfect for Frontend Agents working with Astro websites needing advanced content management capabilities. www is a Python-based Astro website development environment for updating content, adding pages, and adjusting styling

Features

Updates content and adds pages using Astro.glob
Adjusts styling following the local design system
Installs dependencies via npm install in the www directory
Runs a development server with npm run dev
Previews builds using npm run preview
Organizes route files in www/src/pages/

# Core Topics

vangberg vangberg
[1]
[0]
Updated: 2/26/2026

Quality Score

Top 5%
23
Excellent
Based on code quality & docs
Installation
SYS Universal Install (Auto-Detect)
Cursor IDE Windsurf IDE VS Code IDE
> npx killer-skills add vangberg/pdit

Agent Capability Analysis

The www MCP Server by vangberg is an open-source Categories.community integration for Claude and other AI agents, enabling seamless task automation and capability expansion. Optimized for how to use www, what is www, www alternative.

Ideal Agent Persona

Perfect for Frontend Agents working with Astro websites needing advanced content management capabilities.

Core Value

Empowers agents to update content, add pages, and adjust styling on Astro sites using npm and Astro.glob, while following the local design system and leveraging route files in `www/src/pages/`.

Capabilities Granted for www MCP Server

Updating content on Astro websites
Adding new pages or news posts using `Astro.glob`
Adjusting styling to match the local design system

! Prerequisites & Limits

  • Requires npm installation
  • Limited to Astro websites
  • Dependent on local design system
Project
SKILL.md
2.0 KB
.cursorrules
1.2 KB
package.json
240 B
Ready
UTF-8
SKILL.md
Readonly

www Astro website

Overview

Work on the Astro site in www/: update content, add pages or news posts, and adjust styling while following the local design system.

Quick Start

  • Install deps: cd www && npm install
  • Run dev server: npm run dev
  • Build: npm run build
  • Preview build: npm run preview

Project Map

  • Use www/src/pages/ for route files (e.g., index.astro, manual.astro, news/).
  • List news posts in www/src/pages/news/index.astro via Astro.glob; export title and date from each post.
  • Wrap pages with www/src/layouts/Layout.astro; keep Nav, global CSS, fonts, and analytics wired in.
  • Edit the main nav in www/src/components/Nav.astro.
  • Treat www/src/styles/global.css as the home for global typography, colors, and layout defaults.
  • Place static assets in www/public/ (images, icons).
  • Follow the design system in www/DESIGN.md.
  • Avoid editing www/dist/ directly (build output, ignored by git).

Conventions

  • Wrap pages with Layout and set title plus description when available.
  • Put shared styling in www/src/styles/global.css; keep page-specific styles in each .astro file's <style> block.
  • Follow www/DESIGN.md: bold, high contrast, thick borders, sharp corners, palette-driven accents.
  • Preserve existing typography: Fira Mono for headings, system-ui for body.
  • Keep assets in www/public/ and reference by absolute path (e.g., /screenshot.png).

Common Tasks

Update content

  • Edit the target .astro file in www/src/pages/ or www/src/pages/news/.
  • Adjust local styles in the same file if layout changes are needed.

Add a new page

  1. Create www/src/pages/<route>.astro.
  2. Use Layout and provide title/description.
  3. Add a nav link in www/src/components/Nav.astro if the page should appear in the top nav.

Add a news post

  1. Create www/src/pages/news/<slug>.astro.
  2. Export title and date as strings.
  3. Use Layout and include a back-link to /news/.
  4. Rely on Astro.glob in /news/ to surface the post automatically.

Related Skills

Looking for an alternative to www or building a Categories.community AI Agent? Explore these related open-source MCP Servers.

View All

widget-generator

Logo of f
f

widget-generator is an open-source AI agent skill for creating widget plugins that are injected into prompt feeds on prompts.chat. It supports two rendering modes: standard prompt widgets using default PromptCard styling and custom render widgets built as full React components.

149.6k
0
Design

chat-sdk

Logo of lobehub
lobehub

chat-sdk is a unified TypeScript SDK for building chat bots across multiple platforms, providing a single interface for deploying bot logic.

73.0k
0
Communication

zustand

Logo of lobehub
lobehub

The ultimate space for work and life — to find, build, and collaborate with agent teammates that grow with you. We are taking agent harness to the next level — enabling multi-agent collaboration, effortless agent team design, and introducing agents as the unit of work interaction.

72.8k
0
Communication

data-fetching

Logo of lobehub
lobehub

The ultimate space for work and life — to find, build, and collaborate with agent teammates that grow with you. We are taking agent harness to the next level — enabling multi-agent collaboration, effortless agent team design, and introducing agents as the unit of work interaction.

72.8k
0
Communication