E2E Test Scoper 2

Status History

May 29, 10:00 PM Pending

Intake Form

budget medium

timeline 1 week

description A simple to-do app with Express and PostgreSQL

Technical Specification

Frontend

Express.js + EJS templating with vanilla JS

Backend

Express.js REST API

Database

PostgreSQL via Neon

Hosting

Render (Node.js)

Summary

A clean, full-stack to-do application built with Express.js and PostgreSQL that supports creating, reading, updating, deleting, and filtering tasks. It uses server-rendered EJS templates enhanced with vanilla JavaScript for a smooth, near-SPA experience without the complexity of a frontend framework. The project is intentionally simple and well-structured, making it an excellent foundation for learning full-stack Node.js development or extending with authentication and additional features.

File Structure

server.js Main Express application entry point, middleware setup, and server initialization

routes/todos.js CRUD route handlers for todo items (GET, POST, PUT, DELETE)

controllers/todoController.js Business logic for todo operations, calls db query functions

db/index.js PostgreSQL connection pool setup using pg library

db/queries.js Parameterized SQL query functions for all todo database operations

db/migrate.js Database migration script to create todos table and seed initial data

views/index.ejs Main page template rendering the todo list and add-todo form

views/partials/todoItem.ejs Reusable EJS partial for rendering a single todo list item

views/partials/header.ejs Shared HTML head and navigation partial

public/css/style.css Application styles including layout, todo list, and form styling

public/js/app.js Client-side JS for inline editing, checkbox toggling, and delete confirmations without full page reload

.env Environment variables: DATABASE_URL, PORT, NODE_ENV

.env.example Template of required environment variables for onboarding

package.json Project metadata, dependencies (express, pg, ejs, dotenv), and npm scripts

README.md Setup instructions, environment configuration, and deployment guide

Features (7)

View All Todos P1

Display a list of all todo items fetched from the PostgreSQL database on the main page.

All todos are displayed on page load ordered by creation date descending
Each todo shows its title, completion status, and creation timestamp
Completed todos are visually distinguished from incomplete ones (e.g. strikethrough)
Empty state message is shown when no todos exist

Create Todo P1

Allow users to add a new todo item via a form on the main page.

A text input and submit button are present on the main page
Submitting the form with a non-empty title creates a new todo in the database
New todo appears in the list immediately after creation
Submitting an empty title shows a validation error and does not create a record
Title is trimmed of whitespace before saving

Mark Todo Complete/Incomplete P2

Allow users to toggle the completion status of any todo item.

Each todo has a checkbox reflecting its current completed status
Clicking the checkbox toggles the completed field in the database
UI updates immediately to reflect the new state without a full page reload
Toggling updates the updated_at timestamp in the database

Edit Todo P2

Allow users to update the title of an existing todo item inline.

Clicking an edit button or double-clicking the title enables an inline edit input
Saving the edit updates the title in the database
Pressing Escape cancels the edit and restores the original title
Empty or whitespace-only titles are rejected with a validation message
Updated_at timestamp is refreshed on successful edit

Delete Todo P2

Allow users to permanently remove a todo item from the list.

Each todo has a delete button
Clicking delete shows a confirmation prompt before removing the item
Confirmed deletion removes the record from the database and the item from the UI
A success or error notification is shown after the operation

Filter Todos P3

Allow users to filter the todo list by status: All, Active, or Completed.

Three filter tabs or buttons are displayed: All, Active, Completed
Selecting a filter updates the displayed list to match the selected status
Active filter tab is visually highlighted
Filter state persists across page interactions via query parameter in the URL

Database Persistence & Migration P1

Set up the PostgreSQL schema and ensure all data is durably persisted.

Running the migrate script creates the todos table if it does not exist
Todos table includes id (serial primary key), title (text not null), completed (boolean default false), created_at, and updated_at columns
All CRUD operations use parameterized queries to prevent SQL injection
Database connection uses a connection pool for efficiency

Build Log

scoping Starting AI-powered tech spec generation

scoping Tech spec generated successfully

start Build orchestration started for project 11

attempt Build attempt 1/3

scoping Tech spec generated successfully

start Build orchestration started for project 11

attempt Build attempt 1/3

generate Attempt 1 failed: AI generation failed: Unterminated string in JSON at position 44882 failed

retry Retrying (2/3)...

attempt Build attempt 2/3

generate Attempt 2 failed: AI generation failed: 429 Daily token limit reached (100,000 tokens). Resets at midnight UTC. failed

retry Retrying (3/3)...

attempt Build attempt 3/3

generate Attempt 3 failed: AI generation failed: 429 Daily token limit reached (100,000 tokens). Resets at midnight UTC. failed

complete Build failed after 3 attempts failed

status Project status updated to Build Failed

Deliverables

📦

Deliverables become available once project reaches Review status.