skills.rest
TencentBlueKing
TencentBlueKingOFFICIAL
Explore all skills by this author →
WebsiteGitHub

bklog-coding-patterns

Define coding patterns for BKLog frontend modules with kebab-case directory mappings.

88|138|Updated Oct 26, 2023
Search Tags:#code-quality#naming-conventions#ui-patterns#coding-patterns#frontend-architecture#module-structure#bklog
One-click install
npx skills add https://github.com/TencentBlueKing/bk-monitor --skill bklog-coding-patterns
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: bklog-coding-patterns
Source: https://github.com/TencentBlueKing/bk-monitor/tree/main/bklog/web/.ai-shared/skills/bklog-coding-patterns
Command: npx skills add https://github.com/TencentBlueKing/bk-monitor --skill bklog-coding-patterns

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Help teams maintain consistent coding style, naming and directory structure for BKLog frontend projects, reducing communication friction and rework.

Core Features & Use Cases

  • Unified naming conventions
  • Clear directory mappings for views, components, hooks, store, and services
  • Change impact and boundary guidance to support scalable UI development

Quick Start

Create a new module under bklog-web following the coding-patterns: establish src/views/, src/components/, src/hooks/, src/store/, src/services/ with kebab-case directory names.

Frequently Asked Questions about bklog-coding-patterns

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

FAQPage Schema
How do I enforce naming conventions and directory structure for frontend modules?▼

Enforce naming conventions and directory structure by applying kebab-case file naming to views, components, hooks, store, and services. This maintains consistent UI development and reduces rework across frontend projects.

What is the best way to organize frontend architecture for scalable UI development?▼

Organize frontend architecture by mapping directories to views, components, hooks, store, and services with kebab-case naming. Defining clear change boundaries and module structure supports scalable UI development.

Do I need to use kebab-case for all files in a frontend module structure?▼

Yes, kebab-case is required for directory and file naming across views, components, hooks, store, and services. This standardizes frontend module structure and ensures consistent directory mappings.

Can I use these coding patterns to define change boundaries for existing components?▼

Yes, these coding patterns define change impact and boundary guidance for existing views, components, hooks, store, and services. Mapping these boundaries helps manage dependencies and supports scalable UI development.

How do I start a new module following standard coding patterns for frontend architecture?▼

Start a new module by creating src/views/, src/components/, src/hooks/, src/store/, and src/services/ directories. Apply kebab-case naming to establish a consistent module structure following standard coding patterns.

Related Skills

Explore More Software Engineering Skills→
OreStudioOreStudio
25

component-creator

Generate ORE Studio component directory layouts and build configurations.

Official
Advanced
dd-xiaozhidd-xiaozhi
2

fitness-run

Execute structural fitness functions to validate layer boundaries and OpenAPI contracts.

Community
Advanced
JamkrisJamkris
86

frontend-patterns

Apply React and Next.js frontend patterns via reusable TypeScript components and hooks.

Community
Advanced
cjdutoitcjdutoit
3

the-standard-code-csharp

Validate C# source code for style rules, naming conventions, and comment formatting.

Community
Basic