Remix

Install and configure DWL Components for Remix.

Note: This guide is for Remix. For React Router, see the React Router guide.

Create project

Start by creating a new Remix project using create-remix:


pnpm create remix@latest my-app

Run the CLI

Run the DWL Components init command to set up your project:


pnpm dlx shadcn@latest init

That's it

You can now start adding components to your project.


pnpm dlx shadcn@latest add button

The command above will add the Button component to your project. You can then import it like this:

app/routes/index.tsx

import { Button } from "~/components/ui/button"
 
export default function Home() {
  return (
    <div>
      <Button>Click me</Button>
    </div>
  )
}

React Router Astro

On This Page

Create project Run the CLI That's it

Build with DWL Components

Use the copied registry, charts, blocks, and create tools in one place.

Start from the DWL Components create flow and customize from there.

Remix

Create project#

Run the CLI#

That's it#

Create project

Run the CLI

That's it