angular-bootstrap/angular14-project-bootstrap
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
Angular 14 project bootstrap
32 commits 8 branches 0 tags 4.2 MiB
Find a file
Exact
deejayy 09d92d7edf Update theme
2022-08-25 19:43:35 +02:00
.vscode Start some readme 2022-07-12 00:31:15 +02:00
src Update theme 2022-08-25 19:43:35 +02:00
.browserslistrc initial commit 2022-07-10 00:03:33 +02:00
.editorconfig Extend editorconfig 2022-07-10 00:08:38 +02:00
.eslintrc.json Add lint rules, fix lint errors 2022-07-10 00:24:18 +02:00
.gitignore initial commit 2022-07-10 00:03:33 +02:00
.prettierrc Update configs 2022-07-10 00:50:05 +02:00
angular.json Update configs 2022-07-10 00:50:05 +02:00
jest.config.js Replace karma with jest 2022-07-10 00:42:29 +02:00
package-lock.json Update theme 2022-08-25 19:43:35 +02:00
package.json Update theme 2022-08-25 19:43:35 +02:00
README.md Update readme 2022-07-26 22:43:22 +02:00
stylelint.json Add stylelint 2022-07-10 13:49:31 +02:00
tsconfig.app.json Add stylelint 2022-07-10 13:49:31 +02:00
tsconfig.json Add stylelint 2022-07-10 13:49:31 +02:00
tsconfig.spec.json Replace karma with jest 2022-07-10 00:42:29 +02:00

README.md

Angular 14 Project Bootstrap

LIst of features:

  • editorconfig, prettier, eslint, stylelint set up with rules
  • jest for unit testing and some basic mocks
  • lint-staged
  • index.html with nojs fallback, loader, tuned viewport
  • modern css reset, customized scrollbar, autofill-input patch
  • material set up with
    • some offline fonts and iconset
    • example palette (check app-theme.scss)
    • dark mode support based on palette
  • ngrx state manager with immer, dev tools
  • optimized build for rarely-changing files, vendor chunk
  • scss mixins: mq and smart-scale
  • module path aliases

To be done:

  • feature flag
  • demo page

How to leverage prepared setups

VSCode plugins

(all listed in recommendations)

  • Angular Language Service
  • Editorconfig for VS Code
  • Prettier - Code formatter
  • ESLint
  • Prettier ESLint
  • SCSS IntelliSense
  • Stylelint

Reactive Config

Check: https://www.npmjs.com/package/@deejayy/reactive-config

Config file: /assets/config-{dev,prod}.json

Protip: if you want to hide your dev/staging/qa configs, generate a hash in the config's file name (security through obscurity), like this: config-dev-ad7f82.json. Since at build time it will only include the environment file which is required for that build env, your prod bundle won't contain the dev configs name, and also can't be guessed because of the hash.
Or, of course, you can adjust fileReplacements section in angular.json for similar effect.

Runtime Localizer

Check: https://www.npmjs.com/package/@deejayy/runtime-localizer

API Caller

Check: https://www.npmjs.com/package/@deejayy/api-caller

TBD

There will be some simple feature modules just to test library functionalities.
They will be easy to remove, so you can have an empty but properly setup project.
... or you can use it as reference implementation.