https://github.com/karpolan/nextjs-with-pages-mui-starter-ts
Starter for Next.js with Pages Router + Material UI + TypeScript
https://github.com/karpolan/nextjs-with-pages-mui-starter-ts
material-ui mui mui-material mui5 muiv5 next next-js next-starter nextjs nextjs-boilerplate nextjs-starter nextjs-template pages-router react react-js reactjs starter starter-project starter-template typescript
Last synced: 4 months ago
JSON representation
Starter for Next.js with Pages Router + Material UI + TypeScript
- Host: GitHub
- URL: https://github.com/karpolan/nextjs-with-pages-mui-starter-ts
- Owner: karpolan
- Created: 2022-02-13T15:47:39.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2023-08-06T16:07:18.000Z (almost 2 years ago)
- Last Synced: 2025-01-16T02:22:21.640Z (4 months ago)
- Topics: material-ui, mui, mui-material, mui5, muiv5, next, next-js, next-starter, nextjs, nextjs-boilerplate, nextjs-starter, nextjs-template, pages-router, react, react-js, reactjs, starter, starter-project, starter-template, typescript
- Language: TypeScript
- Homepage: https://nextjs-with-pages-mui-starter-ts.vercel.app/
- Size: 611 KB
- Stars: 9
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Starter project for Next.js with Pages Router + Material UI using TypeScript
Mix of [Create Next App](https://nextjs.org/docs/api-reference/create-next-app) and [MUI](https://mui.com) with set of reusable components and utilities to build professional NextJS application faster.
- [Source Code](https://github.com/karpolan/nextjs-with-pages-mui-starter-ts)
- [Online Demo](https://nextjs-with-pages-mui-starter-ts.vercel.app)
_Warning: It looks like **App Router** is a winner over **Pages Router** so this template **could be deprecated** in the future... If you need a starter for **App Router**, check [this repo](https://github.com/karpolan/nextjs-mui-starter-ts)_
## How to use
1. Clone or download the repo from: https://github.com/karpolan/nextjs-with-pages-mui-starter-ts
2. Copy `.env.sample` file into `.env` file
3. Replace `_TITLE_` and `_DESCRIPTION_` in all files with own texts
4. Check and resolve all `// TODO: ` directives
5. Add your own code :)
## Available Scripts
In the project directory, you can run:
### `npm run dev` or `yarn dev`
Runs the app in the development mode.
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
The page will reload if you make edits.
You will also see any lint errors in the console.
### `npm run lint` or `yarn lint`
Checks the code for errors and missing things
### `npm run format` or `yarn format`
Formats the code according to `./prettierrc.js` config
### `npm test` or `yarn test`
Launches the test runner in the interactive watch mode.
### `npm run build` or `yarn build`
Builds the app for production or local development to the `.next` folder.
### `yarn build:static` or `npm run build:static`
_Note: this is deprecated way to build the Next.js app!_
Builds the SSG (static site generator) version of the app in the `out` folder.
## Deploy on Vercel
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.