sales-crm README

The project's README from github.com/kargulstudio/sales-crm. 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

sales-crm (kargulstudio/sales-crm)

Searching Database…

1.8K ·GitHub
Sales-crm
Что это?Kargul Starter — шаблон для создания веб-проектов на Next.js 16, React 19 и Tailwind CSS 4 со строгим набором конвенций сборки.
Это готовое приложение или стартовый шаблон, на котором я строю своё?Это стартовый шаблон (boilerplate), а не законченное приложение. Вы клонируете его и строите поверх свой проект, следуя правилам из CONVENTIONS.md, который служит полной спецификацией того, как должны строиться компоненты, секции и страницы.
Как его запустить?Выполните npm run dev, чтобы запустить dev-сервер, npm run build для продакшн-сборки и npm run start, чтобы её обслуживать. npm run lint запускает ESLint.
На чём он построен?Стек — Next.js 16, React 19 и Tailwind CSS 4, плюс настроенный ESLint для линтинга.
Есть ли подвох, прежде чем я начну его кастомизировать?Предполагается, что вы прочтёте CONVENTIONS.md, прежде чем писать любой компонент, секцию или страницу — он определяет всю спецификацию дизайн-системы (токены раскладки, типографическую шкалу и т.д.), которой следует весь остальной репозиторий.
Что нужно настроить в первую очередь в новом проекте?Задайте SITENAME, SITEURL, SITEDESCRIPTION и SITEROUTES в lib/seo.ts (из них выводится всё в robots.ts, sitemap.ts и метаданных страниц), подгоните типографическую шкалу и токены отступов в app/globals.css под свой дизайн, добавьте app/opengraph-image.jpg размером 1200x630 с файлом alt-текста и замените шрифты Inter по умолчанию.
Для чего нужны npm-скрипты avif и rive?npm run to:avif конвертирует изображение в AVIF и показывает, сколько оно добавит к инлайновому размеру, npm run extract:avif вытягивает кадр-постер из .webm-видео в public/, а npm run frame:rive рендерит статичную постерную картинку из файла Rive-анимации .riv.
Что находится в AGENTS.md и OPTIMIZATION.md?AGENTS.md содержит заметки о версиях Next.js для кодинг-агентов, работающих в репозитории, а OPTIMIZATION.md объясняет (с замерами), почему загрузка ресурсов Rive привязана к событию LCP страницы.
What are similar projects?workflow-editor, Next-js-Boilerplate, saas-starter, tailwind-nextjs-starter-blog, arc-library, NotionNext, react-starter-kit, rare-ui
Which topics is it in?design-tokens, images, performance-optimization, javascript-framework, starter-kit, eslint, fonts, seo, boilerplate, reactjs, template, tailwindcss
Creator
kargulstudio
Size
1.4 MB
Stars
1.8K
Updated
CommitOct 06
Age
16d
Commits · 90 Days