https://github.com/exercism/react-active-background
https://github.com/exercism/react-active-background
community-contributions-paused
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/exercism/react-active-background
- Owner: exercism
- License: mit
- Created: 2021-04-18T19:54:18.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2024-09-17T06:42:41.000Z (10 months ago)
- Last Synced: 2025-04-29T06:24:14.576Z (2 months ago)
- Topics: community-contributions-paused
- Language: TypeScript
- Size: 148 KB
- Stars: 3
- Watchers: 2
- Forks: 5
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# react-active-background
## Requirements
- `react` >= 16.13.1
- `react-dom` >= 16.13.1
## Usage
Using `create-react-app`'s boiler-plate starter:
```typescript
import * as React from 'react'
import logo from './logo.svg'
import './App.css'
import { ActiveBackground, Confetti } from '@exercism/active-background'
function App() {
return (
)
}
export default App
```
## Extending with your own animation
You can extend the background with your own canvas based animation by creating a class which fulfills the following:
```typescript
export interface IActiveBackgroundPatternConstructor {
new (
canvas: HTMLCanvasElement,
options: ActiveBackgroundPatternOptions
): IActiveBackgroundPattern
}
export interface IActiveBackgroundPattern {
render(): void
start(): void
stop(): void
}
```
## Authors
This library was originally created by @neenjaw. It is maintained by @neenjaw, @sleeplessbyte and the Exercism team. See the [GitHub contributors graph](https://github.com/exercism/react-active-background/graphs/contributors) for a full list of contributors.