https://github.com/ryohidaka/use-backlog

React Hooks library for Backlog.
https://github.com/ryohidaka/use-backlog

backlog backlog-api

Last synced: 3 months ago
JSON representation

React Hooks library for Backlog.

• Host: GitHub
• URL: https://github.com/ryohidaka/use-backlog
• Owner: ryohidaka
• License: mit
• Created: 2024-04-04T10:27:40.000Z (11 months ago)
• Default Branch: main
• Last Pushed: 2024-09-02T13:39:38.000Z (6 months ago)
• Last Synced: 2024-10-13T11:57:21.016Z (4 months ago)
• Topics: backlog, backlog-api
• Language: TypeScript
• Homepage: https://www.npmjs.com/package/use-backlog
• Size: 354 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Contributing: CONTRIBUTING.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

README

        
# use-backlog

[![npm version](https://badge.fury.io/js/use-backlog.svg)](https://badge.fury.io/js/use-backlog)

![build](https://github.com/ryohidaka/use-backlog/workflows/Build/badge.svg)

[![codecov](https://codecov.io/gh/ryohidaka/use-backlog/graph/badge.svg?token=DCij5i7WBc)](https://codecov.io/gh/ryohidaka/use-backlog)

[![License](https://img.shields.io/badge/license-MIT-blue.svg)](https://opensource.org/licenses/MIT)

[![ko-fi](https://ko-fi.com/img/githubbutton_sm.svg)](https://ko-fi.com/B0B6TVH92)

## Overview

React Hooks library for [Backlog](https://backlog.com/).

## Installation

You can install this library using npm:

```shell

npm install use-backlog

```

## Usage

Wrap your app with the `BacklogProvider` and provide `host` and `apiKey` property.

```tsx

import { BacklogProvider } from "use-backlog";

ReactDOM.render(

  

    

      

    

  ,

  document.getElementById("root"),

);

```

Use the provided hooks to fetch Backlog data:

- useProjects

- useProject

- useIssues

- useIssue

- useMyself

```tsx

import { useBacklog, useProjects } from "use-backlog";

function App() {

  const { setConfig } = useBacklog();

  const { projects, isLoading } = useProjects();

  setConfig?.({ host: "example.com", apiKey: "hogehoge" });

  if (isLoading) {

    return 
Loading...
;

  }

  return (

    <>

      


        {projects?.map((project) => 
{project.name}
)}

      

    >

  );

}


export default App;

```

## API

### Hooks

- `useProjects(params, swrConfig)` - Fetch multiple projects.

- `useProject(projectIdOrKey, swrConfig)` - Get a project.

- `useIssues(params, swrConfig)` - Get a list of issues in a project.

- `useIssue(issueIdOrKey, swrConfig)` - Get a issue.

- `useMyself(swrConfig)` - Get own information about user.

### BacklogProvider

The `BacklogProvider` component should be used to wrap your app.

## Link

- [Backlog](https://backlog.com/)

- [backlog-js](https://github.com/nulab/backlog-js)

- [Docs for Backlog API](https://developer.nulab.com/docs/backlog)

## License

This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.