Getting Started

Install dependencies

npm i @filenest/adapter-nextjs @filenest/provider-uploadthing

Feel free to choose any other adapter or provider of your choice by replacing adapter-nextjs or provider-uploadthing with the corresponding package names.

Instantiate a provider

Instantiate your provider of choice anywhere in your server code. This example is using uploadthing.

import { UploadThing } from "@filenest/provider-uploadthing"
 
const provider = new UploadThing({
  UPLOADTHING_TOKEN: process.env.UPLOADTHING_TOKEN!,
})

See the docs of your provider to know what config you need to pass it.

Initialize an adapter

• Next.js App Router
• tRPC

Install dependencies

npm i @filenest/adapter-nextjs @filenest/react

Create Filenest Components

Create your component anywhere in your app using createFilenestComponents and pass it the client imported from your adapter package.

That import follows the convention: import { client } from "@filenest/adapter-<name>/client"

You also need to tell Filenest the base endpoint for all Filenest API routes.

import { createFilenestComponents } from "@filenest/react"
import { client } from "@filenest/adapter-nextjs/client"
 
export const FileBrowser = () => {
  const Filenest = createFilenestComponents({
    endpoint: "/api/filenest", // or something like https://api.example.com/filenest
    client,
  })
 
  return (
    <Filenest.Root>
      {/* The rest of your component */}
    </Filenest.Root>
  )
}

Build your UI

Now all that's left to do is build your UI.
You can take a look at a minimal setup guide or check out a complete demo.
There is also documentation about individual components here.