t-tiger/React-CleanArchitecture-Example

This system is a React-based frontend application structured around Clean Architecture principles, designed to display a list of articles. It implements a layered architecture where a driver fetches data from a local API, a repository transforms the raw JSON into domain models, and a use case orchestrates the logic. The presentation layer then renders these articles using React components, supported by a local mock server for development.

A new ArticleDriver implementation is introduced to fetch articles from the local API endpoint (http://localhost:3000/articles). The driver returns the response as JSON, utilizing the ArticlesJson type from the interface directory.

driver · high confidence

A new mock server has been added to the codebase to provide a local development environment. The server is built with Express and listens on port 3000. It includes a CORS header allowing all origins and serves a JSON endpoint at /articles that returns a list of 100 generated articles. The server also includes a yarn lockfile and error log from the initial setup.

_mock\server · high confidence

Introduced the ArticleRepository implementation that maps raw article data from the ArticleDriver into domain Article and Author objects. The change includes the new repository class and its corresponding unit test, which verifies that the repository correctly transforms the JSON response from the driver into the expected domain model.

repository · high confidence

The repository has been initialized with the core files needed to run the application, including an HTML entry point, a TypeScript configuration enabling JSX and ES5 target, and the main entry script that wires together the use case, repository, and presenter layers. The project also includes a README with setup instructions, a .gitignore file, and an Apache 2.0 license.

(repo-wide) · high confidence

New domain classes have been added to represent the core entities of the system. The \Author\ class encapsulates an author's ID and name, while the \Article\ class represents an article with an ID, name, creation date, and its associated author. The \Article\ class also provides convenience getters to access the author's name and a formatted date string, establishing the foundational data structures for the application's domain layer.

domain · high confidence

Added new React components to the presenter layer to display a list of articles. The \App\ component now manages article fetching via an injected \ArticleUseCase\ and renders the \Articles\ list component. The \Articles\ component iterates over the article data to render individual \ArticleItem\ components, each displaying the article's name, author, and formatted date.

presenter · high confidence

Added the ArticleUseCase implementation and its corresponding test suite. The new use case retrieves articles via the injected ArticleRepository, exposing a fetchArticles method that returns a list of Article domain objects.

useCase · high confidence

New TypeScript interfaces have been introduced to define the contracts for the article domain: ArticleDriver specifies the data shape for fetching articles, ArticleRepository defines the repository contract returning Article entities, and ArticleUseCase specifies the use-case contract for fetching articles. These interfaces establish the boundaries between the interface layer and the domain layer, enabling clearer separation of concerns and easier implementation of the underlying logic.

interface · high confidence

A new mock server was added to the project, introducing dependencies on Express, TypeScript, and related type definitions. The main project's package.json was updated to include Jest for testing, along with supporting libraries like ts-jest and @types/jest. Additionally, the project's build tooling was updated to use Parcel, and the axios dependency was removed in favor of other networking solutions.

(dependencies) · high confidence

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

• CAI 49 → 48 (-0.8)
• Rubric changed (rubric-2026.08.19 → rubric-2026.09.15) — scores are not directly comparable.

• Code Health 100 → 100 (+0.0)
• Architecture 69 → 69 (+0.0)
• Maturity 68 → 68 (+0.0)
• Readiness 21 → 28 (+6.5)
• Security 75 → 60 (-15.0)

• Coverage not included — suite not readable by the collector
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical vulnerability: [GHSA redacted] (yarn.lock)
• Critical vulnerability: [GHSA redacted] (yarn.lock)
• Dependency hygiene not measured — dependency manifest found but not parsed for hygiene
• High CVE: [GHSA redacted] (yarn.lock)
• High CVE: [GHSA redacted] (yarn.lock)
• High CVE: [GHSA redacted] (yarn.lock)
• …and 36 more

• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical CVE: [GHSA redacted] (yarn.lock)
• Critical vulnerability: [GHSA redacted] (yarn.lock)
• Critical vulnerability: [GHSA redacted] (yarn.lock)
• Documentation: no installation or build instructions (README.md)
• Documentation: no usage examples (README.md)
• High CVE: [GHSA redacted] (yarn.lock)
• High CVE: [GHSA redacted] (yarn.lock)
• High CVE: [GHSA redacted] (yarn.lock)
• …and 67 more

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

t-tiger/React-CleanArchitecture-Example was measured the same way every project in this corpus was: the same rubric, at a pinned commit, with the result published in full. Point a surveyor at a repository you know and see whether you agree with it.