Page: Testimonials

Code: TSTM Route: /testimonials Access: Public Priority: P1 Test Script: scripts/page-tests/test-TSTM.sh Components: src/components/testimonials/index.ts

Purpose

Display student testimonials with filtering by category and course to build trust and social proof.


Connections

Incoming (users arrive from)

Source Trigger Notes
HOME Footer "Testimonials" link Footer navigation
Footer "Testimonials" link All pages
(External) Direct URL /testimonials

Outgoing (users navigate to)

Target Trigger Notes
CBRO "Browse Courses" CTA View courses
SGUP "Get Started" CTA Sign up
CDET Course link on card View course detail

Data Requirements

Entity Fields Used Purpose
course_testimonials id, quote, student_name, student_role, is_featured, created_at, course_id Testimonial display
courses id, title, slug, category_id Course reference
categories id, name Category filtering

Sections

Hero

  • Title: "What Our Students Say"
  • Subtitle: "Real feedback from real learners on their Peerloop journey."

Stats Bar

  • Total testimonials
  • Courses reviewed
  • Average rating (4.8)

Featured Reviews

  • Top 3 featured testimonials
  • Hidden when filters active

Filters

  • Category radio buttons
  • Course radio buttons (filtered by category)
  • Active filter pills

Testimonials Grid

  • Responsive grid
  • Testimonial cards with quote, name, role, course link

CTA Banner

  • "Browse Courses" button
  • "Get Started" button

User Stories Fulfilled

  • US-G009

States & Variations

State Description
Default All testimonials, featured first
Filtered by category Shows only selected category
Filtered by course Shows only selected course
Empty No testimonials match filter
Paginated Multiple pages of results

Mobile Considerations

  • Filter drawer instead of sidebar
  • Single column grid
  • Full-width filter button

Error Handling

Error Display
No testimonials Empty state with "Clear all filters" button
API error Shows empty state

Analytics Events

Event Trigger Data
page_view Page load -
filter_change Filter changed filter_type, value
testimonial_view Card in viewport testimonial_id
cta_click CTA button clicked button_type
course_click Course link clicked course_id

Planned API Calls

Endpoint When Purpose
GET /api/testimonials?featured=false&limit=50 Page load (SSR) All testimonials
GET /api/categories Page load (SSR) Category filter options
GET /api/courses?limit=50 Page load (SSR) Course filter options

Notes

  • Data from course_testimonials D1 table
  • Filterable by course and category
  • Course filter auto-filters based on category selection
  • Client-side filtering after SSR data load
  • Pagination with 12 items per page
  • Featured testimonials shown first (when no filters)

Features

Hero Section

  • Title: "What Our Students Say" [US-G009]
  • Subtitle describing testimonials [US-G009]

Stats Bar

  • Total testimonials count (dynamic) [US-G009]
  • Courses reviewed count (dynamic) [US-G009]
  • Average rating [US-G009] Hardcoded 4.8

Featured Reviews

  • Featured testimonials section (top 3) [US-G009]
  • Only shows when no filters active [US-G009]
  • Larger card styling [US-G009]

Filters

  • Category filter (radio buttons) [US-G009]
  • Course filter (filtered by category) [US-G009]
  • Active filter pills with × to remove [US-G009]
  • "Clear all filters" link [US-G009]
  • Mobile filter drawer [US-G009]

Testimonials Grid

  • Responsive grid (3 → 2 → 1 columns) [US-G009]
  • Testimonial cards with quote, name, role [US-G009]
  • Course link on each card [US-G009]
  • Category label [US-G009]
  • Date display [US-G009]
  • Featured badge [US-G009]

Pagination

  • Previous/Next buttons [US-G009]
  • Page number buttons [US-G009]
  • 12 items per page [US-G009]

Empty State

  • "No testimonials found" message [US-G009]
  • "Clear all filters" button [US-G009]

CTA Section

  • "Ready to Start Your Journey?" heading [US-G009]
  • "Browse Courses" button → /courses [US-G009]
  • "Get Started" button → /signup [US-G009]

Interactive Elements

Buttons: 20/20 active Links: 8/8 active

Buttons

