frontend-core

Update Madoc TS frontend routes and SSR entry points.

57|15|Updated Nov 28, 2018
One-click install
npx skills add https://github.com/digirati-co-uk/madoc-platform --skill frontend-core-digirati-co-uk
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: frontend-core
Source: https://github.com/digirati-co-uk/madoc-platform/tree/main/.agents/skills/frontend-core
Command: npx skills add https://github.com/digirati-co-uk/madoc-platform --skill frontend-core-digirati-co-uk

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The Madoc TypeScript frontend consists of separate site and admin React applications with complex routing and server‑side rendering; developers need a clear guide to modify routes, SSR entry points, shared utilities, and component organization without breaking the architecture.

Core Features & Use Cases

  • Route Management: Defines where site and admin routes live and how to add or modify them.
  • SSR Entry Points: Shows the server files for site and admin rendering and how to adjust them.
  • Shared Utilities: Highlights the shared directory for reusable UI helpers and server renderer.
  • Styling Guidelines: Recommends Tailwind over styled‑components for new UI work.
  • Typical Use Cases: Adding a new page to the site app, updating an admin route, or refactoring a shared UI utility.

Quick Start

Guide me through updating a site route in services/madoc-ts/src/frontend/site/routes.tsx.

Frequently Asked Questions about frontend-core

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add a new page to a React site app that uses server-side rendering?

To add a new page to a SSR React site app, define the route in the site routes file and update the corresponding SSR entry point to maintain compatibility with the createServerRenderer utility.

Where do site and admin routes live in a TypeScript frontend project?

Site and admin routes in a TypeScript frontend project live in separate React applications within the services/madoc-ts/src/frontend directory, specifically organized into site and admin route files to keep the architecture decoupled.

What's the best way to style new UI components in a Madoc TypeScript frontend?

The best way to style new UI components in a Madoc TypeScript frontend is using Tailwind, which is recommended over styled-components to ensure consistency across the site and admin React applications.

Can I use shared utilities for both site and admin React applications?

Yes, you can use shared utilities for both site and admin React applications by placing reusable UI helpers and the server renderer in the shared directory, ensuring both apps access the same logic without duplication.

Do I need to update server rendering files when modifying React routes?

Yes, you need to update server rendering files when modifying React routes because the SSR entry points must adjust to route changes to ensure the server correctly renders the updated React components without breaking the architecture.

Why does updating an admin route require changing the SSR entry point?

Updating an admin route requires changing the SSR entry point because the server-side rendering process depends on matching the exact route definitions to pre-render the React components correctly using the createServerRenderer utility.