next.js snippet

next-js-snippet.js

##Use SWR to call ajax in client site

import useSWR from 'swr'

const fetcher = url => fetch(url, {
    'Content-Type': 'application/json',
}).then(r => r.json());

function Profile() {
  const { data, error } = useSWR('/api/user', fetcher)

  if (error) return <div>failed to load</div>
  if (!data) return <div>loading...</div>
  return <div>hello {data.name}!</div>
}


### Use fetch api from server

import fetch from 'isomorphic-unfetch'

export const getServerSideProps = async (context) => {
    const res = await fetch(`http://localhost:3000/api/products/${context.params.id}`)
    const products = await res.json()
    

    return {props: {...products}}
}