Skip to main content

Javascript snippets

  • np - nextPage
  • npssp - nextPageServerSideProps
  • npsp - nextPageStaticProps
  • npspth - nextPageStaticPaths
  • nssp - nextServerSideProps
  • nsp - nextStaticProps
  • nspth - nextStaticPaths
  • nip - nextInitialProps
  • nimg - nextImage
  • napp - nextApp
  • ndoc - nextDocument
  • napi - nextApi
  • nmid - nextMiddleware

np - nextPage​

const FileName = ({}) => {
  return <div></div>
}

export default FileName

npssp - nextPageServerSideProps​

const FileName = ({}) => {
  return <div></div>
}

export const getServerSideProps = async (ctx) => {
  return {
    props: {}
  }
}

export default FileName

npsp - nextPageStaticProps​

const FileName = ({}) => {
  return <div></div>
}

export const getStaticProps = async (ctx) => {
  return {
    props: {},
  }
}

export default FileName

npspth - nextPageStaticPaths​

const FileName = ({}) => {
  return <div></div>
}

export const getStaticPaths = async () => {
  return {
    paths: [],
    fallback: false,
  }
}

export default FileName

nssp - nextServerSideProps​

export const getServerSideProps = async (ctx) => {
  return {
    props: {}
  }
}

nsp - nextStaticProps​

export const getStaticProps = async (ctx) => {
  return {
    props: {},
  }
}

nspth - nextStaticPaths​

export const getStaticPaths = async () => {
  return {
    paths: [],
    fallback: false,
  }
}

nip - nextInitialProps​

FileName.getInitialProps = async (ctx) => {
  return {
    
  }
}

nimg - nextImage​

<Image src="" alt="" />

napp - nextApp​

export default function MyApp({ Component, pageProps }) {
  return <Component {...pageProps} />
}

ndoc - nextDocument​

import Document, { Html, Head, Main, NextScript } from 'next/document'

class MyDocument extends Document {
  static async getInitialProps(ctx) {
    const initialProps = await Document.getInitialProps(ctx)
    return { ...initialProps }
  }

  render() {
    return (
      <Html>
        <Head />
        <body>
          <Main />
          <NextScript />
        </body>
      </Html>
    );
  }
}

export default MyDocument

napi - nextApi​

export default async function handler(req, res) {
  
}

nmid - nextMiddleware​

import { NextResponse } from 'next/server'
export async function middleware(request) {
  
}

export const config = {
  matcher: '/about/:path*',
}