nextjs-data-fetcher v0.1.0
Next.js Data Fetcher
A flexible data fetching system for Next.js applications that supports multiple data sources and file types.
Features
- Support for multiple data sources (JSON, CSV, API, custom)
- Server-side and client-side fetching with the same API
- Type-safe with TypeScript
- Caching for improved performance
- HOCs for easy integration with React components
Installation
```bash npm install @yourusername/nextjs-data-fetcher
or
yarn add @yourusername/nextjs-data-fetcher ```
Basic Usage
```tsx import { BaseFetcher, FetcherRegistry, withServerFetching } from '@yourusername/nextjs-data-fetcher';
// Define your data type interface User { id: number; name: string; email: string; }
// Create a fetcher class class UserFetcher extends BaseFetcher { protected type = "users";
constructor() { super({ type: "json", source: "users" }); } }
// Register the fetcher const userFetcher = new UserFetcher(); FetcherRegistry.getInstance().register(userFetcher);
// Create a component to display your data function UserList({ data }: { data: User[] }) { return (
<ul>
{data.map(user => (
<li key={user.id}>{user.name} ({user.email})</li>
))}
</ul>
); }
// Use the HOC for server-side fetching const ServerUserList = withServerFetching(UserList, "users");
// Use in your app export default function Page() { return (
<div>
<h1>Users</h1>
<ServerUserList />
</div>
); } ```
5 months ago