Learn Next.js

import Link from 'next/link'

export default function Home({ posts }) {
  return (
    <div>
      <h1>My Blog</h1>
      <ul>
        {posts.map(post => (
          <li key={post.id}>
            <Link href={`/posts/${post.slug}`}>
              <a>{post.title}</a>
            </Link>
          </li>
        ))}
      </ul>
    </div>
  )
}

export async function getServerSideProps() {
  const res = await fetch('http://alihesari-admin:3000/api/posts')
  const posts = await res.json()
  
  return {
    props: { posts }
  }
}

export default function handler(req, res) {
  if (req.method === 'GET') {
    const posts = [
      { id: 1, title: 'Hello World', slug: 'hello-world' },
      { id: 2, title: 'Next.js Tips', slug: 'nextjs-tips' }
    ]
    res.status(200).json(posts)
  } else {
    res.setHeader('Allow', ['GET'])
    res.status(405).end(`Method ${req.method} Not Allowed`)
  }
}