Thank you for your interest in contributing to Smart TV! This document provides guidelines and instructions for contributing to this project.
- Code of Conduct
- Getting Started
- Development Setup
- Project Structure
- How to Contribute
- Development Workflow
- Coding Standards
- Testing
- Pull Request Process
- Release Process
- Community
This project and everyone participating in it is governed by our Code of Conduct. By participating, you are expected to uphold this code. Please report unacceptable behavior to the project maintainers.
- Node.js: >= 18.x
- pnpm: 8.15.6 (Package manager)
- Basic understanding of:
- React and TypeScript
- Smart TV development concepts
- Monorepo architecture (Turborepo)
-
Fork the repository on GitHub
-
Clone your fork:
git clone https://github.com/YOUR_USERNAME/smart-tv.git cd smart-tv -
Add upstream remote:
git remote add upstream https://github.com/smarttv-dev/smart-tv.git
-
Install dependencies:
pnpm install
-
Build all packages:
pnpm build
-
Start development:
pnpm dev
This is a monorepo managed with Turborepo and pnpm workspaces.
smart-tv/
├── apps/
│ ├── docs/ # Documentation site
├── packages/
│ ├── create-smart-tv/ # CLI tool for scaffolding (publishable)
│ ├── player/ # Video player component (publishable)
│ ├── query/ # Data fetching utilities (publishable)
│ ├── ui/ # Shared UI components
│ ├── eslint-config/ # Shared ESLint configurations
│ ├── typescript-config/ # Shared TypeScript configurations
│ └── tailwind-config/ # Shared Tailwind configurations
The following packages are published to npm:
@smart-tv/player- Video player with Shaka Player integration@smart-tv/query- Data fetching and caching utilitiescreate-smart-tv-app- CLI tool for creating Smart TV apps
Before creating bug reports, please check the issue tracker as you might find that you don't need to create one.
When creating a bug report, include:
- Clear title and description
- Steps to reproduce the behavior
- Expected vs actual behavior
- Screenshots if applicable
- Environment details (OS, Node version, browser)
- Additional context or logs
Enhancement suggestions are tracked as GitHub issues. When creating an enhancement suggestion:
- Use a clear and descriptive title
- Provide a detailed description of the suggested enhancement
- Explain why this enhancement would be useful
- List any alternatives you've considered
Unsure where to begin? Look for issues labeled:
good first issue- Good for newcomershelp wanted- Extra attention neededdocumentation- Documentation improvements
Always create a new branch for your work:
git checkout -b feature/your-feature-name
# or
git checkout -b fix/your-bug-fixBranch naming conventions:
feature/- New featuresfix/- Bug fixesdocs/- Documentation changesrefactor/- Code refactoringtest/- Test additions or modificationschore/- Maintenance tasks
- Write clean, readable code
- Follow the coding standards
- Add tests for new features
- Update documentation as needed
# Type checking
pnpm check-types
# Linting
pnpm lint
# Build all packages
pnpm build
# Test in demo app
cd apps/demo
pnpm devWe follow Conventional Commits:
git commit -m "feat(player): add subtitle support"
git commit -m "fix(query): resolve cache invalidation issue"
git commit -m "docs: update installation instructions"Commit types:
feat: New featurefix: Bug fixdocs: Documentation changesstyle: Code style changes (formatting)refactor: Code refactoringtest: Test additions or modificationschore: Maintenance tasksperf: Performance improvements
git push origin your-branch-nameThen create a pull request on GitHub.
- Use TypeScript for all new code
- Enable strict mode
- Avoid
anytypes when possible - Export types/interfaces for public APIs
- Use functional components with hooks
- Follow React best practices
- Use meaningful component and prop names
- Add JSDoc comments for complex components
We use ESLint and Prettier for code formatting:
# Check linting
pnpm lint
# Format code
pnpm format- Components:
PascalCase.tsx - Utilities:
camelCase.ts - Hooks:
useCamelCase.ts - Types:
types.tsorComponentName.types.ts
- External dependencies
- Internal packages
- Relative imports
- Types
- Styles
import React from "react";
import { SomeExternalLib } from "external-lib";
import { useQuery } from "@smart-tv/query";
import { Button } from "@smart-tv/ui";
import { localUtil } from "./utils";
import type { Props } from "./types";
import "./styles.css";# Run all tests
pnpm test
# Run tests for specific package
cd packages/player
pnpm test- Write tests for all new features
- Aim for high code coverage
- Test edge cases and error scenarios
- Use descriptive test names
- Code follows project style guidelines
- Self-review completed
- Comments added for complex code
- Documentation updated
- Tests added/updated
- All tests pass
- No TypeScript errors
- Builds successfully
## Description
Brief description of changes
## Type of Change
- [ ] Bug fix
- [ ] New feature
- [ ] Breaking change
- [ ] Documentation update
## Related Issues
Closes #(issue number)
## Testing
Describe how you tested your changes
## Screenshots (if applicable)
## Checklist
- [ ] Code follows style guidelines
- [ ] Self-review completed
- [ ] Tests added
- [ ] Documentation updated- At least one maintainer review required
- All CI checks must pass
- Resolve all review comments
- Keep PR focused and small when possible
- Rebase on main if needed
Releases are managed by maintainers. The process:
- Version Bump: Update package versions
- Changelog: Update CHANGELOG.md
- Build: Build all packages
- Test: Run full test suite
- Publish: Publish to npm
- Tag: Create git tag
- Release Notes: Create GitHub release
We follow Semantic Versioning:
- MAJOR: Breaking changes
- MINOR: New features (backward compatible)
- PATCH: Bug fixes (backward compatible)
- Use GitHub Issues for bugs and feature requests
- Use GitHub Discussions for questions and general discussion
- Be respectful and constructive in all interactions
Contributors will be recognized in:
- CHANGELOG.md
- Release notes
- Contributors page (when available)
By contributing to Smart TV, you agree that your contributions will be licensed under the BSD 3-Clause License.
Thank you for contributing to Smart TV! 🎉