https://github.com/joelhooks/next-typescript-tailwind-mdx-starter

Opinionated Next.js Starter with TypeScript, Tailwind, MDX, and decent SEO
https://github.com/joelhooks/next-typescript-tailwind-mdx-starter

jest mdx nextjs react react-testing-library tailwindcss testing-library typescript

Last synced: 3 months ago
JSON representation

Opinionated Next.js Starter with TypeScript, Tailwind, MDX, and decent SEO

• Host: GitHub
• URL: https://github.com/joelhooks/next-typescript-tailwind-mdx-starter
• Owner: joelhooks
• Archived: true
• Created: 2020-10-06T21:58:11.000Z (about 4 years ago)
• Default Branch: main
• Last Pushed: 2024-08-21T19:55:50.000Z (4 months ago)
• Last Synced: 2024-09-20T09:02:03.031Z (3 months ago)
• Topics: jest, mdx, nextjs, react, react-testing-library, tailwindcss, testing-library, typescript
• Language: TypeScript
• Homepage: next-typescript-tailwind-mdx-starter.vercel.app
• Size: 1.1 MB
• Stars: 157
• Watchers: 2
• Forks: 28
• Open Issues: 25
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
[![Depfu](https://badges.depfu.com/badges/0eb0914942401daa2b5b7022cfcba170/count.svg)](https://depfu.com/github/joelhooks/next-typescript-tailwind-mdx-starter?project_id=17632)

This is an opinonated Next.js starter project that makes it relatively simple to spin up a new project.

## Getting Started

First, run the development server:

```bash

yarn dev

```

If you'd like serverless function support:

```bash

vercel dev

```

I'm personally in the "just do Next.js the Vercel way because it gives me modern best practices without a lot of friction" but if you've got other preferences you probably know how to manage them anyway.

Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.

You can start editing the page by modifying `src/pages/index.js`. The page auto-updates as you edit the file.

You can also add mdx files in `src/pages/` and they will be presented at the cooresponding route.

Tailwind and Emotion are available for styling using utility classes and css-in-js respectively.

Testing is facilitated through React Testing Library and Jest.

`next-seo` and `next-sitemap` are doing their jobs very well. Be sure to update `/next-sitemap.js` and `/next-seo.json` with your information!