workflow-editor README

The project's README from github.com/kargulstudio/workflow-editor. As one markdown file: README.md.

Kargul Starter

Next.js 16 + React 19 + Tailwind CSS 4 boilerplate. Read CONVENTIONS.md before writing any component, section, or page — it is the whole spec for how this repo is built.

Getting started

npm install
npm run dev

Open http://localhost:3000.

Script What it does
npm run dev Start the dev server
npm run build Production build
npm run start Serve the production build
npm run lint ESLint
npm run to:avif Convert an image to AVIF and report its inline cost — rule 11
npm run extract:avif Pull the first frame of every .webm under public/ as a poster
npm run frame:rive Render a still from a .riv file for use as its poster

First things to set on a new project

  1. lib/seo.ts — SITE_NAME, SITE_URL, SITE_DESCRIPTION, SITE_ROUTES. Everything in app/robots.ts, app/sitemap.ts, app/llms.txt/route.ts and every page's metadata derives from these (rule 18). Set NEXT_PUBLIC_SITE_URL in the environment to override the URL per deploy.
  2. app/globals.css — match the @layer base type scale and the --padding-section-* tokens to the design before building anything (rules 1 and 3).
  3. app/opengraph-image.jpg — 1200×630, with an opengraph-image.alt.txt beside it.
  4. Fonts — app/layout.tsx ships Inter + a local Inter Display; swap them for the design's typeface.

Docs

File What's in it
CONVENTIONS.md The build rules. Read first.
AGENTS.md Next.js version notes for agents
OPTIMIZATION.md Why Asset's Rive loading is gated behind LCP, with the measurements

workflow-editor (kargulstudio/workflow-editor)

Searching Database…

Что это?Это стартовый шаблон Next.js, сочетающий Next.js 16, React 19 и Tailwind CSS 4, построенный вокруг строгого набора конвенций сборки, описанных в CONVENTIONS.md.
Это библиотека для установки или стартовый репозиторий, который клонируешь и достраиваешь?Это стартовый/шаблонный репозиторий, на основе которого вы клонируете и строите свой проект, а не пакет, который вы ставите через npm install в существующее приложение.
Как его запустить?Склонируйте репозиторий, затем запустите npm run dev для старта dev-сервера, npm run build для продакшен-сборки и npm run start, чтобы её раздавать.
Что нужно перед тем, как строить на нём?Лишь Node/npm для запуска скриптов — и перед написанием любого компонента, секции или страницы нужно прочитать CONVENTIONS.md, ведь весь репозиторий построен вокруг него.
Можно сразу добавлять компоненты, ничего не читая?Нет — CONVENTIONS.md описывается как полная спецификация того, как устроен репозиторий, поэтому его нужно прочитать, прежде чем трогать любой компонент, секцию или страницу.
Что делает npm run to:avif?Он конвертирует изображение в формат AVIF и сообщает его стоимость в байтах при инлайне, что связано с правилом оптимизации изображений в репозитории (правило 11).
Для чего AGENTS.md?В нём собраны заметки о версиях Next.js, адресованные ИИ-агентам для кодинга, работающим в этом репозитории, отдельно от обращённого к людям CONVENTIONS.md.
Почему Rive-анимация отложена до LCP?В OPTIMIZATION.md приведены замеры, объясняющие, почему Rive-загрузка актива откладывается до момента после Largest Contentful Paint — чтобы не портить производительность страницы.
Size
0.4 MB
Stars
431
Updated
CommitSep 16
Age
1mo
Commits · 90 Days