Blog

The Blog theme is powered by Nextra, if you want to know more about how to use it, you can check the official documentation (opens in a new tab).

Now, Let's create an entire blog with a few clicks.

First you have add some packages to your project and some folders to your project, you can do this by running the following command:

terminal

pnpm add nextra nextra-theme-blog
cd src
mkdir pages
touch blog.mdx

In the next.config.mjs file in your project’s root directory, replace the following code:

next.config.mjs

/** @type {import('next').NextConfig} */
import nextra from "nextra"
 
const nextConfig = {};
 
const withNextra = nextra({
  theme: 'nextra-theme-blog',
  themeConfig: './theme.config.jsx'
})
 
export default withNextra(nextConfig);

Lastly, create the corresponding theme.config.jsx file in your project’s root directory. This will be used to configure the Nextra Blog theme:

theme.config.jsx

export default {
  footer: <p>MIT 2024 © ShipKwiq.</p>,
  head: ({ title, meta }) => (
    <>
      {meta.description && (
        <meta name="description" content={meta.description} />
      )}
      {meta.tag && <meta name="keywords" content={meta.tag} />}
      {meta.author && <meta name="author" content={meta.author} />}
    </>
  ),
  readMore: 'Read More →',
  postFooter: null,
  darkMode: false,
}

Now, you can run the pnpm run dev command and go to http://localhost:3000/blog to start developing the project! 🎉

Footer Deployment