SuperAPI AI Directory

technology-selection

Frontend & websites

View repository

Updated 10-15 21:39

About this skill

Technology Selection

When to Use

  • Phase 2 of the full-stack workflow: after requirements analysis is complete and before technical review.
  • When the user explicitly says they want to do technology selection or determine the tech stack.

Communicate with the user (required)

This phase is inexecuted in the main conversation, and you must communicate with the user; you must not assume on your own or skip the conversation and directly produce the document.

Interaction Principles

  • All decision points should be presented as structured options, letting the user choose rather than freely input.
  • Do not ask more than 3 questions at a time to avoid information overload.
  • After each round of questions, wait for the user's reply before moving to the next round; do not throw out all questions at once.
  • Allow the user to add beyond the options (after choosing "Other" or "No preference", they may add an explanation).

Structured Questioning Guidance

Based on the development scope already determined in the requirements document,present options to the user in rounds。

Round 1: Development Scope Confirmation

If the requirements document has already specified the development scope, this round may be skipped.

Q1 — Development scope?

  • A. Full-stack development (frontend + backend + data storage)
  • B. Frontend only (UI and frontend logic, data mocked or local)
  • C. Backend only (API + database, no UI)

Based on the user's choice, proceed to the corresponding template:

Round 2: Frontend Selection (when frontend is involved)

Q2 — Frontend framework?

  • A. React
  • B. Vue
  • C. Next.js
  • D. Nuxt
  • E. Svelte
  • F. Other (please specify)

Q3 — UI component library?

  • A. Ant Design
  • B. MUI (Material UI)
  • C. Element Plus
  • D. shadcn/ui
  • E. Do not use a component library (hand-written)
  • F. No preference, recommend based on the framework

Q4 — CSS approach?

  • A. Tailwind CSS
  • B. CSS Modules
  • C. styled-components / Emotion
  • D. The component library's built-in styles are sufficient
  • E. No preference

Round 3: Backend Selection (when backend is involved)

Q5 — Backend language?

  • A. Java
  • B. TypeScript (Node.js)
  • C. Go
  • D. Python
  • E. Other (please specify)

Q6 — Backend framework?(Provide corresponding options based on the language in Q5)

  • Java: A. Spring Boot / B. Quarkus
  • TypeScript: A. Express / B. Fastify / C. NestJS
  • Go: A. Gin / B. Echo
  • Python: A. FastAPI / B. Django

Q7 — Database?

  • A. PostgreSQL
  • B. MySQL
  • C. MongoDB
  • D. SQLite
  • E. No preference, you recommend

Round 4: Supplementary Selection

Q8 — Testing framework?(Provide corresponding options based on the selected language)

  • Frontend: A. Vitest / B. Jest / C. Decide later
  • Backend Java: A. JUnit 5 / B. Decide later
  • Backend TS: A. Jest / B. Vitest / C. Decide later
  • Backend Python: A. pytest / B. Decide later

Q9 — Package manager?(Provide corresponding options based on the selected language)

  • Frontend: A. pnpm / B. yarn / C. npm
  • Java: A. Maven / B. Gradle
  • Python: A. pip / B. poetry

Q10 — Are there any other technical preferences you want to add?(Open-ended; you may answer "No more")

Execution Points

  1. Refer to the non-functional requirements in the requirements document (performance, security, deployment) and UI/UX preferences to constrain the selection.
  2. Version locking: specify the version numbers or version ranges of the main frameworks/libraries.
  3. Dependency management: specify the package manager (npm/yarn/pnpm, Maven/Gradle, pip/poetry, etc.).
  4. Development environment: Node version, JDK version, Python version, etc.
  5. Testing tools: unit testing framework, E2E framework (if needed).

Supplementary materials

  • Complete example output:examples/sample-output.md — Show the complete structure of a qualified technology selection checklist
  • Selection reference:reference.md — Common full-stack combinations, framework/component library/database comparisons, selection decision principles

Output

  • A technology selection checklist, for use in "technical review" and "program design".

Document and status

  • Output written to docs/{current_iteration_id}/technology-selection-{technology_selection_id}.md。
  • Before starting: call the history-manager skill's get-phase technology_selection and check-file to confirm whether it has been completed.
  • After completion: call the history-manager skill's set-phase technology_selection {technology_selection_id} to record and advance the status.