Starter Angular Project with Bootstrap 4 and Angular Material components.
This project aims to utilize the beautiful and high quality components from the Angular Material repository and combine them with the flexibility and ease of use provided by Bootstrap 4.
Multiple themes can be easily created and lazy loaded into the app at runtime.
Theming is supported combining the Material color palettes with bootstrap utilities.
bg-${color}
classes are generated by bootstrap and contrasting text color assigned based on Material palette.
Custom text-default
and bg-default
classes are generated to allow for easily switching between dark and light themes.
Prettier is used to automatically style code, files can be pretified automatically on save by using the included .vscode/settings.json
file in this repo.
Additionally, the prettier npm module is included as a dependency to prettify staged files with a pre-commit
hook.
Prettier is used on this project to ensure consistent coding style.
Similarly to Prettier, TSLint will try to auto-fix linting issues automatically on save using the included .vscode/settings.json
file.
Running npm run lint:fix
will also try to auto-fix any linting issues in the project.
There's a pre-push
hook that will lint the project and prevent pushing if errors are present.
Hooks are ran using Husky to ensure code quality through the scaffolding of this project.
Prettier will run as a pre-commit
hook using pretty-quick
on staged files.
Linting (no auto-fix) and tests will be run as a pre-push
hook, if either of them fail pushing won't go through.
VSCode is recommended as the IDE for this project, included in this repo is .vscode/settings.json
file with some basic settings to prettify and attempt to auto-fix lint issues with ease.
Run npm start
for a dev server and navigate to http://localhost:4200/
. The app will automatically reload if you change any of the source files.