Menu

1 / 2

I added a CSV contact importer to a shadcn registry

DEV Community: nextjs·aimodels-fyi·2 days ago
#Dm2ekhyd
#devtonextjs#devto#dev#import#csvjetty
Reading 0:00
15s threshold

I build CSVJetty, an embedded CSV importer for React. I’ve published a shadcn registry item that adds a contact-import card and an account-free demo to your project.

The importer handles CSV upload, column mapping, validation, and inline correction. The example expects a name and email, with an optional company field.

The integration source is MIT licensed. The importer interface runs through the hosted CSVJetty service; production use requires an account and public importer key.

Install

In a React or Next.js project with shadcn already configured:

npx shadcn@latest add https://www.csvjetty.com/r/contact-csv-import.json

Enter fullscreen mode

Exit fullscreen mode

The registry declares the csvjetty npm dependency and shadcn Card and Table dependencies.

Try it without an account

For a Next.js App Router page:

"use client" ;

import { ContactCsvImportDemo } from "@/components/contact-csv-import-demo" ;

export default function ContactsPage ( ) { return ( < main className = "mx-auto max-w-3xl p-6" > <…

Continue reading — create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.