Next.js TypeScript Starter
Features
- ⚡️ Next.js 12
- ⚛️ React 17
- ⛑ TypeScript
- 📏 ESLint — Find problems in your code
- 💖 Prettier — Code Formatter for consistent style
- 🐶 Husky — For running scripts before committing
- 🖌 Renovate — Keep your dependencies up to date
- 🚫 lint-staged — To run ESLint and Prettier against staged Git files
- 👷 PR Workflow — Run Type Check & Linters on all Pull Requests
- ⚙️ EditorConfig - Maintain consistent coding styles across editors and IDEs
- 🗂 Path Mapping — Import components or images using the
@prefix
Quick Start
The best way to start with this template is using Create Next App.
yarn create next-app -e https://github.com/jpedroschmitz/typescript-nextjs-starter
# or
npx create-next-app -e https://github.com/jpedroschmitz/typescript-nextjs-starter
Development
To start the project locally, run:
npm run dev
Open http://localhost:3000 with your browser to see the result. To change the port:
PORT=4000 npm run dev
Requirements
- Node.js >= 12.22.0
Integrate Ant Design
Install Ant Design core and its icon set with the following command:
npm install antd @ant-design/icons --save
Manually import the antd.css file at the very top of your pages/_app.page.tsx file:
import 'antd/dist/antd.css';
For example:
import { Button, Space, DatePicker, Card } from 'antd';
import { CiCircleFilled } from '@ant-design/icons';
export default function Home() {
const onChange = () => {};
return (
);
}