Element Component Action Status
Category radio buttons TestimonialsBrowse Sets category filter active
Course radio buttons TestimonialsBrowse Sets course filter active
Category pill × button TestimonialsBrowse Clears category filter active
Course pill × button TestimonialsBrowse Clears course filter active
"Clear all filters" link TestimonialsBrowse Clears all filters active
Mobile "Filters" button TestimonialsBrowse Opens filter drawer active
Mobile drawer close TestimonialsBrowse Closes drawer active
Mobile "Clear All" TestimonialsBrowse Clears filters active
Mobile "Apply Filters" TestimonialsBrowse Closes drawer active
Pagination buttons TestimonialsBrowse Navigate pages active

Links

Testimonial Cards

Element Target Status
Course title link /courses/{slug} active

CTA Section

Element Target Status
"Browse Courses" /courses active
"Get Started" /signup active

Target Pages Status

Target Page Code Status
/courses CBRO Implemented
/signup SGUP Implemented
/courses/{slug} CDET Implemented

Verification Notes

Verified: 2026-01-07 Consolidated: 2026-01-08

Verified Components

  • src/components/testimonials/TestimonialsBrowse.tsx
  • src/components/testimonials/TestimonialCard.tsx
  • src/pages/testimonials.astro

Screenshots

  • 📷 TSTM-2026-01-07-06-44-23.png - Testimonials page with filters and featured reviews

Notes

  • Page fully functional with filtering and pagination
  • Has 5 testimonials, 4 courses in database
  • Course filter cascades from category selection
  • Featured testimonials shown at top (when no filters)
  • Mobile filter drawer works well
  • Avg rating is hardcoded (4.8)

Test Coverage

Component ✓ Page ○ SSR ✓ API 0/0 ✓ Ready
Script: scripts/page-tests/test-TSTM.sh
Page Test: tests/pages/testimonials.test.tsx
Component Test: tests/components/testimonials/TestimonialsBrowse.test.tsx
SSR Loader Test: tests/ssr/static.test.ts fetchTestimonialsData()

Discrepancies (Spec vs Implementation)

As of 2026-01-08

Planned but Not Implemented

Feature Original Spec Status Priority
Analytics events 5 events (page_view, filter_change, testimonial_view, cta_click, course_click) Not implemented Low

Implemented Differently

Feature Original Spec Reality Note
Average rating Dynamic from data Hardcoded 4.8 Acceptable - would need ratings table

What Our Students Say

Real feedback from real learners on their Peerloop journey.

5
Testimonials
4
Courses Reviewed
4.8
Avg Rating

Featured Reviews

Finally deployed my first real website! The step-by-step process made it feel achievable. I am now building a second site for a client.

A
Amanda L.
Freelancer
Vibe Coding 101Machine Learning
Sep 12, 2024

My team used to spend 10 hours a week on manual data entry. After this course, I automated it all in n8n. Best investment I have made.

D
David R.
Operations Manager
Intro to n8nAI & Product Management
Aug 5, 2024

Guy helped me realize I do not need 15 AI subscriptions. I narrowed down to 3 tools I actually use daily. Saved $200/month and got more productive.

M
Marcus T.
Entrepreneur
AI Tools OverviewAI & Product Management
Jul 20, 2024
5 testimonials
Featured

Finally deployed my first real website! The step-by-step process made it feel achievable. I am now building a second site for a client.

A
Amanda L.
Freelancer
Vibe Coding 101Machine Learning
Sep 12, 2024
Featured

My team used to spend 10 hours a week on manual data entry. After this course, I automated it all in n8n. Best investment I have made.

D
David R.
Operations Manager
Intro to n8nAI & Product Management
Aug 5, 2024
Featured

Guy helped me realize I do not need 15 AI subscriptions. I narrowed down to 3 tools I actually use daily. Saved $200/month and got more productive.

M
Marcus T.
Entrepreneur
AI Tools OverviewAI & Product Management
Jul 20, 2024
Featured

I was drowning in AI tool announcements and felt like I was missing out constantly. This course gave me a framework to think clearly about what I actually need.

S
Sarah M.
Marketing Manager
AI Tools OverviewAI & Product Management
Jun 15, 2024
Featured

I went from zero coding knowledge to building a real website in two sessions. Claude Code is magic, and Guy shows you exactly how to use it.

J
Jennifer K.
Small Business Owner
Intro to Claude CodeAI & Product Management
May 10, 2024

Ready to Start Your Journey?

Join thousands of students learning with personalized 1-on-1 guidance.