몇 번의 클릭 만으로이 템플릿의 사본을 배포하십시오!
이 템플릿에는 많은 폴더, 코드 예제 및 구성이 있습니다. 이 readme을 포함하여 편집하거나 제거하십시오!
사용자 정의하고 즐기십시오!
이 프로젝트는 웹 개발의 모든 최신 도구와 모범 사례를 특징으로합니다!
$ git clone https://github.com/ < YOUR-GITHUB-LOGIN > / < NAME-OF-YOUR-GENERATED-REPOSITORY > .gitSuper Application 개발을 시작하기 전에 프로젝트의 종속성을 설치해야합니다.
프로젝트의 근본으로 자신을 이동하십시오.
$ cd < NAME-OF-YOUR-GENERATED-REPOSITORY >다음 단계는 선택한 패키지 관리자를 선택하고
package.json스크립트에 포함 된 명령을 변경하십시오. 자세한 내용은 문서를 참조하십시오.
- PNPM (권장 사항)
- NPM
프로젝트의 모든 종속성을 설치하십시오.
# PNPM
$ pnpm install
# NPM
$ npm install모든 종속성이 설치되면 로컬 개발 서버를 실행할 수 있습니다.
# PNPM
$ pnpm dev
# NPM
$ npm run dev이제 코드!
변경 사항을 적용한 후에는 생산 환경에 테스트 및/또는 배포 할 빌드를 생성 할 수 있습니다.
생산 빌드 만들기 :
# PNPM
$ pnpm build
# NPM
$ npm run build그런 다음 빌드를 실행합니다.
# PNPM
$ pnpm start
# NPM
$ npm start # PNPM
$ pnpm run lint
# NPM
$ npm run lint # PNPM
$ pnpm run lint:fix
# NPM
$ npm run lint:fix # PNPM
$ pnpm run test # or pnpm run test:watch
# NPM
$ npm run test # or npm run test:watch # PNPM
$ pnpm run type-check
# NPM
$ npm run type-check # PNPM
$ pnpm run format
# NPM
$ npm run format # PNPM
$ pnpm run up
# NPM
$ npm run up # PNPM
$ pnpm run up-latest
# NPM
$ npm run up-latest # PNPM
$ pnpm run release-as-major
# NPM
$ npm run release-as-major # PNPM
$ pnpm run release-as-minor
# NPM
$ npm run release-as-minor # PNPM
$ pnpm run release-as-patch
# NPM
$ npm run release-as-patch # PNPM
$ pnpm run push-release
# NPM
$ npm run push-release # PNPM
$ pnpm run pull
# NPM
$ npm run pull 프로젝트 루트에 babel.config.js 파일 (경로 src/scripts 에 위치)을 넣고 .babelrc 파일을 삭제하십시오.
pages/_app.tsx 에서 wdyr 가져 오기 라인을 무책임합니다.
그게 다야! 이제 반응 리 렌더를 모니터링 할 수 있습니다!
babel.config.js 및 wdyr.ts 파일을 삭제하고 pages/_app.tsx 에서 wdyr 가져 오기 라인을 제거하고 제거하십시오.
# PNPM
$ pnpm uninstall @welldone-software/why-did-you-render
# NPM
$ npm uninstall @welldone-software/why-did-you-render프로젝트 구조를 이해하려면 파일 트리 아래를 참조하십시오.
(
**)로 표시된 폴더 및 파일은 선택 사항이므로 삭제할 수 있습니다.
mantine-admin/
┣ .github/ # GitHub's folder configs **
┣ .husky/ # Husky's folder
┃ ┣ ? commit-msg # Commitlint git hook
┃ ┗ ? pre-commit # Lint-staged git hook
┣ .vscode/ # VSCode's workspace **
┣ public/ # Public folder
┃ ┣ static/ # Static files folder **
┃ ┃ ┣ icons/ # Icons folder **
┃ ┃ ┣ images/ # Images folder **
┃ ┃ ┣ sounds/ # Sounds folder **
┃ ┃ ┗ videos/ # Videos folder **
┃ ┣ docs/ # Documentation folder **
┃ ┃ ┣ demo/ # Demonstrations project **
┃ ┃ ┗ translations/ # Translations folder **
┃ ┣ ? favicon.ico # Icon tab browser
┣ src/
┃ ┣ app/ # App pages
┃ ┣ components/ # App Components
┃ ┃ ┗ Motion/ # Mantine-UI components **
┃ ┣ hooks/ # React Hooks **
┃ ┃ ┗ ? useFetch.ts # SWR fetch hook (optional) **
┃ ┣ interfaces/ # TypeScript Interfaces
┃ ┣ scripts/ # Additional scripts **
┃ ┃ ┣ ? babel.config.js # Babel config with WDYR **
┃ ┃ ┗ ? wdyr.ts # WDYR file **
┃ ┣ services/ # Services
┃ ┃ ┗ users/
┃ ┃ ┣ ? index.ts # React Query Configuration
┃ ┃ ┗ ? keys.ts # React Query Key
┃ ┣ stores/ # Zustand stores
┃ ┣ styles/ # Styles folder
┃ ┃ ┣ ? bgImages.ts # SVG background images **
┃ ┃ ┗ ? theme.ts # Mantine-UI theme
┃ ┗ utils/ # Useful functions **
┣ ? .babelrc # Default Babel config
┣ ? .editorconfig # Editor config
┣ ? .eslintignore # ESLint ignore
┣ ? .eslintrc # ESLint config
┣ ? .gitignore # Git ignore
┣ ? .versionrc # Versioning config
┣ ? .commitlintrc # Commitlint config
┣ ? jest.config.js # Jest config
┣ ? jest.setup.js # Jest setup
┣ ? LICENSE # License of the project
┣ ? next-env.d.ts # Next.js types to TypeScript
┣ ? next.config.js # Next.js config
┣ ? .prettierrc # Prettier config
┣ ? README.md # Main README
┣ ? renovate.json # Renovate Bot config **
┣ ? tsconfig.json # TypeScript config당신이 할 필요는 없지만, 당신이 당신의 프로젝트에 대한이 템플릿을 재사용한다면, 당신 이 저를 인정하고 프로젝트 바닥 글에서 내 github 프로필에 대한 링크를 제공한다면 감사하겠습니다. 감사해요!
이 프로젝트는 MIT 라이센스 에 따라 라이센스가 부여됩니다. 자세한 내용은 라이센스 페이지를 참조하십시오.