typescript-style

Sử dụng khi chỉnh sửa các tệp TypeScript hoặc React và tuân thủ các quy ước về trình biên dịch và ESLint của repo này.

npx skills add https://github.com/contentstack/kickstart-next-ssr --skill typescript-style

TypeScript style – kickstart-next-ssr

When to use

  • Adding or changing .ts / .tsx files
  • Deciding server vs client components or public env usage
  • Aligning with ESLint rules for this project

Instructions

Compiler

  • tsconfig.json enables strict, noEmit, jsx: "react-jsx", moduleResolution: "bundler", and the Next.js TypeScript plugin.
  • Path alias: @/* maps to the repository root (e.g. @/lib/contentstack, @/components/ContentstackLivePreview).

React / Next.js boundaries

  • Server Components are the default. Use the "use client" directive only when you need hooks, browser APIs, or client-only SDK init—see components/ContentstackLivePreview.tsx.
  • Async server components are used in app/page.tsx (searchParams as a Promise per Next.js 16 patterns).

ESLint

  • .eslintrc.json extends next/core-web-vitals and next/typescript.
  • @typescript-eslint/no-explicit-any is off; prefer proper types from the SDK or lib/types.ts when practical.

Env types

  • Browser-exposed configuration uses NEXT_PUBLIC_* only. Do not assume secret server-only env vars exist unless you add them explicitly and document them.

Thêm skills từ contentstack

cms-assets
contentstack
Hướng dẫn các nhà phát triển cách tổ chức, phân phối và chuyển đổi tài nguyên trong Contentstack. Bao gồm cấu trúc thư mục, các phép chuyển đổi của Image Delivery API, xuất bản…
cms-branches-aliases
contentstack
Tư vấn cho nhà phát triển về cách sử dụng Contentstack branches để phát triển nội dung độc lập và aliases để triển khai nội dung không gián đoạn. Bao gồm chiến lược branch,…
cms-data-modeling-best-practices
contentstack
Hướng dẫn các nhà phát triển mô hình hóa nội dung trong Contentstack bằng cấu trúc tái sử dụng đơn giản nhất. Kỹ năng này giải thích khi nào nên sử dụng loại nội dung, tham chiếu, toàn cục…
cms-live-preview-visual-builder-support-assistant
contentstack
Chẩn đoán và hướng dẫn triển khai Contentstack Live Preview và Visual Builder. Theo dõi ngữ cảnh xem trước, xác định hợp đồng bị hỏng, và đề xuất…
cms-releases
contentstack
Tư vấn cho nhà phát triển về cách sử dụng Contentstack Releases để triển khai nội dung đồng bộ và nguyên tử. Bao gồm tạo bản phát hành, quản lý mục, triển khai theo giai đoạn,…
cms-roles-permissions
contentstack
Tư vấn cho các nhà phát triển về việc thiết kế vai trò, quyền hạn, nhóm và quyền truy cập token trong Contentstack. Giải thích vai trò tích hợp sẵn, vai trò tùy chỉnh, việc hợp nhất quyền hạn,…
cms-taxonomy
contentstack
Tư vấn cho nhà phát triển về cách sử dụng Contentstack Taxonomy để phân loại nội dung có cấu trúc, phân cấp và lọc phía phân phối. Bao gồm sự khác biệt giữa taxonomy và tags,…
cms-tokens-authentication
contentstack
Tư vấn cho nhà phát triển cách chọn phương thức xác thực Contentstack và loại token phù hợp cho các trường hợp sử dụng frontend, backend, tự động hóa và ứng dụng bên thứ ba.…