Skip to content

Commit

Permalink
Create Next.js
Browse files Browse the repository at this point in the history
  • Loading branch information
AhmedOsamaMath authored Jan 29, 2025
1 parent ac0e65f commit ef0fc18
Showing 1 changed file with 60 additions and 0 deletions.
60 changes: 60 additions & 0 deletions Next.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
// First, create a package.json file in your repository root:
{
"name": "markdown-site",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start"
},
"dependencies": {
"next": "latest",
"react": "latest",
"react-dom": "latest",
"gray-matter": "^4.0.3",
"markdown-to-jsx": "^7.2.0"
}
}

// Create a next.config.js file:
/** @type {import('next').NextConfig} */
const nextConfig = {
reactStrictMode: true,
}

module.exports = nextConfig

// Create pages/_app.js:
function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />
}

export default MyApp

// Create pages/index.js:
import fs from 'fs'
import path from 'path'
import matter from 'gray-matter'
import Markdown from 'markdown-to-jsx'

export default function Home({ content }) {
return (
<div style={{ maxWidth: '800px', margin: '0 auto', padding: '20px' }}>
<Markdown>{content}</Markdown>
</div>
)
}

export async function getStaticProps() {
// Read the README.md or your main markdown file
const filePath = path.join(process.cwd(), 'README.md')
const fileContent = fs.readFileSync(filePath, 'utf8')
const { content } = matter(fileContent)

return {
props: {
content
}
}
}

0 comments on commit ef0fc18

Please sign in to comment.