# Quality Guidelines

> Frontend quality constraints for JSP/CSS pages.

---

## Overview

Frontend work should implement JSP/CSS pages that match the approved
image-first design and preserve the Servlet/JSP layered architecture.

---

## Image-To-JSP Workflow

1. Design or generate the UI as images first.
2. Use the approved image as the visual reference for JSP/CSS implementation.
3. Restore layout, spacing, typography, color, table density, and form states
   faithfully in JSP/CSS.
4. Preserve the image assets or references in the application assets area once
   the source tree exists.
5. Compare the implemented page against the source image before considering UI
   work complete.

---

## Required Patterns

- JSP pages focus on display and user interaction.
- Forms submit to Servlet controllers and render server-provided validation
  messages.
- Tables and reports support scanning for books, readers, borrowing records,
  rankings, inventory, overdue data, and system logs.
- Navigation should reflect role permissions for administrator, librarian, and
  reader users.
- Keep CSS and small scripts in static assets rather than inline unless there
  is a local reason.

---

## Forbidden Patterns

- Do not introduce React, Vue, SPA routing, hook/state conventions, or
  TypeScript tooling without an explicit stack change.
- Do not implement UI only from text descriptions when an approved image
  reference exists.
- Do not put SQL, DAO calls, or business workflows in JSP pages.
- Do not rely only on browser validation for protected workflows.

---

## Review Checklist

- Does the JSP/CSS page visibly match the approved image design?
- Are forms, tables, empty states, errors, and permission-specific navigation
  handled?
- Are JSPs rendered through Servlet controllers where access control or page
  data is required?
- Are accessibility basics preserved with labels, headings, focus order, and
  readable contrast?