Skip to content

Commit

Permalink
updated the example of api-routes to utilize the App Router
Browse files Browse the repository at this point in the history
  • Loading branch information
Sam-Phillemon9493 committed Aug 11, 2024
1 parent 675291c commit 1c57c43
Show file tree
Hide file tree
Showing 9 changed files with 66 additions and 41 deletions.
20 changes: 20 additions & 0 deletions examples/api-routes/app/api/people/[id]/route.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import { NextResponse } from "next/server";
import { people } from "../../../../data";
import type { Person, ResponseError } from "../../../../interfaces";

export async function GET(
request: Request,
{ params }: { params: { id: string } },
): Promise<NextResponse<Person | ResponseError>> {
const { id } = params;
const person = people.find((p) => p.id === id);

if (person) {
return NextResponse.json(person);
} else {
return NextResponse.json(
{ message: `User with id: ${id} not found.` },
{ status: 404 },
);
}
}
7 changes: 7 additions & 0 deletions examples/api-routes/app/api/people/route.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import { NextResponse } from "next/server";
import { people } from "../../../data";
import { Person } from "../../../interfaces";

export async function GET(): Promise<NextResponse<Person[]>> {
return NextResponse.json(people);
}
18 changes: 18 additions & 0 deletions examples/api-routes/app/layout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
import type { Metadata } from "next";

export const metadata: Metadata = {
title: "Home",
description: "Welcome to Next.js",
};

export default function RootLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<html lang="en">
<body>{children}</body>
</html>
);
}
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
"use client";
import useSWR from "swr";
import PersonComponent from "../components/Person";
import type { Person } from "../interfaces";
Expand All @@ -6,7 +7,6 @@ const fetcher = (url: string) => fetch(url).then((res) => res.json());

export default function Index() {
const { data, error, isLoading } = useSWR<Person[]>("/api/people", fetcher);

if (error) return <div>Failed to load</div>;
if (isLoading) return <div>Loading...</div>;
if (!data) return null;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
import { useRouter } from "next/router";
"use client";

import { useParams } from "next/navigation";
import useSWR from "swr";
import type { Person, ResponseError } from "../../interfaces";
import type { Person, ResponseError } from "../../../interfaces";

const fetcher = async (url: string) => {
const res = await fetch(url);
Expand All @@ -13,11 +15,11 @@ const fetcher = async (url: string) => {
};

export default function PersonPage() {
const { query } = useRouter();
const query = useParams();
const { data, error, isLoading, isValidating } = useSWR<
Person,
ResponseError
>(() => (query.id ? `/api/people/${query.id}` : null), fetcher);
>(() => (query?.id ? `/api/people/${query.id}` : null), fetcher);

if (error) return <div>{error.message}</div>;
if (isLoading) return <div>Loading...</div>;
Expand Down
14 changes: 7 additions & 7 deletions examples/api-routes/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,15 @@
"start": "next start"
},
"dependencies": {
"next": "latest",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"next": "^14.2.5",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"swr": "^2.0.0"
},
"devDependencies": {
"@types/node": "^18.0.0",
"@types/react": "^18.0.14",
"@types/react-dom": "^18.0.5",
"typescript": "^4.7.4"
"@types/node": "^22.1.0",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"typescript": "^5.5.4"
}
}
17 changes: 0 additions & 17 deletions examples/api-routes/pages/api/people/[id].ts

This file was deleted.

10 changes: 0 additions & 10 deletions examples/api-routes/pages/api/people/index.ts

This file was deleted.

9 changes: 7 additions & 2 deletions examples/api-routes/tsconfig.json
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,13 @@
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "preserve",
"incremental": true
"incremental": true,
"plugins": [
{
"name": "next"
}
]
},
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
"exclude": ["node_modules"]
}

0 comments on commit 1c57c43

Please sign in to comment.