Skip to content

Commit 5761b47

Browse files
binodnepalibinodnepali
committed
chore: setup using nextjs-with-typescript-example-template
0 parents  commit 5761b47

23 files changed

+9359
-0
lines changed

‎.eslintrc.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": ["eslint:recommended", "next/core-web-vitals", "next", "prettier"]
3+
}

‎.gitignore

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
.yarn
8+
9+
# testing
10+
/coverage
11+
12+
# next.js
13+
/.next/
14+
/out/
15+
16+
# production
17+
/build
18+
19+
# misc
20+
.DS_Store
21+
*.pem
22+
23+
# debug
24+
npm-debug.log*
25+
yarn-debug.log*
26+
yarn-error.log*
27+
.pnpm-debug.log*
28+
29+
# local env files
30+
.env*.local
31+
32+
# vercel
33+
.vercel
34+
35+
# typescript
36+
*.tsbuildinfo

‎.husky/commit-msg

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
#!/bin/sh
2+
. "$(dirname "$0")/_/husky.sh"
3+
4+
npx --no -- commitlint --edit

‎.husky/pre-commit

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
#!/bin/sh
2+
. "$(dirname "$0")/_/husky.sh"
3+
4+
npx lint-staged -c .lintstagedrc.js

‎.lintstagedrc.js

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
const path = require('path')
2+
3+
const buildEslintCommand = (filenames) =>
4+
`next lint --fix --file ${filenames
5+
.map((f) => path.relative(process.cwd(), f))
6+
.join(' --file ')}`
7+
8+
module.exports = {
9+
'*.{ts,tsx}': [buildEslintCommand, 'prettier --write'],
10+
'*.{css,scss}': 'stylelint --fix',
11+
}

‎.prettierignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
.next
2+
node_modules

‎.prettierrc.json

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"trailingComma": "all",
3+
"tabWidth": 2,
4+
"semi": false,
5+
"singleQuote": true
6+
}

‎.stylelintrc.json

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"extends": [
3+
"stylelint-config-standard-scss",
4+
"stylelint-config-prettier-scss",
5+
"stylelint-config-standard",
6+
"stylelint-config-prettier",
7+
"stylelint-config-rational-order"
8+
],
9+
"plugins": ["stylelint-order", "stylelint-config-rational-order/plugin"],
10+
"rules": {
11+
"order/properties-order": [],
12+
"plugin/rational-order": [
13+
true,
14+
{
15+
"border-in-box-model": true,
16+
"empty-line-between-groups": true
17+
}
18+
]
19+
}
20+
}

‎.yarnrc.yml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
nodeLinker: node-modules

‎README.md

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
# Next.js with typescript example template
2+
3+
[![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)
4+
5+
An example template made using [Next.js and Typescript](https://nextjs.org/docs) to start a new project. The template is setup with [Prettier](https://prettier.io/docs/en/install.html), [ESLint](https://eslint.org/docs/user-guide/getting-started), [StyleLint](https://stylelint.io/user-guide/get-started) and [Lint Staged](https://github.com/okonet/lint-staged).
6+
7+
This template use next.js version 12.3.1. Read more about [release](https://github.com/vercel/next.js/releases/tag/v12.3.1)
8+
9+
## Why this template
10+
11+
I made this template because I have to set up every time Prettier, ESLint, StyleLint and Lint Staged for my new next.js projects. And I thought this might be useful for developers who are looking for configuration or starter or example templates.
12+
13+
## Before getting started
14+
15+
Make sure you have installed [Node.js 12.22.0 or higher](https://nodejs.org/en/) on your machine. You can use [nvm](https://github.com/nvm-sh/nvm) to manage multiple node version on your machine.
16+
17+
## Getting started
18+
19+
You can setup this project using npm or yarn package managers.
20+
21+
> I would recommend to installed or enabled [yarn](https://yarnpkg.com/getting-started) package manager on your machine.
22+
23+
### Clone repo
24+
25+
```bash
26+
git clone https://github.com/binodnepali/nextjs-with-typescript-example-template.git
27+
#or
28+
git clone [email protected]:binodnepali/nextjs-with-typescript-example-template.git
29+
```
30+
31+
### Navigate to cloned repo
32+
33+
```bash
34+
cd nextjs-with-typescript-example-template
35+
```
36+
37+
### Install dependencies
38+
39+
```bash
40+
yarn install
41+
#or
42+
npm install
43+
```
44+
45+
### Start development server
46+
47+
```bash
48+
yarn dev
49+
#or
50+
npm run dev
51+
```
52+
53+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
54+
55+
### Build for production
56+
57+
```bash
58+
yarn build
59+
#or
60+
npm run build
61+
```
62+
63+
### Start preview server after build
64+
65+
```bash
66+
yarn start
67+
#or
68+
npm run start
69+
```
70+
71+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
72+
73+
### Commit
74+
75+
Open interactive terminal to write conventional commit message
76+
77+
```bash
78+
# yarn
79+
yarn commit
80+
81+
# npm
82+
npm run commit
83+
```
84+
85+
### Run release
86+
87+
Follow the [Conventional Commits Specification](https://www.conventionalcommits.org/en/v1.0.0/) in your repository. And when you're ready to release, run below scripts.
88+
89+
```bash
90+
yarn release
91+
#or
92+
npm run release
93+
```
94+
95+
## Learn More
96+
97+
To learn more about Next.js, ESLint, Prettier, StyleLint and lint-staged, take a look at the following resources:
98+
99+
* [Next.js Documentation](https://nextjs.org/docs) - Learn about Next.js features and API
100+
* [Next.js ESLint](https://nextjs.org/docs/basic-features/eslint) - Learn about how to Next.js ESLint setup
101+
* [Prettier Setup](https://prettier.io/docs/en/install.html) - Learn about how to setup prettier
102+
* [Prettier Integrations](https://prettier.io/docs/en/related-projects.html) - Learn about how to setup prettier with other tools
103+
* [ESLint Setup](https://eslint.org/docs/user-guide/getting-started) - Learn about how to ESLint
104+
* [StyleLint Setup](https://stylelint.io/user-guide/get-started) - Learn about how to setup StyleLint
105+
* [Lint Staged Setup](https://github.com/okonet/lint-staged) - Learn about how to setup lint-staged
106+
* [Standard Version](https://github.com/conventional-changelog/standard-version) - Learn about how to setup standar version

0 commit comments

Comments
 (0)