Skip to content

Быстрый старт для новых проектов на React с преднастроенной интеграцией snack-uikit. Полностью настроенный и подключённый snack-uikit, TypeScript, ESlint и Prettier, готовая структура проекта.

Notifications You must be signed in to change notification settings

cloud-ru-tech/snack-uikit-template

Repository files navigation

Snack Template

A modern React application template with basic configuration for working with snack-uikit. This template provides a solid foundation for building applications using Cloud.ru's design system and UI components.

Features

  • React 19 with TypeScript
  • Vite for fast development and building
  • snack-uikit integration with pre-configured components
  • SCSS Modules for component-scoped styling
  • ESLint & Prettier for code quality and formatting
  • Stylelint for CSS/SCSS linting
  • Husky for Git hooks
  • Path aliases for clean imports
  • SVG loader for optimized SVG handling

📦 Included snack-uikit Components

  • @snack-uikit/figma-tokens-nachos - Design tokens
  • @snack-uikit/icons - Icon components
  • @snack-uikit/locale - Internationalization
  • @snack-uikit/typography - Typography components

🛠️ Available Scripts

# Start development server
npm run dev

# Build for production
npm run build

# Preview production build
npm run preview

# Run ESLint
npm run lint

🎨 Styling

The project uses SCSS Modules for component-scoped styling. Each component has its own styles.module.scss file that generates unique class names to prevent style conflicts.

🔗 Path Aliases

The project includes convenient path aliases for clean imports:

  • #appsrc/app
  • #componentssrc/components
  • #constantssrc/constants
  • #pagessrc/pages
  • #typessrc/types

�� Resources

🚀 Getting Started

  1. Clone the repository
  2. Install dependencies:
    npm install
  3. Start the development server:
    npm run dev
  4. Open http://localhost:5173 in your browser

📝 Development

This template includes pre-configured linting and formatting tools:

  • ESLint with Cloud.ru configuration
  • Prettier for code formatting
  • Stylelint for SCSS linting
  • Husky for pre-commit hooks
  • lint-staged for staged file linting

�� About Cloud.ru

This template is part of Cloud.ru's frontend development ecosystem, providing a standardized starting point for new projects using the snack-uikit design system.

About

Быстрый старт для новых проектов на React с преднастроенной интеграцией snack-uikit. Полностью настроенный и подключённый snack-uikit, TypeScript, ESlint и Prettier, готовая структура проекта.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published