@mfix-stripe Following up on https://github.com/markdoc/markdoc/issues/227 this PR adds example code for how to include the 4 Next.js tags which are provided by markdoc.

While testing this, I noticed there seems to be a rendering bug with the Head tag but only in next's production/optimized mode. To reproduce, run the current branch like this:

npm run build
npm run start

• Browse to localhost:3000 and then click the Docs link. The page renders OK, and the Head tag is output correctly to the browser as shown in view source.
• Reload your browser at url http://localhost:3000/docs then the page does not render, and outputs the raw Head tag content:
• This problem does not occur when running next in development mode with npm run dev.

Hi, this starter installs the latest Next.js version, as seen in package.json, which means it will install Next.js 13 now. Next.js 13 introduces a new <Link> component, which can no longer has <a> as its child, otherwise the app will crash.

This pull request removes <a> from <Link>, and accordingly change the way to style <Link> component. styled-jsx can't style <Link> with className, unless the style is marked as global.

Hey! I'm with @replit and we're super excited about markdoc. I've been stoked for its public release ever since I saw the initial tech demo by @segphault. Replit seems like a great place to run markdoc and we've been looking for something like it for our internal docs, too. I've set up a template for the next.js starter on replit here so folks on our platform can easily jump in to using markdoc, and you can see the live version here.

This PR adds:

• .replit - config file that tells replit how to run the project
• replit.nix - nix file config
• updates README.md and pages/index.md to include "run on replit" badges

Hi markdoc/markdoc-starter!

This is a one-off automatically generated pull request from LGTM.com :robot:. You might have heard that we’ve integrated LGTM’s underlying CodeQL analysis engine natively into GitHub. The result is GitHub code scanning!

With LGTM fully integrated into code scanning, we are focused on improving CodeQL within the native GitHub code scanning experience. In order to take advantage of current and future improvements to our analysis capabilities, we suggest you enable code scanning on your repository. Please take a look at our blog post for more information.

This pull request enables code scanning by adding an auto-generated codeql.yml workflow file for GitHub Actions to your repository — take a look! We tested it before opening this pull request, so all should be working :heavy_check_mark:. In fact, you might already have seen some alerts appear on this pull request!

Where needed and if possible, we’ve adjusted the configuration to the needs of your particular repository. But of course, you should feel free to tweak it further! Check this page for detailed documentation.

Questions? Check out the FAQ below!

FAQ

Issue

I noticed this is in an external project that was created from this template. After the update of Next.js 12.3.x, the AppProps (extends AppInitialProps) type no longer has pageProps type set to any, this means that a type error is thrown when building the project.

Solution

The solution here is to create a MyAppProps interface and add the markdoc property by setting its type to MarkdocNextJsPageProps['markdoc'] (imported from @markdoc/next.js) and pass it to the AppProps type. This fix allows the build step to successfully pass the validity of types check.