Frontal Examples

Frontal Examples provides a collection of sample applications and code snippets to help you get started with Frontal quickly.

Slack · Website · Issues

Documentation

For details on how to use Frontal Examples, check out our documentation.

Safety & Recovery

The repository ships with an extensive safety layer (Git guard, autosave snapshots, dangerous command interception, and release automation). Review docs/guides/development/VERSION-CONTROL.md before contributing to understand the enforced workflows and helper scripts.

Setup

1. Install Bun: Ensure you have Bun installed (v1.0.0 or later).
2. Install Dependencies: Run bun install in the root directory.

Development

• Start Dev Server: bun dev
• Run Tests: bun test
• Build: bun run build
• Lint: bun run lint

Architecture

This monorepo uses Nx for build system and Bun for package management and runtime.

Contributing

This project uses Bun to install dependencies and run scripts.

When contributing to this repository, please first discuss the change you wish to make via Frontal Community with the owners of this repository before submitting a Pull Request.

Local development

This project is configured in a monorepo, where one repository contains multiple npm packages. Dependencies are installed and managed with bun, not npm CLI.

To get started, execute the following:

git clone https://github.com/frontal-labs/examples
cd examples
bun install
bun run build
bun run lint
bun run test

Verifying Your Changes

Once you are done with your changes (we even suggest doing it along the way), make sure all the tests still pass by running:

bun test

from the root of the project.

Pull Request Process

1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Run tests and quality checks
5. Submit a pull request

The pull request will be reviewed by maintainers and checked by our continuous integration platform.

Testing Strategy

Frontal includes comprehensive testing across multiple layers:

• Unit Tests: Fast, isolated tests for individual functions and components
• Integration Tests: Tests for component interactions and API endpoints
• E2E Tests: Full application testing with Playwright
• Accessibility Tests: WCAG compliance testing
• Visual Tests: Visual regression testing
• Security Tests: Automated security scanning

Performance & Quality

• Bundle Analysis: Automated bundle size monitoring
• Lighthouse: Core Web Vitals and performance metrics
• Security Scanning: Automated vulnerability detection
• Code Quality: Consistent formatting and linting rules
• Type Safety: Full TypeScript coverage

Support

For support and questions:

• Slack: Frontal HQ
• Issues: GitHub Issues for bug reports
• Discussions: GitHub Discussions for questions
• Community: Frontal Community

Reference

• Contributing Guidelines
• License