Skip to content

Commit

Permalink
Merge pull request #34 from wedinc/feat/migrate-to-app-router-part1
Browse files Browse the repository at this point in the history
Migration part1
  • Loading branch information
ym19851201 authored Dec 4, 2023
2 parents f619e2c + 1d6e0e4 commit 3b02779
Show file tree
Hide file tree
Showing 6 changed files with 86 additions and 59 deletions.
13 changes: 13 additions & 0 deletions app/_components/SignoutButton.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
'use client'

import { signOut } from "next-auth/react"

const SignoutButton = () => {
return (
<button className='btn btn-secondary' onClick={() => signOut()}>
Sign out
</button>
)
}

export default SignoutButton
30 changes: 30 additions & 0 deletions app/caramel/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
import ListItem, { ListItemProps } from '@/components/ListItem'
import Link from 'next/link'
import SignoutButton from '../_components/SignoutButton'

export default async function Caramel() {
const res = await fetch('https://hacker-news.firebaseio.com/v0/newstories.json')
const ids: number[] = await res.json()

const slicedIds = ids.slice(0, 10)
const articles = await Promise.all(slicedIds.map(async (id) => {
const res = await fetch(`https://hacker-news.firebaseio.com/v0/item/${id}.json`)
return await res.json() as ListItemProps
}))

return (
<div className='bg-[#bc611e] p-8'>
<h1 className='text-3xl font-bold underline text-gray-300'>Hello Caramel!</h1>
<Link href='/' className='btn btn-primary'>
Back
</Link>
<ul className='flex flex-col gap-4 w-1/3'>
{articles.map((article) => {
const newArticle = { ...article, title: article.title.repeat(2) }
return <ListItem {...newArticle} key={newArticle.title} className='h-36' />
})}
</ul>
<SignoutButton />
</div>
)
}
18 changes: 18 additions & 0 deletions app/layout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
export const metadata = {
title: 'Next.js',
description: 'Generated by Next.js',
}

import '../styles/globals.css'

export default function RootLayout({
children,
}: {
children: React.ReactNode
}) {
return (
<html lang="en">
<body>{children}</body>
</html>
)
}
7 changes: 2 additions & 5 deletions pages/index.tsx → app/page.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import Link from 'next/link'
import { signOut } from 'next-auth/react'
import SignoutButton from './_components/SignoutButton'

export default function Home() {
return (
Expand All @@ -8,10 +8,7 @@ export default function Home() {
<Link href='/caramel' className='btn btn-primary'>
Caramel
</Link>

<button className='btn btn-secondary' onClick={() => signOut()}>
Sign out
</button>
<SignoutButton />
</>
)
}
49 changes: 0 additions & 49 deletions pages/caramel/index.tsx

This file was deleted.

28 changes: 23 additions & 5 deletions tsconfig.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,11 @@
{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"strict": true,
Expand All @@ -16,9 +20,23 @@
"incremental": true,
"baseUrl": ".",
"paths": {
"@/*": ["./*"]
}
"@/*": [
"./*"
]
},
"plugins": [
{
"name": "next"
}
]
},
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
"exclude": ["node_modules"]
"include": [
"next-env.d.ts",
"**/*.ts",
"**/*.tsx",
".next/types/**/*.ts"
],
"exclude": [
"node_modules"
]
}

0 comments on commit 3b02779

Please sign in to comment.