Skip to content

Commit

Permalink
Merge pull request #428 from christophercr/feature/fix-formatting
Browse files Browse the repository at this point in the history
style(stark-all): re-format files with latest Prettier version. Include MD files in Prettier auto formatting.
  • Loading branch information
christophercr authored Jun 11, 2018
2 parents 18ddc7a + 86d82c7 commit 0ced55c
Show file tree
Hide file tree
Showing 23 changed files with 578 additions and 405 deletions.
1 change: 1 addition & 0 deletions .prettierignore
Original file line number Diff line number Diff line change
Expand Up @@ -6,5 +6,6 @@ dist/
coverage/
reports/
node_modules/
CHANGELOG.md
package.json
package-lock.json
3 changes: 2 additions & 1 deletion CODE_OF_CONDUCT.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
# Contributor Code of Conduct

As contributors and maintainers of the Stark, we pledge to respect everyone who contributes by posting issues, updating documentation, submitting pull requests, providing feedback in comments, and any other activities.

Communication through any of Stark's channels (GitHub, Twitter ,Slack, etc.) must be constructive and never resort to personal attacks, trolling, public or private harassment, insults, or other unprofessional conduct.
Expand All @@ -7,4 +8,4 @@ We promise to extend courtesy and respect to everyone involved in this project r

If any member of the community violates this code of conduct, the maintainers of the Stark project may take action, removing issues, comments, and PRs or blocking accounts as deemed appropriate.

If you are subject to or witness unacceptable behavior, or have any other concerns, please email us at [sebastien.dubois@nbb.be](mailto:sebastien.dubois@nbb.be).
If you are subject to or witness unacceptable behavior, or have any other concerns, please email us at [sebastien.dubois@nbb.be](mailto:sebastien.dubois@nbb.be).
372 changes: 214 additions & 158 deletions CONTRIBUTING.md

Large diffs are not rendered by default.

82 changes: 46 additions & 36 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,88 +12,98 @@
# Stark

