pietro-boilerplate

All notable changes to this project will be documented in CHANGELOG.md.

DevDependencies

• commitlint
• craco
• eslint
• husky
• lint-staged
• prettier
• standard-version
• craco-alias
• cz-conventional-changelog
• commitzen

How to make a commit?

$ git add [FILES] $ yarn commit

1. ? Select the type of change that you're committing: (Use arrow keys) ❯ feat: A new feature fix: A bug fix docs: Documentation only changes style: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc) refactor: A code change that neither fixes a bug nor adds a feature perf: A code change that improves performance test: Adding missing tests or correcting existing tests

2. ? What is the scope of this change (e.g. component or file name): (press enter to skip)

3. ? Write a short, imperative tense description of the change (max 94 chars):

4. ? Provide a longer description of the change: (press enter to skip)

5. ? Are there any breaking changes? (y/N)

6. ? Does this change affect any open issues? (y/N)

How to generate a release

$ yarn release

Folders

• 📄 CHANGELOG.md
• 📄 README.md
• 📄 commitlint.config.js
• 📄 craco.config.js
• 📂 env
• 📄 node_modules
• 📄 package.json
• 📂 public
  • 📄 favicon.ico
  • 📄 index.html
  • 📄 manifest.json
  • 📄 robots.txt
• 📂 src
  • 📄 App.tsx
  • 📄 GlobalStyle.ts
  • 📄 Routes.tsx
  • 📂 components
    • 📄 InitialLoading.tsx
    • 📄 index.ts
  • 📂 configs
    • 📄 index.ts
  • 📄 index.tsx
  • 📂 pages
    • 📄 index.ts
  • 📄 react-app-env.d.ts
  • 📂 services
    • 📄 index.ts
  • 📂 templates
    • 📄 Layout.tsx
  • 📂 theme
    • 📄 index.ts
  • 📂 utils
    • 📄 index.ts
• 📄 tsconfig.json
• 📄 tsconfig.paths.json
• 📄 yarn.lock

Imports

tsconfig.paths.json

	{

	"compilerOptions": {

		"baseUrl": "./src",

		"paths": {

			"components/*": ["./components/*"]

		}

	}

}

❌ import COMPONENT from '../../components/path/to/component';

✅ import COMPONENT from 'components/path/to/component';

Routes

Routes.tsx

interface Page{
	path: string;
	exact: boolean;
	component: any;
	isPrivate: boolean;
}

const  pages: Page[] = [
	{ path:  "/", exact:  true, component: () =>  <p>Hello Home!</p> },
	{ path:  "/404", exact:  true, component: () =>  <p>Page Not Found</p> },
	[ADD A NEW PAGE HERE]
];