GitHubStarCount
Display a GitHub star button in your React application.
Overview
The GitHubStarCount component displays a GitHub star button for your repository, allowing users to easily star your repository and showing the current star count.
This component is useful for promoting your GitHub repository and tracking user engagement.
Usage
To use the GitHubStarCount component, you need to import it and include it in your application:
import { GitHubStarCount } from 'react-mower';
function App() {
return (
<div>
<h1>My App</h1>
<GitHubStarCount githubStar="username/repo" />
</div>
);
}Make sure to replace username/repo with your GitHub repository path.
Props
| Prop | Type | Description | Required |
|---|---|---|---|
| githubStar | string | The GitHub repository path in the format "username/repo" | Yes |
Example
Here's a complete example of how to use the GitHubStarCount component in a React application:
import React from 'react';
import { GitHubStarCount } from 'react-mower';
function App() {
return (
<div className="App">
<header className="App-header">
<h1>My Awesome React App</h1>
<p>Check out our GitHub repository and give us a star!</p>
<GitHubStarCount githubStar="jasurhaydarovcode/react-mower" />
</header>
<main>
<div className="content">
<h2>Welcome to My App</h2>
<p>This is a sample application using React Mower's GitHubStarCount component.</p>
</div>
</main>
<footer>
<p>© 2025 My App. All rights reserved.</p>
</footer>
</div>
);
}
export default App;Additional Information
The GitHubStarCount component fetches the star count from the GitHub API and displays it alongside a star button. When users click the button, they will be redirected to the GitHub repository page where they can star the repository.
Note that the star count is updated periodically and may not reflect the most recent count immediately.