Vyriy

Vyriy Preset - Base

Base is a minimal project preset for starting new applications, packages, or workspaces with a calm shared foundation already in place.

The repository intentionally contains configuration and workflow glue instead of product code. Its main entry point is Storybook: it works as both living documentation and a playground for future components, UI states, examples, and integration notes.

Create this example

npm create vyriy@latest

Choose the base (default) preset.

Why Storybook

Storybook is configured from the start so the project has a visible documentation surface before any application-specific structure exists.

Use it to:

  • document project decisions and package APIs with MDX;
  • develop and review future components in isolation;
  • capture component states, variants, and edge cases as stories;
  • build a static documentation site that can be shared or deployed;
  • keep README-driven documentation visible inside the same developer UI.

The root doc.mdx renders this README in Storybook, so the project overview is available both in the repository and in the local documentation playground.

Included Foundation

  • TypeScript configuration from @vyriy/typescript-config.
  • ESLint configuration from @vyriy/eslint-config.
  • Prettier configuration from @vyriy/prettier-config.
  • Jest configuration from @vyriy/jest-config.
  • Storybook configuration from @vyriy/storybook-config.
  • Husky hooks for dependency refresh after branch changes or merges and quality checks before commit or push.

Requirements

  • Node.js >=24.0.0.
  • Yarn 4.16.0.

Install

yarn

Commands

yarn storybook

Starts the local Storybook playground on port 6006.

yarn build

Builds the static Storybook output.

yarn check

Runs the full project validation pipeline: lint, build, and test.

yarn fix

Formats the project and applies available ESLint fixes.

yarn lint

Checks TypeScript, formatting, and ESLint rules.

yarn test

Runs Jest. The command is allowed to pass in an empty preset before tests are added.

Structure

.
├── .storybook/
│   ├── main.ts
│   └── preview.tsx
├── .husky/
├── doc.mdx
├── eslint.config.ts
├── jest.config.ts
├── prettier.config.ts
├── tsconfig.json
└── package.json

Adding Project Code

Add source code where it fits the final project shape, for example under packages/* or workspaces/*. These paths are already included in tsconfig.json.

When adding public components or package APIs, add matching stories or MDX documentation so Storybook remains the first place to inspect behavior, examples, and supported states.

Project Guidance

These articles describe the development approach behind this preset and provide practical guidance for evolving a project on top of it: