development
Development commands and workflow for this project. When starting the dev server, use background mode:
Install / Use
npx skills add tsongglod123/excel-formula-visualizerInstalls into whichever agent you are using.
.clinerules
Cline rules
Quality Score
Category
AutomationSupported Platforms
Tags
Skill content
View source on GitHubDevelopment
Development commands and workflow for this project.
Dev Server
When starting the dev server, use background mode:
astro dev --background
Manage the background server with:
astro dev stop— Stop the background serverastro dev status— Check if the server is runningastro dev logs— View server logs
Commands
| Command | Action |
| :------ | :----- |
| npm install | Install dependencies |
| npm run dev | Start local dev server at localhost:4321 |
| npm run build | Build production site to ./dist/ |
| npm run preview | Preview production build locally (via netlify serve at localhost:8888) |
| npm run astro ... | Run Astro CLI commands (astro add, astro check, etc.) |
| npm run test | Run Vitest tests |
| npm run test:coverage | Run Vitest with coverage report |
Note:
astro previewis not supported by the@astrojs/netlifyadapter.npm run previewrunsnetlify serve, which servesdist/plus the SSR function for/visualize. Runnpm run buildfirst.
Documentation
Full documentation: https://docs.astro.build
Consult these guides before working on related tasks:
- Adding pages, dynamic routes, or middleware
- Working with Astro components
- Using React, Vue, Svelte, or other framework components
- Adding or managing content
- Adding styles or using Tailwind
- Supporting multiple languages
Project Structure
The only directory reserved by Astro is src/pages/. Other directories (src/components/, src/layouts/, src/styles/) are conventions, not requirements.
| Directory | Purpose |
|-----------|---------|
| src/pages/ | Required. File-based routing. .astro, .md, .mdx files become routes. |
| src/components/astro/ | Reusable Astro components (convention) |
| src/components/react/ | Interactive React islands (visualizer) |
| src/layouts/ | Page layout components providing <html>, <head>, <body> shell with <slot /> (convention) |
| src/styles/ | Global CSS files (convention) |
| public/ | Unprocessed static assets (fonts, favicon, PDFs) — copied as-is to build |
Architecture Overview
Formula String → [Parse] → AST → [Visualize] → Visual Blocks → [Explain] → Plain English
Three individually tested layers sharing the AST as their data contract:
- Parse —
src/lib/parser/(Tokenizer, Parser, FormulaError), AST hierarchy insrc/lib/ast/ - Visualize — React components in
src/components/react/(FormulaOutline,EvaluatorBar,ExplanationPanel,VisualizerClient) - Explain —
src/lib/translate/(category modules +TranslationContext),functionArgs/,functionDocs/
Deployed Behavior
- The
/visualizeroute is server-rendered on demand (@astrojs/netlifyadapter,prerender = false) to parse formula query params - All other pages are static
Related Skills
pyspark-etl-best-practices-cursorrules-prompt-file
40.6kCursor rules for PySpark ETL development with code style, joins, window functions, map operations, and Iceberg patterns.
semiotic-react-dataviz-cursorrules-prompt-file
40.6kCursor rules for Semiotic data visualization library with 30+ chart types, MCP server, and AI-assisted chart generation.
Agent-Reach
72.5kGive your AI agent eyes to see the entire internet. Read & search Twitter, Reddit, YouTube, GitHub, Bilibili, XiaoHongShu — one CLI, zero API fees.
ruflo
68.1k🌊 The original agent meta-harness. Deploy intelligent multi-player swarms, coordinate autonomous workflows, and build conversational AI systems. Features adaptive memory, self-learning intelligence, RAG integration, and native Claude Code / Codex / Hermes and many more Integrated
Security Score
Audited on Invalid Date