> An Angular 5+ based front-end framework built on top of [Angular](https://angular.io)
> Stark features... An awesome reusable build using [Webpack](https://webpack.js.org/), built-in support for state of the art front-end tech
> Stark features... An awesome reusable build using [Webpack](https://webpack.js.org/), built-in support for state of the art front-end tech
Stark provides main building blocks for accelerating front-end development:
* a solid reusable build based on Webpack
* a starter project inspired by [Angular Starter](https://github.com/gdi2290/angular-starter) by [AngularClass](https://angularclass.com) and Google's [Web Starterk Kit](https://github.com/google/web-starter-kit)
* core modules providing reusable APIs (e.g., reactive client for RESTful APIs based on [NBB's RESTful API Design Guide](https://github.com/NationalBankBelgium/REST-API-Design-Guide/wiki), routing, logging, log shipping, ...)
* UI modules providing reusable UI components (e.g., data table, message pane, ...) and themes
* a showcase application containing
* our [living style guide](https://www.smashingmagazine.com/2016/05/creating-a-living-style-guide-case-study/)
* a showcase of all components/services along with their API
* our developer guide

Stark modules are like LEGO blocks: add what you need, no less, no more. If you don't like our defaults then you may replace/override/ignore anything you fancy.
- a solid reusable build based on Webpack
- a starter project inspired by [Angular Starter](https://github.com/gdi2290/angular-starter) by [AngularClass](https://angularclass.com) and Google's [Web Starterk Kit](https://github.com/google/web-starter-kit)
- core modules providing reusable APIs (e.g., reactive client for RESTful APIs based on [NBB's RESTful API Design Guide](https://github.com/NationalBankBelgium/REST-API-Design-Guide/wiki), routing, logging, log shipping, ...)
- UI modules providing reusable UI components (e.g., data table, message pane, ...) and themes
- a showcase application containing
- our [living style guide](https://www.smashingmagazine.com/2016/05/creating-a-living-style-guide-case-study/)
- a showcase of all components/services along with their API
- our developer guide

Stark modules are like LEGO blocks: add what you need, no less, no more. If you don't like our defaults then you may replace/override/ignore anything you fancy.

## Stark's build

Stark's reusable build integrates support for:

* Angular optimizations: [AOT](https://angular.io/docs/ts/latest/cookbook/aot-compiler.html), lazy loading with [UI-Router](https://github.com/angular-ui/ui-router)
* [TypeScript](https://www.typescriptlang.org/), [@types](https://www.npmjs.com/~types), [TSLint](http://palantir.github.io/tslint/), [Codelyzer](https://github.com/mgechev/codelyzer)
* Code formatting with [Prettier](https://prettier.io/)
* HTML templating with [html-webpack-plugin](https://github.com/jantimon/html-webpack-plugin)
* [PostCSS](http://postcss.org/) with CSSNext, nesting, prefixing, ...
* [Code splitting](https://robertknight.github.io/posts/webpack-dll-plugins/)
* [Tree shaking](https://webpack.js.org/guides/tree-shaking/) to automatically remove unused code from your production bundle
* [Hot Module Replacement](https://webpack.github.io/docs/hot-module-replacement-with-webpack.html) with [@angularclass/hmr](https://github.com/angularclass/angular-hmr) and [@angularclass/hmr-loader](https://github.com/angularclass/angular-hmr-loader)
* Minification & uglyfication
* Cache busting with file hashes
* [Tests](https://angular.io/docs/ts/latest/guide/testing.html): [E2E](https://angular.github.io/protractor/#/faq#what-s-the-difference-between-karma-and-protractor-when-do-i-use-which-), [Karma](https://karma-runner.github.io/), [Protractor](https://angular.github.io/protractor/), [Jasmine](https://github.com/jasmine/jasmine), with source maps support, possibility to execute subsets of the tests, ...
* Tests code coverage with [Istanbul](https://github.com/gotwarlost/istanbul)
* Environments definition (development | production)
* Assets copying
* Security with a DEV mode [Content Security Policy (CSP)](https://content-security-policy.com/) enabled
* Local testing with fake back-ends using [json-server](https://github.com/typicode/json-server)
* Router visualization with [UI-Router Visualizer](https://github.com/ui-router/visualizer)
- Angular optimizations: [AOT](https://angular.io/docs/ts/latest/cookbook/aot-compiler.html), lazy loading with [UI-Router](https://github.com/angular-ui/ui-router)
- [TypeScript](https://www.typescriptlang.org/), [@types](https://www.npmjs.com/~types), [TSLint](http://palantir.github.io/tslint/), [Codelyzer](https://github.com/mgechev/codelyzer)
- Code formatting with [Prettier](https://prettier.io/)
- HTML templating with [html-webpack-plugin](https://github.com/jantimon/html-webpack-plugin)
- [PostCSS](http://postcss.org/) with CSSNext, nesting, prefixing, ...
- [Code splitting](https://robertknight.github.io/posts/webpack-dll-plugins/)
- [Tree shaking](https://webpack.js.org/guides/tree-shaking/) to automatically remove unused code from your production bundle
- [Hot Module Replacement](https://webpack.github.io/docs/hot-module-replacement-with-webpack.html) with [@angularclass/hmr](https://github.com/angularclass/angular-hmr) and [@angularclass/hmr-loader](https://github.com/angularclass/angular-hmr-loader)
- Minification & uglyfication
- Cache busting with file hashes
- [Tests](https://angular.io/docs/ts/latest/guide/testing.html): [E2E](https://angular.github.io/protractor/#/faq#what-s-the-difference-between-karma-and-protractor-when-do-i-use-which-), [Karma](https://karma-runner.github.io/), [Protractor](https://angular.github.io/protractor/), [Jasmine](https://github.com/jasmine/jasmine), with source maps support, possibility to execute subsets of the tests, ...
- Tests code coverage with [Istanbul](https://github.com/gotwarlost/istanbul)
- Environments definition (development | production)
- Assets copying
- Security with a DEV mode [Content Security Policy (CSP)](https://content-security-policy.com/) enabled
- Local testing with fake back-ends using [json-server](https://github.com/typicode/json-server)
- Router visualization with [UI-Router Visualizer](https://github.com/ui-router/visualizer)

## Developer guide

TODO add links to developer guide sections

### Releases

Stark releases are available on npm: https://www.npmjs.com/settings/nationalbankbelgium/packages

### Contributing

Please follow our [contribution guidelines](/CONTRIBUTING.md).

To know how to release Stark, refer to [this page](/RELEASE.md).

### Snapshot builds

Each and every day, a new snapshot of Stark is built, tested and published on npm: https://www.npmjs.com/settings/nationalbankbelgium/packages
See [this page](/SNAPSHOTS.md) for more information about the process behind this.

## Authors

### Sebastien Dubois
* [@Twitter](https://twitter.com/dSebastien)
* [@Medium](https://medium.com/@dSebastien)
* [@Blog](https://www.dsebastien.net)
* [@GitHub](https://github.com/dSebastien)

- [@Twitter](https://twitter.com/dSebastien)
- [@Medium](https://medium.com/@dSebastien)
- [@Blog](https://www.dsebastien.net)
- [@GitHub](https://github.com/dSebastien)

### Alexis Georges
* [@Twitter](https://twitter.com/SuperITMan_BE)
* [@GitHub](https://github.com/SuperITMan)

- [@Twitter](https://twitter.com/SuperITMan_BE)
- [@GitHub](https://github.com/SuperITMan)

## License

This project and all associated source code is licensed under the terms of the [MIT License](/LICENSE).

## Thank you notes :)

We'd like to thank the following companies who support the open source community with great tools and platforms.

### Jetbrains

We're supported by [Jetbrains](https://www.jetbrains.com) and their awesome [support for open source](https://www.jetbrains.com/buy/opensource/), thanks to which we are able to use the best products on the market to work on this open source project!

<a href="https://www.jetbrains.com"><img src="http://www.underconsideration.com/brandnew/archives/jetbrains_logo_detail.jpg" width="144px"></a>

### Travis

We're supported by [Travis](https://travis-ci.org/)

<a href="https://travis-ci.org/"><img src="https://travis-ci.com/images/logos/TravisCI-Full-Color.png" width="144px"></a>

### BrowserStack

We're supported by [BrowserStack](https://www.browserstack.com)

<a href="https://www.browserstack.com"><img src="https://bstacksupport.zendesk.com/attachments/token/22M109zCUfkKcqXrJKzapE2f7/?name=browserstack-logo-600x315.png" width="144px"></a>



54 changes: 33 additions & 21 deletions RELEASE.md
Original file line number Diff line number Diff line change
@@ -1,32 +1,40 @@
# Releasing Stark

## Pre-reqs

### Local

On your local machine, you must configure the `GITHUB_TOKEN` environment variable.
It will be used by release-it to push to and create the release page on GitHub (cfr release:prepare section below).

### Travis

On Travis, the following should be configured:
* NPM_TOKEN environment variable
* if 2FA is enabled for the account the only auth-only level can be used: https://docs.npmjs.com/getting-started/using-two-factor-authentication#levels-of-authentication
* that variable MUST NEVER be logged/exposed. If exposed then the token MUST be revoked and the account password changed ASAP

- NPM_TOKEN environment variable
- if 2FA is enabled for the account the only auth-only level can be used: https://docs.npmjs.com/getting-started/using-two-factor-authentication#levels-of-authentication
- that variable MUST NEVER be logged/exposed. If exposed then the token MUST be revoked and the account password changed ASAP

## Changelog
First of all: *Never* edit CHANGELOG.md manually!

First of all: _Never_ edit CHANGELOG.md manually!

The changelog will be updated automatically as part of the release process and based on the commit log using conventional-changelog (https://github.com/conventional-changelog)
We use the Angular format for our changelog and for it to work properly, please make sure to respect our commit conventions (see CONTRIBUTING guide).

## Creating a release

Make sure that:
* all changes have merged into master
* everything is up to date locally
* everything is clean locally
* execute `npm run release`

- all changes have merged into master
- everything is up to date locally
- everything is clean locally
- execute `npm run release`

Enjoy the show.

## Publishing the release on npm

Once you have pushed the tag, Travis will handle things from there.

Once done, you must make sure that the tags are adapted so that the "latest" tag still points to what we consider the latest (i.e., next major/minor)!
Expand All @@ -35,30 +43,34 @@ Refer to the "Adapting tags of published packages" section below.
## What happens once a release is triggered

### release
* first we make sure that there are no local changes (if there are we stop right there)
* then we execute release-it: https://github.com/webpro/release-it which
* bumps the version in the root package.json automatically (determines the bump type to use depending on the commit message logs)
* that version number will be used as basis in the build to adapt all other package.json files
* generates/updates the CHANGELOG.md file using: conventional-changelog: https://github.com/conventional-changelog
* commits both package.json and CHANGELOG.md
* creates a new git tag and pushes it
* creates a github release page and makes it final

- first we make sure that there are no local changes (if there are we stop right there)
- then we execute release-it: https://github.com/webpro/release-it which
- bumps the version in the root package.json automatically (determines the bump type to use depending on the commit message logs)
- that version number will be used as basis in the build to adapt all other package.json files
- generates/updates the CHANGELOG.md file using: conventional-changelog: https://github.com/conventional-changelog
- commits both package.json and CHANGELOG.md
- creates a new git tag and pushes it
- creates a github release page and makes it final

After this, the release is tagged and visible on github

### publish

Once the tag is pushed to GitHub, Travis picks it up and initiates a build.
Travis executes builds, tests, then executes `npm run release:publish`.

That script makes some checks then, if all succeed it publishes the different packages on npm.
Checks that are performed:
* node version: should be "8"
* NPM_TOKEN environment variable should be defined
* TRAVIS_REPO_SLUG should be "NationalBankBelgium/stark"
* TRAVIS_TAG should be defined and not empty (this is the case when Travis builds for a tag)

- node version: should be "8"
- NPM_TOKEN environment variable should be defined
- TRAVIS_REPO_SLUG should be "NationalBankBelgium/stark"
- TRAVIS_TAG should be defined and not empty (this is the case when Travis builds for a tag)

Other details can be found here: https://github.com/NationalBankBelgium/stark/issues/54

## Adapting tags of published packages

If a published version doesn't have all necessary tags, or if we want to adapt those for some reason (e.g., latest pointing to a patch release rather than the latest major/minor), then we can use the `npm dist-tag` command.
Reference: https://docs.npmjs.com/cli/dist-tag
Reference: https://docs.npmjs.com/cli/dist-tag
2 changes: 1 addition & 1 deletion SNAPSHOTS.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Stark Snapshots

Daily snapshot builds are created and published by a Travis cron job.
This was introduced via [this issue](https://github.com/NationalBankBelgium/stark/issues/27).

For details, refer to `.travis.yml` and `release-publish.sh`

71 changes: 40 additions & 31 deletions docs/COMMON_DEV_ERRORS.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,18 +4,24 @@ During the development we are often in front of some errors and sometimes we do
That's why referenced those common errors here for sharing our solutions.

> Table of contents
* [NGC](#ngcErrors)
* [TypeError: Cannot read property 'module' of undefined](#ngcErrorModuleUndefined)
* [TypeError: Cannot read property 'kind' of undefined](#ngcErrorKindUndefined)
* [Rollup](#rollupErrors)
* [(!) Unresolved dependencies detected](#rollupErrorUnresolvedDeps)

- [NGC](#ngcErrors)
- [TypeError: Cannot read property 'module' of undefined](#ngcErrorModuleUndefined)
- [TypeError: Cannot read property 'kind' of undefined](#ngcErrorKindUndefined)
- [Rollup](#rollupErrors)

- [(!) Unresolved dependencies detected](#rollupErrorUnresolvedDeps)

## <a id="ngcErrors"></a>NGC errors
#### <a id="ngcErrorModuleUndefined"></a>TypeError: Cannot read property 'module' of undefined

#### <a id="ngcErrorModuleUndefined"></a>TypeError: Cannot read property 'module' of undefined

In the cases we already saw, it was linked to an unexisting export in TypeScript.

```typescript
export * from "invalid path";
export * from "invalid path";
```

```bash
> ngc

Expand All @@ -37,35 +43,38 @@ npm ERR! @nationalbankbelgium/stark-core@0.0.0-PLACEHOLDER-VERSION ngc: `ngc`
npm ERR! Exit status 2
```

#### <a id="ngcErrorKindUndefined"></a>TypeError: Cannot read property 'kind' of undefined
#### <a id="ngcErrorKindUndefined"></a>TypeError: Cannot read property 'kind' of undefined

In the cases we already saw, it was linked to the class-validator decorator 'ValidateIf'.

Our mistake was we declared a function inside the decorate which triggered an error in NGC.

```typescript
// The following code is not working
export class StarkApplicationConfigImpl implements StarkApplicationConfig {
@ValidateIf((appConfig: StarkApplicationConfig) => appConfig.loggingFlushDisabled !== true)
@IsDefined()
@IsString()
@autoserialize
public loggingFlushApplicationId?: string;
@ValidateIf((appConfig: StarkApplicationConfig) => appConfig.loggingFlushDisabled !== true)
@IsDefined()
@IsString()
@autoserialize
public loggingFlushApplicationId?: string;
}

// The following code is working
export class StarkApplicationConfigImpl implements StarkApplicationConfig {
@ValidateIf(StarkApplicationConfigImpl.validateIfLoggingFlushEnabled)
@IsDefined()
@IsString()
@autoserialize
public loggingFlushApplicationId?: string;
// ...
public static validateIfLoggingFlushEnabled(instance: StarkApplicationConfig): boolean {
return instance.loggingFlushDisabled !== true;
}
@ValidateIf(StarkApplicationConfigImpl.validateIfLoggingFlushEnabled)
@IsDefined()
@IsString()
@autoserialize
public loggingFlushApplicationId?: string;

// ...

public static validateIfLoggingFlushEnabled(instance: StarkApplicationConfig): boolean {
return instance.loggingFlushDisabled !== true;
}
}
```

```bash
> ngc

Expand Down Expand Up @@ -99,11 +108,11 @@ You can simply add the missing dependencies as following:
// ...

const globals = {
// ...
"rxjs/observable/timer": "rxjs.observable.timer",
"rxjs/observable/throw": "rxjs.observable.throw"
// ...
}
// ...
"rxjs/observable/timer": "rxjs.observable.timer",
"rxjs/observable/throw": "rxjs.observable.throw"
// ...
};
```

Please ignore tslib unresolved dependency.
Expand Down
Loading

0 comments on commit 0ced55c

Please sign in to comment.