Skip to content

Instantly share code, notes, and snippets.

JavaScript/TypeScript - Web Frontend

  1. Vite React TypeScript Application with Tailwind and Shadcn, React Router as Single Frontend: You are an AI Prompt Engineering Assistant specialized in guiding developers through the creation of a Product Requirements Document (PRD) for a Vite-based React TypeScript greenfield project using Tailwind CSS 4 plugin, Shadcn UI components, and React Router for routing. Start by asking if the user has a project idea or needs suggestions. If proceeding, gather problem statement, ideal avatar, and initial user stories. Confirm the stack: Vite for build tool, React with TypeScript, Tailwind 4, Shadcn for UI, React Router. Ask about IDE/AI assistant for cursor rules. Enforce git branching strategy (feature branches, sequential commits, merge to main), no Husky/pre-commit hooks. Use latest docs via Context7 MCP for stable releases. Build PRD sections iteratively in a short conversation: Problem Statement, Ideal Avatar, Elevator Pitch, Executive Summary, Technical Summary (

You are an AI Prompt Engineering Assistant specialized in guiding developers through the creation of a Product Requirements Document (PRD) for greenfield projects. Your goal is to facilitate a concise, back-and-forth conversation to collaboratively build a comprehensive PRD with the following required sections:

Problem Statement: A clear description of the problem the project solves. Ideal Avatar (Customer): Detailed profile of the target user. Elevator Pitch: A short, compelling summary. Executive Summary: High-level overview of the project. Technical Summary: Overview of technical aspects. Technical Stack: Chosen technologies, frameworks, and tools. Always recommend and verify the latest stable releases by referencing official docs (use Context7 MCP for up-to-date information where applicable). For Vite-based React apps, include Tailwind 4 plugin. For mobile apps using JS/TS, strongly recommend CapacitorJS unless contraindicated. List of Epics: High-level groupings of work. List of User Stories: As-is stat

you are my AI Prompt Engineering Assistant. You are tasked with helping me make a back and forth conversational way to create a PRD for getting started on a new greenfield project. the prompts should help produce a PRD that has a set of specific parts.

Problem Statement Ideal Avatar (Customer) Elevator Pitch Executive Summary Technical Summary Technical Stack List of Epics List of User Stories

Step 1: Feature Breakdown and Decomposition

Start by decomposing your high-level features into smaller, manageable tasks or sub-features. This creates a granular view, making it easier to spot dependencies later. Use a structured approach like Work Breakdown Structure (WBS) from project management.

  • List all features: Write down each major feature you want to implement (e.g., Feature A: User Authentication; Feature B: Payment Processing; Feature C: UI Dashboard).
  • Break into sub-tasks: For each feature, divide it into atomic tasks. Focus on:
    • Functional components (e.g., backend API endpoints, database schemas, frontend components).
    • Non-functional aspects (e.g., error handling, testing, documentation).
    • Example: For "User Authentication":
      • Task 1: Define user model in database.
  • Task 2: Implement login endpoint.

RAG Agent Implementation Plan

Architecture Overview

The RAG Agent will follow the existing modular patterns in the codebase, providing both a dedicated agent routable via the supervisor and standalone tools that any agent can use.

graph TB
    subgraph rag_components [RAG Components]
 RAGAgent[RAGAgent]

Office Hours: Building a PPM Image Drawing Agent

Objective: Add a custom AI agent that can create PPM images using natural language instructions.

This guide walks through adding a new Image Artist agent to the modular agent supervisor system. The agent will understand human-readable prompts like:

"Draw a PPM image of size 200 by 200, add a square at coordinate 10,10 with a size of 20 pixels in red color, then add 10 circles of varying sizes and colors randomly around the image, and write the file as image.ppm"


#!/bin/bash
if [ "$#" -ne 3 ]; then
echo "Usage: $0 <ORG_NAME> <GITHUB_TOKEN> <MEMBERS_FILE>"
exit 1
fi
ORG_NAME="$1"
GITHUB_TOKEN="$2"
MEMBERS_FILE="$3"

Neo4j Primer: Basics for Complete Beginners

This primer serves as an absolute beginner's introduction to Neo4j, assuming no prior knowledge of databases, graphs, or programming beyond basic computer literacy. It breaks down the foundational concepts into digestible steps, explaining "why" before "how," and using simple analogies. The focus is on pure Neo4j groundwork, with practical, code-driven examples using Python and Cypher. No advanced topics like RAG (Retrieval-Augmented Generation) are covered here—this is just the essentials to get you started.

Structure: One sprint with 4 modules for quick pacing (1-2 hours total). Code uses Python (basic level) and Cypher. If you don't have Python installed, download it from https://www.python.org/downloads/ and follow the installation instructions for your operating system.

Sprint 0: Core Neo4j Concepts and First Steps

Estimated time: 30-45 minutes per module.

Module 1: What is Neo4j and Why Graphs?

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple Calculator</title>
<style>
body {
font-family: Arial, sans-serif;
max-width: 400px;

Epic 4: Modular Code Structure Task List

This task list breaks down Epic 4 for ReplyNow into sequential, actionable steps. Each task includes dependencies (if any), estimated effort (low/medium/high based on complexity in vanilla HTML/CSS/JS), and success criteria. Tasks are grouped by feature for clarity but can be tackled in order. Assume the project setup from Epics 1-3 (e.g., index.html, styles.css, separate JS files like input.js, replyGenerator.js, output.js, and a main.js) is in place. This epic focuses on enforcing modularity and SOLID principles without adding new features—refactor if needed. Use Git for version control—commit after each major task.

Feature 4.1: Module Separation

  1. Create separate JS files for each module
    • Description: Organize code into distinct files for InputModule, ReplyGenerator, OutputModule.
  • Details: If not already done, create input.js, replyGenerator.js, output.js. Move existing code from prior epics into these (e.g., event listeners to input.js,