GITS Next Starter
This is Next Starter, using version 13 that you can see here
Batteries Included
Folder Structure
Project structure for this Next starter
.husky // Contain husky configuration
.ide // Contain Jetbrains configuration
.next // Contain Next framework configuration
.storybook // Contain storybook configuration
.vscode // Contain vscode configuration to force local
.cache // Contain jest cache
.coverage // Contain jest coverage
node_modules // Contain modules / third parties
public // Contain public assets & etc
__mocks__ // Contain all mocks for test
__tests__ // Contain all test inside the project
app // Entry point for the app.
├── __mocks__ // Contain mocks for jest
├── __tests__ // Contain test for the app features
├── _api // Contain api for integration to back-end
├── _assets // Contain assets for features
├── _components // Contain all base components or reusable
│ ├── base // Contain all reusable components
│ └── {another-folder} // Your desired reusable component folder name
├── _plugins // Contain all plugins config for your app
├── _store // Contain all state management things using Zustand
├── _types // Contain type definitions for core app
├── _utils // Contain utilities / helpers for app
├── {feature-name-folder} // Contain your feature files, the the structure same as app folder (but isolated functionality)
├── error.tsx // File for rendering error (app error)
├── layout.tsx // File for rendering layout (app layout)
├── loading.tsx // File for rendering loading (app loading)
└── page.tsx // File for rendering page (app (/) main page)
.dockerignore // File for ignoring file to be inside image
.env.development // File for environment for develpoment stage
.eslint.json // File config for eslint
.prettierrc // File config for prettier
commitlint.config.js // File config for commitlint
docker-compose-dev.yml // File config for docker command
Dockerfile // File config for dockerfile
.env.d.ts // File config for type definition
jest.config.js // File config for jest
jest.setup.js // File config for setuping jest entry point
next-env.d.ts // File config for type definition
next.config.js // File config for next framework
package.json // File config for your project
postcss.config.js // File config for postcss
README.md // File for documentation (HEY YOU READING ME NOW!)
tailwind.config.js // File config for tailwind
yarn.lock // File config for locking project packages (READONLY FILE!)
If you want to create folder outside declared above, you can create, but, don't forget to update this docs.
Installation
1; Install dependencies using yarn
yarn
Available commands for build
Build next app
yarn build
Build with docker
docker build -t <username>/<imagename> .
Available commands for linting
Run linter and will search for problems, but will not fix
yarn lint
Run linter and will search and try to fix the problems.
yarn lint:fix
Run linter and will call prettier to fix the code style.
yarn lint:format
Available commands for versioning
Upgrade patch semantic versioning 0.0.(0 <-- this)
yarn version:patch
Upgrade minor semantic versioning 0.(0 <--- this).0
yarn version:minor
Upgrade major semantic versioning (0 <--- this).0.0
yarn version:major
Available commands for testing
It will go through all the test files and execute them. This command will also be used in pre-hooks and CI checks.
yarn test
This will watch all the test files. It is very useful while writing tests and quickly seeing results.
yarn test:watch
This command will update snapshots for all the presentational components. If the snapshot is not there, it will create it for you.
yarn test:update
As the name suggests, this command will generate a coverage report.
yarn test:coverage