> For the complete documentation index, see [llms.txt](https://docs.debio.network/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.debio.network/developers/front-end/debio-techstack/packages.md).

# Packages

To improve our application’s performance, we made it extensible. Everything from the UI, IPFS connection, and Appchain connection is modular and extensible by other apps to build upon.

### **@debionetwork/ui-icons**

A collection of icons used in DeBio Networks UI apps.

#### ***Installation:***

```jsx
$ npm i @debionetwork/ui-icons
```

#### ***Example:***

```jsx
import { icon } from "@debionetwork/ui-icons"
export default {
	data: () => ({ icon })
}
```

#### ***Repository:***

{% embed url="<https://github.com/debionetwork/ui-icons>" %}

### **@debionetwork/ui-components**

DeBio Ui is a collection of components (vue based) jointly developed by the DeBio team, which is intended to make it easier to develop a project without having to re-create your components repeatedly.

#### ***Installation*****:**

```jsx
$ npm i @debionetwork/ui-components
```

#### ***Example:***

```jsx
import Vue from "vue"
import UiComponents from "@debionetwork/ui-components"
import "@debionetwork/ui-components/dist/debionetwork-ui-components.css"

Vue.use(UiComponents)

new Vue({ 
	UiComponents, // Put here
	render: h => h(App)
)}.$mount("#app")
```

***Repository:***

{% embed url="<https://github.com/debionetwork/ui-components>" %}

### **@debio-network/polkadot-provider**

Javascript Library to connect and interact with the DeBio Network blockchain.

#### ***Installation:***

```jsx
$ npm i @debionetwork/polkadot-provider
```

#### ***Example:***

```jsx
import { queryAccountBalance } from "@debionetwork/polkadot-provider"

export default {
	methods: {
		async getBalance() {
			return await queryAccountBalance(api, address)
			}
	}
}
```

#### ***Repository:***

{% embed url="<https://github.com/debionetwork/polkadot-provider>" %}

### **@debio-network/pinata-ipfs**

A small package to help upload files to IPFS using the Pinata API.

#### ***Installation:***

```jsx
$ npm i @debionetwork/pinata-ipfs
```

#### ***Example:***

```jsx
import { downloadJson } from "@debionetwork/pinata-ipfs"
const ipfsLink = "<https://gateway.pinata.cloud/ipfs/QmWcLKHWqrRB95zQnb4vX8RRgoGsVm5YAUHyZyiAw4mCMQ/>"
const pinataKey = "pinatakey"

const result = await downloadJson(ipfsLink, true, pinataKey)
```

#### ***Repository:***

{% embed url="<https://github.com/debionetwork/pinata-ipfs>" %}