├── chapter06 ├── README.md ├── basic-mvc │ ├── .gitkeep │ ├── README.md │ ├── .editorconfig │ └── index.html ├── basic-mvc-twb │ ├── .gitkeep │ ├── README.md │ ├── .editorconfig │ └── index.html └── button-demo │ └── index.html ├── chapter09 └── README.md ├── chapter05 ├── router │ ├── .gitkeep │ └── README.md ├── binding │ ├── src │ │ ├── index.ts │ │ └── utils │ │ │ ├── Dep.ts │ │ │ └── Observe.ts │ └── REAMDE.md ├── js-template │ ├── .gitignore │ ├── src │ │ └── hyperscript-demo.js │ ├── index.html │ ├── package.json │ └── README.md ├── README.md ├── .editorconfig ├── binding-simple │ ├── README.md │ └── index.html ├── framework │ └── index.html └── template-engine │ ├── README.md │ └── assets │ └── simple.js ├── chapter10 ├── microapps │ ├── README.md │ ├── reports │ │ ├── src │ │ │ ├── assets │ │ │ │ └── .gitkeep │ │ │ ├── app │ │ │ │ ├── app.component.css │ │ │ │ ├── reports │ │ │ │ │ ├── reports.component.css │ │ │ │ │ ├── reports.component.html │ │ │ │ │ ├── reports.component.ts │ │ │ │ │ └── reports.module.ts │ │ │ │ ├── app.component.ts │ │ │ │ ├── app.component.html │ │ │ │ ├── app-routing.module.ts │ │ │ │ └── app.module.ts │ │ │ ├── environments │ │ │ │ └── environment.prod.ts │ │ │ ├── styles.css │ │ │ ├── favicon.ico │ │ │ ├── tsconfig.app.json │ │ │ ├── tsconfig.spec.json │ │ │ ├── index.html │ │ │ ├── tslint.json │ │ │ ├── main.ts │ │ │ └── browserslist │ │ ├── e2e │ │ │ ├── src │ │ │ │ ├── app.po.ts │ │ │ │ └── app.e2e-spec.ts │ │ │ └── tsconfig.e2e.json │ │ ├── .editorconfig │ │ ├── tsconfig.json │ │ └── .gitignore │ ├── settings │ │ ├── src │ │ │ ├── assets │ │ │ │ └── .gitkeep │ │ │ ├── app │ │ │ │ ├── app.component.css │ │ │ │ ├── settings │ │ │ │ │ ├── settings.component.css │ │ │ │ │ ├── settings.component.html │ │ │ │ │ ├── settings.component.ts │ │ │ │ │ └── settings.module.ts │ │ │ │ ├── app.component.ts │ │ │ │ ├── app.component.html │ │ │ │ ├── app-routing.module.ts │ │ │ │ └── app.module.ts │ │ │ ├── environments │ │ │ │ └── environment.prod.ts │ │ │ ├── styles.css │ │ │ ├── favicon.ico │ │ │ ├── tsconfig.app.json │ │ │ ├── tsconfig.spec.json │ │ │ ├── index.html │ │ │ ├── tslint.json │ │ │ ├── main.ts │ │ │ └── browserslist │ │ ├── e2e │ │ │ ├── src │ │ │ │ ├── app.po.ts │ │ │ │ └── app.e2e-spec.ts │ │ │ └── tsconfig.e2e.json │ │ ├── .editorconfig │ │ ├── tsconfig.json │ │ └── .gitignore │ ├── aofe-core │ │ ├── src │ │ │ ├── assets │ │ │ │ └── .gitkeep │ │ │ ├── app │ │ │ │ ├── app.component.css │ │ │ │ ├── app.component.ts │ │ │ │ ├── reports │ │ │ │ │ ├── reports.component.ts │ │ │ │ │ └── reports.module.ts │ │ │ │ ├── dashboard │ │ │ │ │ ├── dashboard.component.ts │ │ │ │ │ └── dashboard.module.ts │ │ │ │ ├── settings │ │ │ │ │ ├── settings.component.ts │ │ │ │ │ └── settings.module.ts │ │ │ │ ├── app.component.html │ │ │ │ ├── app.module.ts │ │ │ │ └── app-routing.module.ts │ │ │ ├── styles.css │ │ │ ├── environments │ │ │ │ └── environment.prod.ts │ │ │ ├── favicon.ico │ │ │ ├── tsconfig.app.json │ │ │ ├── tsconfig.spec.json │ │ │ ├── index.html │ │ │ ├── tslint.json │ │ │ ├── main.ts │ │ │ └── browserslist │ │ ├── e2e │ │ │ ├── src │ │ │ │ ├── app.po.ts │ │ │ │ └── app.e2e-spec.ts │ │ │ └── tsconfig.e2e.json │ │ ├── .editorconfig │ │ ├── scripts │ │ │ └── build.js │ │ ├── tsconfig.json │ │ └── .gitignore │ └── dashboard │ │ ├── src │ │ ├── assets │ │ │ └── .gitkeep │ │ ├── app │ │ │ ├── app.component.css │ │ │ ├── dashboard │ │ │ │ ├── dashboard.component.css │ │ │ │ ├── dashboard.component.html │ │ │ │ ├── dashboard.component.ts │ │ │ │ └── dashboard.module.ts │ │ │ ├── app.component.ts │ │ │ ├── app.component.html │ │ │ ├── app-routing.module.ts │ │ │ └── app.module.ts │ │ ├── styles.css │ │ ├── environments │ │ │ └── environment.prod.ts │ │ ├── favicon.ico │ │ ├── tsconfig.app.json │ │ ├── tsconfig.spec.json │ │ ├── index.html │ │ ├── tslint.json │ │ ├── main.ts │ │ └── browserslist │ │ ├── e2e │ │ ├── src │ │ │ ├── app.po.ts │ │ │ └── app.e2e-spec.ts │ │ └── tsconfig.e2e.json │ │ ├── .editorconfig │ │ ├── tsconfig.json │ │ └── .gitignore ├── lazyload-demo │ ├── src │ │ ├── assets │ │ │ └── .gitkeep │ │ ├── app │ │ │ ├── app.component.css │ │ │ ├── reports │ │ │ │ ├── reports.component.css │ │ │ │ ├── reports.component.html │ │ │ │ ├── reports.component.ts │ │ │ │ └── reports.module.ts │ │ │ ├── settings │ │ │ │ ├── settings.component.css │ │ │ │ ├── settings.component.html │ │ │ │ ├── settings.component.ts │ │ │ │ └── settings.module.ts │ │ │ ├── dashboard │ │ │ │ ├── dashboard.component.css │ │ │ │ ├── dashboard.component.html │ │ │ │ ├── dashboard.component.ts │ │ │ │ └── dashboard.module.ts │ │ │ ├── app.component.ts │ │ │ ├── app.component.html │ │ │ ├── app.module.ts │ │ │ └── app-routing.module.ts │ │ ├── environments │ │ │ └── environment.prod.ts │ │ ├── styles.css │ │ ├── favicon.ico │ │ ├── tsconfig.app.json │ │ ├── tsconfig.spec.json │ │ ├── index.html │ │ ├── tslint.json │ │ ├── main.ts │ │ ├── browserslist │ │ └── test.ts │ ├── e2e │ │ ├── src │ │ │ ├── app.po.ts │ │ │ └── app.e2e-spec.ts │ │ └── tsconfig.e2e.json │ ├── .editorconfig │ ├── tsconfig.json │ └── .gitignore ├── micro-components │ ├── src │ │ ├── assets │ │ │ └── .gitkeep │ │ ├── app │ │ │ ├── app.component.css │ │ │ ├── dashboard │ │ │ │ ├── dashboard │ │ │ │ │ ├── dashboard.component.css │ │ │ │ │ └── dashboard.component.html │ │ │ │ ├── widget-config.model.ts │ │ │ │ ├── dashboard.module.ts │ │ │ │ └── dashboard.service.ts │ │ │ ├── app.component.ts │ │ │ └── app.component.html │ │ ├── environments │ │ │ ├── environment.prod.ts │ │ │ └── environment.ts │ │ ├── styles.css │ │ ├── favicon.ico │ │ ├── typings.d.ts │ │ ├── tsconfig.app.json │ │ ├── index.html │ │ ├── tsconfig.spec.json │ │ ├── main.ts │ │ └── test.ts │ ├── widgets │ │ ├── widget-hello │ │ │ ├── src │ │ │ │ ├── main.ts │ │ │ │ └── widget-hello │ │ │ │ │ ├── a-nested.component.ts │ │ │ │ │ ├── widget-hello.component.ts │ │ │ │ │ └── widget-hello.module.ts │ │ │ └── package.json │ │ ├── widget-quotes │ │ │ ├── src │ │ │ │ ├── main.ts │ │ │ │ └── widget-quotes │ │ │ │ │ ├── quotes.model.ts │ │ │ │ │ └── quotes.service.ts │ │ │ └── package.json │ │ ├── widget-todays-date │ │ │ ├── src │ │ │ │ ├── main.ts │ │ │ │ └── widget-todays-date │ │ │ │ │ ├── widget-todays-date.module.ts │ │ │ │ │ └── widget-todays-date.component.ts │ │ │ └── package.json │ │ └── build_widgets.sh │ ├── README.md │ ├── e2e │ │ ├── src │ │ │ ├── app.po.ts │ │ │ └── app.e2e-spec.ts │ │ └── tsconfig.e2e.json │ ├── .editorconfig │ ├── tsconfig.json │ └── .gitignore ├── mooa-examples │ ├── mooa-app1 │ │ ├── src │ │ │ ├── assets │ │ │ │ └── .gitkeep │ │ │ ├── app │ │ │ │ ├── app.component.css │ │ │ │ ├── app.component.html │ │ │ │ ├── app-routing.module.ts │ │ │ │ └── app.component.ts │ │ │ ├── environments │ │ │ │ └── environment.prod.ts │ │ │ ├── styles.css │ │ │ ├── favicon.ico │ │ │ ├── tsconfig.app.json │ │ │ ├── tsconfig.spec.json │ │ │ ├── tslint.json │ │ │ ├── index.html │ │ │ ├── browserslist │ │ │ └── main.ts │ │ ├── e2e │ │ │ ├── src │ │ │ │ ├── app.po.ts │ │ │ │ └── app.e2e-spec.ts │ │ │ └── tsconfig.e2e.json │ │ ├── .editorconfig │ │ ├── tsconfig.json │ │ └── .gitignore │ └── mooa-hosts │ │ ├── src │ │ ├── assets │ │ │ ├── .gitkeep │ │ │ ├── app1 │ │ │ │ ├── styles.3bb2a9d4949b7dc120a9.css │ │ │ │ ├── favicon.ico │ │ │ │ ├── polyfills.908282e8e7f434e6eebf.js │ │ │ │ └── index.html │ │ │ └── apps.json │ │ ├── app │ │ │ ├── app.component.css │ │ │ ├── home │ │ │ │ ├── home.component.css │ │ │ │ ├── home.component.ts │ │ │ │ └── home.component.html │ │ │ ├── app.component.html │ │ │ └── app-routing.module.ts │ │ ├── styles.css │ │ ├── environments │ │ │ └── environment.prod.ts │ │ ├── favicon.ico │ │ ├── tsconfig.app.json │ │ ├── tsconfig.spec.json │ │ ├── index.html │ │ ├── tslint.json │ │ ├── main.ts │ │ └── browserslist │ │ ├── e2e │ │ ├── src │ │ │ ├── app.po.ts │ │ │ └── app.e2e-spec.ts │ │ └── tsconfig.e2e.json │ │ ├── .editorconfig │ │ ├── tsconfig.json │ │ └── .gitignore ├── nginx-microfrontends │ ├── ApplicationOne │ │ ├── src │ │ │ ├── assets │ │ │ │ └── .gitkeep │ │ │ ├── app │ │ │ │ ├── app.component.css │ │ │ │ ├── app.component.ts │ │ │ │ └── app.module.ts │ │ │ ├── environments │ │ │ │ └── environment.prod.ts │ │ │ ├── styles.css │ │ │ ├── favicon.ico │ │ │ ├── tsconfig.app.json │ │ │ ├── index.html │ │ │ ├── tsconfig.spec.json │ │ │ ├── tslint.json │ │ │ ├── browserslist │ │ │ └── main.ts │ │ ├── e2e │ │ │ ├── src │ │ │ │ ├── app.po.ts │ │ │ │ └── app.e2e-spec.ts │ │ │ └── tsconfig.e2e.json │ │ ├── .editorconfig │ │ ├── tsconfig.json │ │ └── .gitignore │ ├── ApplicationThree │ │ ├── src │ │ │ ├── assets │ │ │ │ └── .gitkeep │ │ │ ├── app │ │ │ │ ├── app.component.css │ │ │ │ └── app.component.ts │ │ │ ├── environments │ │ │ │ └── environment.prod.ts │ │ │ ├── styles.css │ │ │ ├── favicon.ico │ │ │ ├── tsconfig.app.json │ │ │ ├── index.html │ │ │ ├── tsconfig.spec.json │ │ │ ├── tslint.json │ │ │ └── browserslist │ │ ├── e2e │ │ │ ├── src │ │ │ │ ├── app.po.ts │ │ │ │ └── app.e2e-spec.ts │ │ │ └── tsconfig.e2e.json │ │ ├── .editorconfig │ │ ├── tsconfig.json │ │ └── .gitignore │ ├── ApplicationTwo │ │ ├── src │ │ │ ├── assets │ │ │ │ └── .gitkeep │ │ │ ├── app │ │ │ │ ├── app.component.css │ │ │ │ ├── app.component.ts │ │ │ │ └── app.module.ts │ │ │ ├── environments │ │ │ │ └── environment.prod.ts │ │ │ ├── styles.css │ │ │ ├── favicon.ico │ │ │ ├── tsconfig.app.json │ │ │ ├── index.html │ │ │ ├── tsconfig.spec.json │ │ │ ├── tslint.json │ │ │ ├── browserslist │ │ │ └── main.ts │ │ ├── e2e │ │ │ ├── src │ │ │ │ ├── app.po.ts │ │ │ │ └── app.e2e-spec.ts │ │ │ └── tsconfig.e2e.json │ │ ├── .editorconfig │ │ ├── tsconfig.json │ │ └── .gitignore │ ├── base-application │ │ ├── src │ │ │ ├── assets │ │ │ │ ├── .gitkeep │ │ │ │ ├── app1 │ │ │ │ │ ├── styles.bundle.css │ │ │ │ │ ├── favicon.ico │ │ │ │ │ ├── assets │ │ │ │ │ │ └── avatar.jpg │ │ │ │ │ └── index.html │ │ │ │ ├── avatar.jpg │ │ │ │ ├── help │ │ │ │ │ ├── avatar.jpg │ │ │ │ │ └── index.html │ │ │ │ └── iframe.html │ │ │ ├── app │ │ │ │ ├── games │ │ │ │ │ ├── games.component.css │ │ │ │ │ └── games.component.ts │ │ │ │ ├── graph │ │ │ │ │ ├── graph.component.css │ │ │ │ │ ├── graph.component.html │ │ │ │ │ └── graph.module.ts │ │ │ │ ├── home │ │ │ │ │ ├── home.component.css │ │ │ │ │ ├── home.component.html │ │ │ │ │ └── home.module.ts │ │ │ │ ├── reader │ │ │ │ │ ├── reader.component.css │ │ │ │ │ └── reader.component.ts │ │ │ │ ├── shopping │ │ │ │ │ ├── shopping.component.css │ │ │ │ │ └── shopping.component.ts │ │ │ │ ├── app.component.html │ │ │ │ ├── navbar │ │ │ │ │ ├── navbar.component.css │ │ │ │ │ └── navbar.component.ts │ │ │ │ ├── app.component.css │ │ │ │ └── pipes │ │ │ │ │ └── SafePipe.ts │ │ │ ├── environments │ │ │ │ └── environment.prod.ts │ │ │ ├── favicon.ico │ │ │ ├── styles.css │ │ │ ├── tsconfig.app.json │ │ │ ├── tsconfig.spec.json │ │ │ ├── tslint.json │ │ │ ├── browserslist │ │ │ ├── index.html │ │ │ └── main.ts │ │ ├── apps.txt │ │ ├── e2e │ │ │ ├── src │ │ │ │ ├── app.po.ts │ │ │ │ └── app.e2e-spec.ts │ │ │ └── tsconfig.e2e.json │ │ ├── .editorconfig │ │ ├── tsconfig.json │ │ └── .gitignore │ ├── .gitignore │ ├── nginx │ │ └── Dockerfile │ └── README.md ├── stencil-demo │ ├── src │ │ ├── components │ │ │ └── my-component │ │ │ │ ├── my-component.css │ │ │ │ └── my-component.tsx │ │ ├── utils │ │ │ └── utils.ts │ │ └── index.html │ ├── .editorconfig │ ├── stencil.config.ts │ ├── .gitignore │ └── tsconfig.json ├── react-micro-components │ ├── react-widget │ │ ├── public │ │ │ ├── favicon.ico │ │ │ └── manifest.json │ │ ├── src │ │ │ ├── App.test.js │ │ │ ├── index.css │ │ │ ├── index.js │ │ │ └── App.css │ │ ├── config │ │ │ └── jest │ │ │ │ └── cssTransform.js │ │ └── .gitignore │ ├── .editorconfig │ └── README.md ├── single-spa-sample │ ├── src │ │ ├── app2 │ │ │ ├── subroute1.component.ts │ │ │ ├── subroute2.component.ts │ │ │ └── app2.component.ts │ │ ├── app1 │ │ │ └── root.component.js │ │ └── root-application │ │ │ └── root-application.js │ ├── .babelrc │ └── tsconfig.json ├── README.md ├── wc-demo │ └── hello-world │ │ └── app.js └── router-dispatch │ └── nginx.conf ├── chapter04 ├── docker-react │ ├── src │ │ └── .gitkeep │ ├── README.md │ └── Dockerfile ├── gulp-examples │ ├── src │ │ ├── css │ │ │ └── styles.less │ │ ├── javascript │ │ │ └── index.js │ │ └── templates │ │ │ └── index.pug │ ├── .gitignore │ └── package.json ├── angular-examples │ ├── src │ │ ├── assets │ │ │ └── .gitkeep │ │ ├── app │ │ │ ├── app.component.css │ │ │ ├── app.component.ts │ │ │ └── app.module.ts │ │ ├── environments │ │ │ ├── environment.prod.ts │ │ │ └── environment.ts │ │ ├── styles.css │ │ ├── favicon.ico │ │ ├── tsconfig.app.json │ │ ├── index.html │ │ ├── tsconfig.spec.json │ │ ├── tslint.json │ │ ├── browserslist │ │ ├── main.ts │ │ └── test.ts │ ├── e2e │ │ ├── src │ │ │ ├── app.po.ts │ │ │ └── app.e2e-spec.ts │ │ └── tsconfig.e2e.json │ ├── .editorconfig │ ├── tsconfig.json │ └── .gitignore ├── gulp-grunt-webpack-compare │ ├── .gitignore │ ├── postcss.config.js │ ├── src │ │ └── styles.scss │ ├── README.md │ ├── .editorconfig │ ├── webpack.config.js │ ├── gulpfile.js │ └── gruntfile.js ├── react-webpack-demo │ ├── src │ │ ├── index.css │ │ ├── index.js │ │ ├── App.test.js │ │ ├── App.css │ │ └── App.js │ ├── public │ │ ├── favicon.ico │ │ └── manifest.json │ ├── config │ │ └── jest │ │ │ ├── fileTransform.js │ │ │ └── cssTransform.js │ ├── .gitignore │ └── Jenkinsfile └── README.md ├── chapter07 ├── vue-designsystem │ └── .gitkeep ├── wc-angular-demo │ ├── .gitkeep │ └── README.md ├── styleguide │ ├── src │ │ ├── homepage.md │ │ ├── button.html │ │ └── buttons.css │ ├── README.md │ └── styleguide │ │ └── kss-assets │ │ ├── sample.png │ │ ├── noise-low.png │ │ ├── sample-inline.png │ │ ├── github-fork--black.png │ │ ├── WARNING.txt │ │ ├── sample.svg │ │ └── sample-inline.svg └── designsystem │ ├── .storybook │ ├── addons.js │ └── config.js │ ├── public │ ├── favicon.ico │ └── manifest.json │ ├── README.md │ ├── README.old.md │ ├── src │ ├── App.test.js │ ├── index.css │ ├── index.js │ ├── App.css │ └── stories │ │ └── index.js │ └── .gitignore ├── chapter08 ├── moco-server │ ├── .gitignore │ ├── config.json │ ├── start.sh │ └── api │ │ ├── verify-token.json │ │ └── README.md ├── swagger-demo │ ├── api │ │ ├── helpers │ │ │ └── README.md │ │ ├── controllers │ │ │ └── README.md │ │ └── mocks │ │ │ └── README.md │ ├── config │ │ └── README.md │ ├── test │ │ └── api │ │ │ ├── helpers │ │ │ └── README.md │ │ │ └── controllers │ │ │ └── README.md │ ├── package.json │ └── app.js ├── jest-contract-test │ ├── README.md │ ├── __tests__ │ │ └── api.test.js │ └── .editorconfig ├── json-mock-server │ ├── example.json │ └── README.md ├── graphql-demo │ ├── README.md │ ├── .editorconfig │ └── package.json └── contract-test │ └── README.md ├── images └── 9787121365348.jpg └── .editorconfig /chapter06/README.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter09/README.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter05/router/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter06/basic-mvc/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter05/binding/src/index.ts: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter06/basic-mvc-twb/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter06/basic-mvc-twb/README.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/microapps/README.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter04/docker-react/src/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter07/vue-designsystem/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter07/wc-angular-demo/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter04/gulp-examples/src/css/styles.less: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter05/binding/REAMDE.md: -------------------------------------------------------------------------------- 1 | # 双向绑定示例 2 | -------------------------------------------------------------------------------- /chapter07/styleguide/src/homepage.md: -------------------------------------------------------------------------------- 1 | # home -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter04/gulp-examples/.gitignore: -------------------------------------------------------------------------------- 1 | build/ 2 | -------------------------------------------------------------------------------- /chapter04/gulp-examples/src/javascript/index.js: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter04/gulp-examples/src/templates/index.pug: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter05/js-template/.gitignore: -------------------------------------------------------------------------------- 1 | bundle.js 2 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter07/styleguide/src/button.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/reports/reports.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/settings/settings.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter08/moco-server/.gitignore: -------------------------------------------------------------------------------- 1 | moco-runner-0.12.0-standalone.jar -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/dashboard/dashboard.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/app/reports/reports.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/app/settings/settings.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/app/home/home.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter04/gulp-grunt-webpack-compare/.gitignore: -------------------------------------------------------------------------------- 1 | dist 2 | .sass-cache 3 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/app/dashboard/dashboard.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/stencil-demo/src/components/my-component/my-component.css: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/app/dashboard/dashboard/dashboard.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/assets/app1/styles.3bb2a9d4949b7dc120a9.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/games/games.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/graph/graph.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/home/home.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/reader/reader.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter08/swagger-demo/api/helpers/README.md: -------------------------------------------------------------------------------- 1 | Place helper files in this directory. 2 | -------------------------------------------------------------------------------- /chapter08/swagger-demo/config/README.md: -------------------------------------------------------------------------------- 1 | Place configuration files in this directory. 2 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/shopping/shopping.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /chapter07/styleguide/README.md: -------------------------------------------------------------------------------- 1 | Setup 2 | === 3 | 4 | 5 | ``` 6 | npm install -g kss 7 | ``` -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/.gitignore: -------------------------------------------------------------------------------- 1 | # Created by .ignore support plugin (hsz.mobi) 2 | -------------------------------------------------------------------------------- /chapter08/swagger-demo/api/controllers/README.md: -------------------------------------------------------------------------------- 1 | Place your controllers in this directory. 2 | -------------------------------------------------------------------------------- /chapter08/swagger-demo/api/mocks/README.md: -------------------------------------------------------------------------------- 1 | Place controllers for mock mode in this directory. 2 | -------------------------------------------------------------------------------- /chapter08/swagger-demo/test/api/helpers/README.md: -------------------------------------------------------------------------------- 1 | Place your helper tests in this directory. 2 | -------------------------------------------------------------------------------- /chapter08/moco-server/config.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "include": "api/verify-token.json" 4 | } 5 | ] -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/reports/reports.component.html: -------------------------------------------------------------------------------- 1 |

2 | reports works! 3 |

4 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/settings/settings.component.html: -------------------------------------------------------------------------------- 1 |

2 | settings works! 3 |

4 | -------------------------------------------------------------------------------- /images/9787121365348.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/images/9787121365348.jpg -------------------------------------------------------------------------------- /chapter08/swagger-demo/test/api/controllers/README.md: -------------------------------------------------------------------------------- 1 | Place your controller tests in this directory. 2 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/dashboard/dashboard.component.html: -------------------------------------------------------------------------------- 1 |

2 | dashboard works! 3 |

4 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/app/reports/reports.component.html: -------------------------------------------------------------------------------- 1 |

2 | reports works! 3 |

4 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/app/settings/settings.component.html: -------------------------------------------------------------------------------- 1 |

2 | settings works! 3 |

4 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/app/dashboard/dashboard.component.html: -------------------------------------------------------------------------------- 1 |

2 | dashboard works! 3 |

4 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | -------------------------------------------------------------------------------- /chapter08/jest-contract-test/README.md: -------------------------------------------------------------------------------- 1 | # 前端契约测试 2 | 3 | 4 | [Jest 契约测试示例](https://github.com/vnglst/mocking-with-jest) -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /chapter04/react-webpack-demo/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | padding: 0; 4 | font-family: sans-serif; 5 | } 6 | -------------------------------------------------------------------------------- /chapter08/moco-server/start.sh: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | 3 | java -jar moco-runner-0.12.0-standalone.jar http -p 12306 -g config.json 4 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /chapter04/docker-react/README.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | Dockerfile 和 Nginx 代码基于 [docker-nginx-react](https://github.com/zzswang/docker-nginx-react) -------------------------------------------------------------------------------- /chapter07/wc-angular-demo/README.md: -------------------------------------------------------------------------------- 1 | 源码码：[https://github.com/phodal/wc-angular-demo](https://github.com/phodal/wc-angular-demo) 2 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/lazyload-demo/src/favicon.ico -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-hello/src/main.ts: -------------------------------------------------------------------------------- 1 | export { WidgetHelloModule } from './widget-hello/widget-hello.module'; -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-quotes/src/main.ts: -------------------------------------------------------------------------------- 1 | export { WidgetQuotesModule } from './widget-quotes/widget-quotes.module' -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/nginx/Dockerfile: -------------------------------------------------------------------------------- 1 | FROM nginx:1.13.3-alpine 2 | 3 | COPY configuration/default.conf /etc/nginx/conf.d/ -------------------------------------------------------------------------------- /chapter04/angular-examples/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter04/angular-examples/src/favicon.ico -------------------------------------------------------------------------------- /chapter04/gulp-grunt-webpack-compare/postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | 'autoprefixer': {} 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /chapter04/gulp-grunt-webpack-compare/src/styles.scss: -------------------------------------------------------------------------------- 1 | $color: #388; 2 | 3 | html { 4 | overflow: auto; 5 | color: $color; 6 | } 7 | -------------------------------------------------------------------------------- /chapter07/designsystem/.storybook/addons.js: -------------------------------------------------------------------------------- 1 | import '@storybook/addon-actions/register'; 2 | import '@storybook/addon-links/register'; 3 | -------------------------------------------------------------------------------- /chapter07/designsystem/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter07/designsystem/public/favicon.ico -------------------------------------------------------------------------------- /chapter10/micro-components/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/micro-components/src/favicon.ico -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/microapps/reports/src/favicon.ico -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/microapps/settings/src/favicon.ico -------------------------------------------------------------------------------- /chapter04/react-webpack-demo/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter04/react-webpack-demo/public/favicon.ico -------------------------------------------------------------------------------- /chapter10/micro-components/src/app/dashboard/dashboard/dashboard.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/microapps/aofe-core/src/favicon.ico -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/microapps/dashboard/src/favicon.ico -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-todays-date/src/main.ts: -------------------------------------------------------------------------------- 1 | export { WidgetTodaysDateModule } from './widget-todays-date/widget-todays-date.module'; -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/mooa-examples/mooa-app1/src/favicon.ico -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-quotes/src/widget-quotes/quotes.model.ts: -------------------------------------------------------------------------------- 1 | interface Quotes { 2 | contents: { quotes: { quote: string }[] }; 3 | } -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/mooa-examples/mooa-hosts/src/favicon.ico -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/README.md: -------------------------------------------------------------------------------- 1 | 基于 [https://github.com/GeoffSeloana/nginx-micro-frontends](https://github.com/GeoffSeloana/nginx-micro-frontends) 2 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/home/home.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | -------------------------------------------------------------------------------- /chapter07/styleguide/styleguide/kss-assets/sample.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter07/styleguide/styleguide/kss-assets/sample.png -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/assets/app1/styles.bundle.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ -------------------------------------------------------------------------------- /chapter07/designsystem/README.md: -------------------------------------------------------------------------------- 1 | ``` 2 | npx create-react-app designsystem 3 | ``` 4 | 5 | 6 | 7 | ``` 8 | npx -p @storybook/cli@rc sb init 9 | ``` 10 | -------------------------------------------------------------------------------- /chapter07/styleguide/styleguide/kss-assets/noise-low.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter07/styleguide/styleguide/kss-assets/noise-low.png -------------------------------------------------------------------------------- /chapter10/micro-components/src/typings.d.ts: -------------------------------------------------------------------------------- 1 | /* SystemJS module definition */ 2 | declare var module: NodeModule; 3 | interface NodeModule { 4 | id: string; 5 | } 6 | -------------------------------------------------------------------------------- /chapter04/gulp-grunt-webpack-compare/README.md: -------------------------------------------------------------------------------- 1 | 2 | Install 3 | 4 | ``` 5 | npm install -g gulp grunt 6 | ``` 7 | 8 | ``` 9 | npm install -g webpack-cli 10 | ``` 11 | -------------------------------------------------------------------------------- /chapter07/designsystem/README.old.md: -------------------------------------------------------------------------------- 1 | # Setup 2 | 3 | ``` 4 | npx create-react-app designsystem 5 | ``` 6 | 7 | ``` 8 | npx -p @storybook/cli@rc sb init 9 | ``` 10 | -------------------------------------------------------------------------------- /chapter07/styleguide/styleguide/kss-assets/sample-inline.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter07/styleguide/styleguide/kss-assets/sample-inline.png -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/assets/app1/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/mooa-examples/mooa-hosts/src/assets/app1/favicon.ico -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/nginx-microfrontends/ApplicationOne/src/favicon.ico -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/nginx-microfrontends/ApplicationTwo/src/favicon.ico -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/nginx-microfrontends/ApplicationThree/src/favicon.ico -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/nginx-microfrontends/base-application/src/favicon.ico -------------------------------------------------------------------------------- /chapter10/react-micro-components/react-widget/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/react-micro-components/react-widget/public/favicon.ico -------------------------------------------------------------------------------- /chapter07/styleguide/styleguide/kss-assets/github-fork--black.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter07/styleguide/styleguide/kss-assets/github-fork--black.png -------------------------------------------------------------------------------- /chapter08/json-mock-server/example.json: -------------------------------------------------------------------------------- 1 | { 2 | "projects": [ 3 | {"id": 1, "title": "aofe", "author": "phodal"}, 4 | {"id": 2, "title": "adr", "author": "phodal"} 5 | ] 6 | } -------------------------------------------------------------------------------- /chapter07/styleguide/styleguide/kss-assets/WARNING.txt: -------------------------------------------------------------------------------- 1 | WARNING: This folder is deleted and re-recreated each time the style guide is 2 | built. Do NOT put your own files in this folder. 3 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/app/dashboard/widget-config.model.ts: -------------------------------------------------------------------------------- 1 | export interface WidgetConfig { 2 | name: string; 3 | moduleBundlePath: string; 4 | moduleName: string; 5 | } 6 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/graph/graph.component.html: -------------------------------------------------------------------------------- 1 |
2 |

3 |

4 | 5 |
6 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/assets/avatar.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/nginx-microfrontends/base-application/src/assets/avatar.jpg -------------------------------------------------------------------------------- /chapter08/graphql-demo/README.md: -------------------------------------------------------------------------------- 1 | # GraphQL as BFF 2 | 3 | 4 | ``` 5 | query make { 6 | make(id: "2") { 7 | id, 8 | category, 9 | featured_image 10 | } 11 | } 12 | ``` 13 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/assets/help/avatar.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/nginx-microfrontends/base-application/src/assets/help/avatar.jpg -------------------------------------------------------------------------------- /chapter07/designsystem/.storybook/config.js: -------------------------------------------------------------------------------- 1 | import { configure } from '@storybook/react'; 2 | 3 | function loadStories() { 4 | require('../src/stories'); 5 | } 6 | 7 | configure(loadStories, module); 8 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/assets/app1/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/nginx-microfrontends/base-application/src/assets/app1/favicon.ico -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/assets/app1/polyfills.908282e8e7f434e6eebf.js: -------------------------------------------------------------------------------- 1 | (window.webpackJsonp=window.webpackJsonp||[]).push([[2],{1:function(n,o,p){n.exports=p("hN/g")},"hN/g":function(n,o){}},[[1,0]]]); -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/apps.txt: -------------------------------------------------------------------------------- 1 | http://mooa.phodal.com/assets/app1 2 | http://mooa.phodal.com/assets/help 3 | http://localhost:8081/ 4 | http://localhost:8082/ 5 | http://localhost:8083/ 6 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/assets/app1/assets/avatar.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/aofe.code/master/chapter10/nginx-microfrontends/base-application/src/assets/app1/assets/avatar.jpg -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | 5 |
6 | 7 |
8 | -------------------------------------------------------------------------------- /chapter10/micro-components/README.md: -------------------------------------------------------------------------------- 1 | # MicroComponents 2 | 3 | 基于 [https://paucls.wordpress.com/2018/05/10/angular-pluggable-architecture/](https://paucls.wordpress.com/2018/05/10/angular-pluggable-architecture/) 4 | 5 | 6 | -------------------------------------------------------------------------------- /chapter06/basic-mvc/README.md: -------------------------------------------------------------------------------- 1 | 原始代码基于：[https://medium.com/@patrickackerman/classic-front-end-mvc-with-vanilla-javascript-7eee550bc702](https://medium.com/@patrickackerman/classic-front-end-mvc-with-vanilla-javascript-7eee550bc702) 2 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | body, html { 3 | margin: 0; 4 | padding: 0; 5 | height: 100%; 6 | width: 100% 7 | } 8 | -------------------------------------------------------------------------------- /chapter10/stencil-demo/src/utils/utils.ts: -------------------------------------------------------------------------------- 1 | 2 | export function format(first: string, middle: string, last: string): string { 3 | return ( 4 | (first || '') + 5 | (middle ? ` ${middle}` : '') + 6 | (last ? ` ${last}` : '') 7 | ); 8 | } 9 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent {} 9 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/single-spa-sample/src/app2/subroute1.component.ts: -------------------------------------------------------------------------------- 1 | import {Component} from '@angular/core'; 2 | 3 | @Component({ 4 | template: ` 5 |
6 | Subroute 1 is working! 7 |
8 | `, 9 | }) 10 | export class Subroute1 { 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/single-spa-sample/src/app2/subroute2.component.ts: -------------------------------------------------------------------------------- 1 | import {Component} from '@angular/core'; 2 | 3 | @Component({ 4 | template: ` 5 |
6 | Subroute 2 is working! 7 |
8 | `, 9 | }) 10 | export class Subroute2 { 11 | } 12 | -------------------------------------------------------------------------------- /chapter04/docker-react/Dockerfile: -------------------------------------------------------------------------------- 1 | FROM nginx:alpine 2 | 3 | COPY nginx-site.conf /etc/nginx/conf.d/app.conf.template 4 | COPY start-nginx.sh /usr/sbin/start 5 | 6 | RUN chmod u+x /usr/sbin/start 7 | 8 | EXPOSE 80 443 9 | WORKDIR ${APP_DIR} 10 | 11 | CMD [ "start" ] -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/single-spa-sample/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["env", { 4 | "targets": { 5 | "browsers": ["last 2 versions"] 6 | } 7 | }], 8 | ["react"] 9 | ], 10 | "plugins": [ 11 | "syntax-dynamic-import", 12 | ] 13 | } 14 | -------------------------------------------------------------------------------- /chapter05/README.md: -------------------------------------------------------------------------------- 1 | 《前端架构》第三章源码 2 | === 3 | 4 | ### 目录 5 | 6 | ``` 7 | ├── ajax Ajax 请求示例 8 | ├── binding-simple 双向绑定示例 9 | ├── js-template JavaScript 模板引擎示例 10 | ├── router 路由示例 11 | └── template-engine 字符串模板引擎示例 12 | ``` 13 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 |

3 | APP 2 Router 4 |

5 |
6 | 7 |

8 | Mooa App1 9 |

10 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "types": [] 6 | }, 7 | "exclude": [ 8 | "test.ts", 9 | "**/*.spec.ts" 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /chapter05/js-template/src/hyperscript-demo.js: -------------------------------------------------------------------------------- 1 | var h = require('virtual-dom/h'); 2 | var createElement = require('virtual-dom/create-element'); 3 | 4 | var result = h('a', {href: 'https://aofe.phodal.com/'}, 'aofe'); 5 | var node = createElement(result); 6 | document.body.appendChild(node); 7 | -------------------------------------------------------------------------------- /chapter08/jest-contract-test/__tests__/api.test.js: -------------------------------------------------------------------------------- 1 | describe('#API Contract Test', () => { 2 | it('should return correctly data', async () => { 3 | const data = await mockHttp.getBook('1') 4 | expect(data).toBeDefined() 5 | expect(data.entity.name).toEqual('前端架构') 6 | }); 7 | }); -------------------------------------------------------------------------------- /chapter10/single-spa-sample/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "sourceMap": true, 4 | "target": "es5", 5 | "module": "commonjs", 6 | "moduleResolution": "node", 7 | "lib": ["es5", "es6", "dom"], 8 | "experimentalDecorators": true 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "es2015", 6 | "types": [] 7 | }, 8 | "exclude": [ 9 | "src/test.ts", 10 | "**/*.spec.ts" 11 | ] 12 | } 13 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter04/README.md: -------------------------------------------------------------------------------- 1 | ``` 2 | ├── angular-examples Angular 示例 3 | ├── docker-react React 的 Docker 示例 4 | ├── gulp-examples Gulp 构建示例 5 | ├── gulp-grunt-webpack-compare Gulp、Grunt、WebPack 构建示例 6 | └── react-webpack-demo React 打包 WebPack 示例 7 | ``` 8 | -------------------------------------------------------------------------------- /chapter04/angular-examples/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/micro-components/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'app'; 10 | } 11 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getTitleText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter08/moco-server/api/verify-token.json: -------------------------------------------------------------------------------- 1 | [{ 2 | "request": { 3 | "method": "post", 4 | "uri": "/verify-token", 5 | "headers": { 6 | "authorization": "Bear 32423424324" 7 | } 8 | }, 9 | "response": { 10 | "status": 200, 11 | "text": "{ \"success\": true}" 12 | } 13 | }] -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'lazyload-demo'; 10 | } 11 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'dashboard'; 10 | } 11 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'reports'; 10 | } 11 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'settings'; 10 | } 11 | -------------------------------------------------------------------------------- /chapter04/angular-examples/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter08/contract-test/README.md: -------------------------------------------------------------------------------- 1 | # 契约测试 2 | 3 | 官方文档： 4 | 5 | [Contract Test](https://spring.io/guides/gs/contract-rest/) 6 | 7 | 代码： 8 | 9 | [Contact Test Code](https://github.com/spring-guides/gs-contract-rest) 10 | 11 | [Pact](https://docs.pact.io/) 12 | 13 | [Dredd](https://github.com/apiaryio/dredd) -------------------------------------------------------------------------------- /chapter10/lazyload-demo/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter10/micro-components/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'lazyload-demo'; 10 | } 11 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "es2015", 6 | "types": [] 7 | }, 8 | "exclude": [ 9 | "src/test.ts", 10 | "**/*.spec.ts" 11 | ] 12 | } 13 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "es2015", 6 | "types": [] 7 | }, 8 | "exclude": [ 9 | "src/test.ts", 10 | "**/*.spec.ts" 11 | ] 12 | } 13 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter04/react-webpack-demo/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.css'; 4 | import App from './App'; 5 | import registerServiceWorker from './registerServiceWorker'; 6 | 7 | ReactDOM.render(, document.getElementById('root')); 8 | registerServiceWorker(); 9 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "baseUrl": "./", 6 | "module": "es2015", 7 | "types": [] 8 | }, 9 | "exclude": [ 10 | "test.ts", 11 | "**/*.spec.ts" 12 | ] 13 | } 14 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter10/microapps/settings/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-one', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'app'; 10 | } 11 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "es2015", 6 | "types": [] 7 | }, 8 | "exclude": [ 9 | "src/test.ts", 10 | "**/*.spec.ts" 11 | ] 12 | } 13 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-two', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.css'] 7 | }) 8 | export class AppComponent { 9 | title = 'app'; 10 | } 11 | -------------------------------------------------------------------------------- /chapter07/designsystem/src/App.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | it('renders without crashing', () => { 6 | const div = document.createElement('div'); 7 | ReactDOM.render(, div); 8 | ReactDOM.unmountComponentAtNode(div); 9 | }); 10 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get('/'); 6 | } 7 | 8 | getParagraphText() { 9 | return element(by.css('app-root h1')).getText(); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter04/react-webpack-demo/src/App.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | it('renders without crashing', () => { 6 | const div = document.createElement('div'); 7 | ReactDOM.render(, div); 8 | ReactDOM.unmountComponentAtNode(div); 9 | }); 10 | -------------------------------------------------------------------------------- /chapter05/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } -------------------------------------------------------------------------------- /chapter06/basic-mvc-twb/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter06/basic-mvc/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter08/graphql-demo/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/README.md: -------------------------------------------------------------------------------- 1 | 微前端相关框架 2 | === 3 | 4 | 5 | 6 | HTML 加载方案： [https://github.com/mnot/hinclude](https://github.com/mnot/hinclude) 7 | 8 | 9 | ### DDD 与事件风暴 10 | 11 | [在微服务中使用领域事件](https://insights.thoughtworks.cn/use-domain-events-in-microservices/) 12 | 13 | 14 | [基于 webpack 的持久化缓存方案](https://github.com/pigcan/blog/issues/9) -------------------------------------------------------------------------------- /chapter10/single-spa-sample/src/app1/root.component.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | export default class Root extends React.Component { 4 | render() { 5 | return ( 6 |
7 | This was rendered by app 1, which is written in React. 8 |
9 | ); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /chapter04/angular-examples/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter05/binding-simple/README.md: -------------------------------------------------------------------------------- 1 | # 简单的双向绑定示例 2 | 3 | 原始代码：[https://github.com/SantiagoGdaR/js-two-way-binding](https://github.com/SantiagoGdaR/js-two-way-binding) 4 | 5 | 6 | 相关资源 7 | --- 8 | 9 | - [剖析Vue实现原理 - 如何实现双向绑定mvvm](https://github.com/DMQ/mvvm) 10 | - [Rivets](https://github.com/mikeric/rivets) 一个轻量级的双向绑定库 11 | 12 | 13 | -------------------------------------------------------------------------------- /chapter08/jest-contract-test/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/micro-components/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/app/reports/reports.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-reports', 5 | template: '

reports

' 6 | }) 7 | export class ReportsComponent implements OnInit { 8 | 9 | constructor() { } 10 | 11 | ngOnInit() { 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/react-micro-components/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/react-micro-components/react-widget/src/App.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | it('renders without crashing', () => { 6 | const div = document.createElement('div'); 7 | ReactDOM.render(, div); 8 | ReactDOM.unmountComponentAtNode(div); 9 | }); 10 | -------------------------------------------------------------------------------- /chapter10/stencil-demo/.editorconfig: -------------------------------------------------------------------------------- 1 | # http://editorconfig.org 2 | 3 | root = true 4 | 5 | [*] 6 | charset = utf-8 7 | indent_style = space 8 | indent_size = 2 9 | end_of_line = lf 10 | insert_final_newline = true 11 | trim_trailing_whitespace = true 12 | 13 | [*.md] 14 | insert_final_newline = false 15 | trim_trailing_whitespace = false 16 | -------------------------------------------------------------------------------- /chapter04/gulp-grunt-webpack-compare/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |

app

2 | 7 | 8 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/app/dashboard/dashboard.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-dashboard', 5 | template: '

settings

' 6 | }) 7 | export class DashboardComponent implements OnInit { 8 | 9 | constructor() { } 10 | 11 | ngOnInit() { 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/app/settings/settings.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-settings', 5 | template: '

settings

' 6 | }) 7 | export class SettingsComponent implements OnInit { 8 | 9 | constructor() { } 10 | 11 | ngOnInit() { 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |

app

2 | 7 | 8 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | 4 | const routes: Routes = []; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forRoot(routes)], 8 | exports: [RouterModule] 9 | }) 10 | export class AppRoutingModule { } 11 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | 4 | const routes: Routes = []; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forRoot(routes)], 8 | exports: [RouterModule] 9 | }) 10 | export class AppRoutingModule { } 11 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/navbar/navbar.component.css: -------------------------------------------------------------------------------- 1 | :host { 2 | height: 100%; 3 | } 4 | 5 | a { 6 | margin: 1em; 7 | } 8 | 9 | a.active { 10 | color: #fff; 11 | } 12 | 13 | p { 14 | margin-bottom: 0; 15 | } 16 | 17 | span { 18 | color: #fff; 19 | padding-left: 1.5em; 20 | font-size: 0.66em; 21 | } 22 | -------------------------------------------------------------------------------- /chapter10/stencil-demo/stencil.config.ts: -------------------------------------------------------------------------------- 1 | import { Config } from '@stencil/core'; 2 | 3 | export const config: Config = { 4 | namespace: 'mycomponent', 5 | outputTargets:[ 6 | { type: 'dist' }, 7 | { type: 'docs' }, 8 | { 9 | type: 'www', 10 | serviceWorker: null // disable service workers 11 | } 12 | ] 13 | }; 14 | -------------------------------------------------------------------------------- /chapter07/styleguide/src/buttons.css: -------------------------------------------------------------------------------- 1 | // Button 2 | // 3 | // Your standard button suitable for clicking. 4 | // 5 | // :hover - Highlights when hovering. 6 | // .shiny - Do not press this big, shiny, red button. 7 | // 8 | // Markup: button.html 9 | // 10 | // Style guide: components.button 11 | .button { 12 | 13 | } 14 | .button.shiny { 15 | 16 | } -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |

app

2 | 7 | 8 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |

app

2 | 7 | 8 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |

app

2 | 7 | 8 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /chapter05/framework/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/app.component.css: -------------------------------------------------------------------------------- 1 | :host { 2 | padding: 0 0 !important; 3 | height: 100% !important; 4 | } 5 | 6 | .nav-bar { 7 | width: 10%; 8 | padding-top: 2em; 9 | float: left; 10 | height: 100%; 11 | background-color: #333; 12 | } 13 | 14 | .app { 15 | width: 90%; 16 | float: right; 17 | height: 100%; 18 | } 19 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /chapter10/stencil-demo/.gitignore: -------------------------------------------------------------------------------- 1 | dist/ 2 | www/ 3 | 4 | *~ 5 | *.sw[mnpcod] 6 | *.log 7 | *.lock 8 | *.tmp 9 | *.tmp.* 10 | log.txt 11 | *.sublime-project 12 | *.sublime-workspace 13 | 14 | .stencil/ 15 | .idea/ 16 | .vscode/ 17 | .sass-cache/ 18 | .versions/ 19 | node_modules/ 20 | $RECYCLE.BIN/ 21 | 22 | .DS_Store 23 | Thumbs.db 24 | UserInterfaceState.xcuserstate 25 | .env 26 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/app/home/home.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-home', 5 | templateUrl: './home.component.html', 6 | styleUrls: ['./home.component.css'] 7 | }) 8 | export class HomeComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/assets/iframe.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | App1 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | LazyloadDemo 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Dashboard 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-hello/src/widget-hello/a-nested.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'exclamations', 5 | template: ` 6 | !!! 7 | ` 8 | }) 9 | export class ANestedComponent implements OnInit { 10 | 11 | constructor() { } 12 | 13 | ngOnInit() { } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Reports 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/reports/reports.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-reports', 5 | templateUrl: './reports.component.html', 6 | styleUrls: ['./reports.component.css'] 7 | }) 8 | export class ReportsComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | AofeCore 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Dashboard 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/app/reports/reports.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-reports', 5 | templateUrl: './reports.component.html', 6 | styleUrls: ['./reports.component.css'] 7 | }) 8 | export class ReportsComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Settings 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | AngularExamples 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/settings/settings.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-settings', 5 | templateUrl: './settings.component.html', 6 | styleUrls: ['./settings.component.css'] 7 | }) 8 | export class SettingsComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | MooaHosts 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/home/home.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {HomeComponent} from './home.component'; 4 | 5 | @NgModule({ 6 | imports: [ 7 | CommonModule, 8 | ], 9 | declarations: [HomeComponent], 10 | exports: [HomeComponent] 11 | }) 12 | export class HomeModule { 13 | } 14 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "test.ts", 12 | "polyfills.ts" 13 | ], 14 | "include": [ 15 | "**/*.spec.ts", 16 | "**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /chapter04/react-webpack-demo/config/jest/fileTransform.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const path = require('path'); 4 | 5 | // This is a custom Jest transformer turning file imports into filenames. 6 | // http://facebook.github.io/jest/docs/en/webpack.html 7 | 8 | module.exports = { 9 | process(src, filename) { 10 | return `module.exports = ${JSON.stringify(path.basename(filename))};`; 11 | }, 12 | }; 13 | -------------------------------------------------------------------------------- /chapter05/js-template/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getTitleText()).toEqual('Welcome to lazyload-demo!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/dashboard/dashboard.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-dashboard', 5 | templateUrl: './dashboard.component.html', 6 | styleUrls: ['./dashboard.component.css'] 7 | }) 8 | export class DashboardComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getTitleText()).toEqual('Welcome to reports!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getTitleText()).toEqual('Welcome to settings!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/app/settings/settings.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-settings', 5 | templateUrl: './settings.component.html', 6 | styleUrls: ['./settings.component.css'] 7 | }) 8 | export class SettingsComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/games/games.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-games', 5 | templateUrl: './games.component.html', 6 | styleUrls: ['./games.component.css'] 7 | }) 8 | export class GamesComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "module": "commonjs", 6 | "types": [ 7 | "jasmine", 8 | "node" 9 | ] 10 | }, 11 | "files": [ 12 | "test.ts", 13 | "polyfills.ts" 14 | ], 15 | "include": [ 16 | "**/*.spec.ts", 17 | "**/*.d.ts" 18 | ] 19 | } 20 | -------------------------------------------------------------------------------- /chapter07/designsystem/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | } 10 | ], 11 | "start_url": ".", 12 | "display": "standalone", 13 | "theme_color": "#000000", 14 | "background_color": "#ffffff" 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "baseUrl": "./", 6 | "module": "commonjs", 7 | "types": [ 8 | "jasmine", 9 | "node" 10 | ] 11 | }, 12 | "files": [ 13 | "test.ts" 14 | ], 15 | "include": [ 16 | "**/*.spec.ts", 17 | "**/*.d.ts" 18 | ] 19 | } 20 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getTitleText()).toEqual('Welcome to aofe-core!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getTitleText()).toEqual('Welcome to dashboard!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/app/dashboard/dashboard.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-dashboard', 5 | templateUrl: './dashboard.component.html', 6 | styleUrls: ['./dashboard.component.css'] 7 | }) 8 | export class DashboardComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/navbar/navbar.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-navbar', 5 | templateUrl: './navbar.component.html', 6 | styleUrls: ['./navbar.component.css'] 7 | }) 8 | export class NavbarComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/reader/reader.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-reader', 5 | templateUrl: './reader.component.html', 6 | styleUrls: ['./reader.component.css'] 7 | }) 8 | export class ReaderComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /chapter04/angular-examples/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getParagraphText()).toEqual('Welcome to angular-examples!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter04/react-webpack-demo/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | 6 | # testing 7 | /coverage 8 | 9 | # production 10 | /build 11 | 12 | # misc 13 | .DS_Store 14 | .env.local 15 | .env.development.local 16 | .env.test.local 17 | .env.production.local 18 | 19 | npm-debug.log* 20 | yarn-debug.log* 21 | yarn-error.log* 22 | -------------------------------------------------------------------------------- /chapter05/template-engine/README.md: -------------------------------------------------------------------------------- 1 | 字符串模板引擎 2 | === 3 | 4 | 5 | 相关开源项目 6 | 7 | - [https://github.com/trix/nano](https://github.com/trix/nano) 不到 10 行的模板引擎示例 8 | - [https://github.com/blueimp/JavaScript-Templates](https://github.com/blueimp/JavaScript-Templates) 不到 100 行的轻量级的模板引擎 9 | - [mustache.js](https://github.com/janl/mustache.js/) 模板引擎 10 | - [handlebars.js](https://github.com/wycats/handlebars.js/) 模板引擎 11 | -------------------------------------------------------------------------------- /chapter10/micro-components/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getTitleText()).toEqual('Welcome to micro-components!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getTitleText()).toEqual('Welcome to mooa-app1!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getTitleText()).toEqual('Welcome to mooa-hosts!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | ApplicationTwo 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /chapter07/designsystem/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | 6 | # testing 7 | /coverage 8 | 9 | # production 10 | /build 11 | 12 | # misc 13 | .DS_Store 14 | .env.local 15 | .env.development.local 16 | .env.test.local 17 | .env.production.local 18 | 19 | npm-debug.log* 20 | yarn-debug.log* 21 | yarn-error.log* 22 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | ApplicationThree 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | 4 | import { AppComponent } from './app.component'; 5 | 6 | @NgModule({ 7 | declarations: [ 8 | AppComponent 9 | ], 10 | imports: [ 11 | BrowserModule 12 | ], 13 | providers: [], 14 | bootstrap: [AppComponent] 15 | }) 16 | export class AppModule { } 17 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /chapter04/react-webpack-demo/config/jest/cssTransform.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | // This is a custom Jest transformer turning style imports into empty objects. 4 | // http://facebook.github.io/jest/docs/en/webpack.html 5 | 6 | module.exports = { 7 | process() { 8 | return 'module.exports = {};'; 9 | }, 10 | getCacheKey() { 11 | // The output is always the same. 12 | return 'cssTransform'; 13 | }, 14 | }; 15 | -------------------------------------------------------------------------------- /chapter04/react-webpack-demo/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | } 10 | ], 11 | "start_url": "./index.html", 12 | "display": "standalone", 13 | "theme_color": "#000000", 14 | "background_color": "#ffffff" 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | ApplicationOne 6 | 7 | 8 | 9 | 10 | 11 | 12 | loading... 13 | 14 | 15 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/shopping/shopping.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-shopping', 5 | templateUrl: './shopping.component.html', 6 | styleUrls: ['./shopping.component.css'] 7 | }) 8 | export class ShoppingComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/app/home/home.component.html: -------------------------------------------------------------------------------- 1 |
2 | Home 3 |

4 | APP 1 5 |

6 |

7 | APP 1 Route 2 8 |

9 |
10 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "module": "commonjs", 6 | "types": [ 7 | "jasmine", 8 | "node" 9 | ] 10 | }, 11 | "files": [ 12 | "test.ts", 13 | "polyfills.ts" 14 | ], 15 | "include": [ 16 | "**/*.spec.ts", 17 | "**/*.d.ts" 18 | ] 19 | } 20 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "module": "commonjs", 6 | "types": [ 7 | "jasmine", 8 | "node" 9 | ] 10 | }, 11 | "files": [ 12 | "test.ts", 13 | "polyfills.ts" 14 | ], 15 | "include": [ 16 | "**/*.spec.ts", 17 | "**/*.d.ts" 18 | ] 19 | } 20 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "module": "commonjs", 6 | "types": [ 7 | "jasmine", 8 | "node" 9 | ] 10 | }, 11 | "files": [ 12 | "test.ts", 13 | "polyfills.ts" 14 | ], 15 | "include": [ 16 | "**/*.spec.ts", 17 | "**/*.d.ts" 18 | ] 19 | } 20 | -------------------------------------------------------------------------------- /chapter10/react-micro-components/react-widget/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | } 10 | ], 11 | "start_url": ".", 12 | "display": "standalone", 13 | "theme_color": "#000000", 14 | "background_color": "#ffffff" 15 | } 16 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # For IE 9-11 support, please uncomment the last line of the file and adjust as needed 5 | > 0.5% 6 | last 2 versions 7 | Firefox ESR 8 | not dead 9 | # IE 9-11 -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getParagraphText()).toEqual('Welcome to ApplicationOne!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getParagraphText()).toEqual('Welcome to ApplicationTwo!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/build_widgets.sh: -------------------------------------------------------------------------------- 1 | cd ./widget-hello 2 | yarn install 3 | yarn build 4 | cp dist/widget-hello.bundle.js widgets-repo/widgets/ 5 | cd .. 6 | 7 | cd ./widget-todays-date 8 | yarn install 9 | yarn build 10 | cp dist/widget-todays-date.bundle.js widgets-repo/widgets/ 11 | cd .. 12 | 13 | cd ./widget-quotes 14 | yarn install 15 | yarn build 16 | cp dist/widget-quotes.bundle.js widgets-repo/widgets/ 17 | cd .. 18 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getParagraphText()).toEqual('Welcome to ApplicationThree!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | 3 | describe('workspace-project App', () => { 4 | let page: AppPage; 5 | 6 | beforeEach(() => { 7 | page = new AppPage(); 8 | }); 9 | 10 | it('should display welcome message', () => { 11 | page.navigateTo(); 12 | expect(page.getParagraphText()).toEqual('Welcome to base-application!'); 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/pipes/SafePipe.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | import {DomSanitizer} from '@angular/platform-browser'; 3 | 4 | @Pipe({name: 'safe'}) 5 | export class SafePipe implements PipeTransform { 6 | constructor(private sanitizer: DomSanitizer) { 7 | } 8 | 9 | transform(url) { 10 | return this.sanitizer.bypassSecurityTrustResourceUrl(url); 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /chapter10/react-micro-components/react-widget/config/jest/cssTransform.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | // This is a custom Jest transformer turning style imports into empty objects. 4 | // http://facebook.github.io/jest/docs/en/webpack.html 5 | 6 | module.exports = { 7 | process() { 8 | return 'module.exports = {};'; 9 | }, 10 | getCacheKey() { 11 | // The output is always the same. 12 | return 'cssTransform'; 13 | }, 14 | }; 15 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/app/app.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 | 5 | Dashboard and Widgets 6 | 7 |
8 |
9 | 10 |
11 |
12 | 13 |
14 |
15 |
16 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | 4 | import { AppComponent } from './app.component'; 5 | 6 | @NgModule({ 7 | declarations: [ 8 | AppComponent 9 | ], 10 | imports: [ 11 | BrowserModule 12 | ], 13 | providers: [], 14 | bootstrap: [AppComponent] 15 | }) 16 | export class AppModule { } 17 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | 4 | import { AppComponent } from './app.component'; 5 | 6 | @NgModule({ 7 | declarations: [ 8 | AppComponent 9 | ], 10 | imports: [ 11 | BrowserModule 12 | ], 13 | providers: [], 14 | bootstrap: [AppComponent] 15 | }) 16 | export class AppModule { } 17 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /chapter06/basic-mvc/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | MooaApp1 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/assets/apps.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "app1", 4 | "selector": "app-app1", 5 | "baseScriptUrl": "/assets/app1", 6 | "styles": [ 7 | "styles.3bb2a9d4949b7dc120a9.css" 8 | ], 9 | "prefix": "app/app1", 10 | "scripts": [ 11 | "main.fbb4c7398448b0ebe06f.js", 12 | "polyfills.908282e8e7f434e6eebf.js", 13 | "runtime.ec2944dd8b20ec099bf3.js" 14 | ] 15 | } 16 | ] 17 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.log(err)); 13 | -------------------------------------------------------------------------------- /chapter05/binding/src/utils/Dep.ts: -------------------------------------------------------------------------------- 1 | import { Watcher } from './Watcher' 2 | 3 | export class Dep { 4 | static target: any 5 | private deps: any[] 6 | 7 | constructor() { 8 | this.deps = [] 9 | } 10 | 11 | addDep(watcher: Watcher) { 12 | if (watcher) { 13 | this.deps.push(watcher) 14 | } 15 | } 16 | 17 | notify() { 18 | this.deps.forEach((watcher: Watcher) => { 19 | watcher.update() 20 | }) 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /chapter08/graphql-demo/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "graphql-demo", 3 | "version": "0.0.1", 4 | "description": "GraphQL BFF Demo", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "author": "Phodal HUANG", 10 | "license": "MIT", 11 | "dependencies": { 12 | "apollo-datasource-rest": "^0.1.5", 13 | "apollo-server": "^2.1.0", 14 | "graphql": "^14.0.2" 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.log(err)); 13 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # For IE 9-11 support, please uncomment the last line of the file and adjust as needed 5 | > 0.5% 6 | last 2 versions 7 | Firefox ESR 8 | not dead 9 | # IE 9-11 -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # For IE 9-11 support, please uncomment the last line of the file and adjust as needed 5 | > 0.5% 6 | last 2 versions 7 | Firefox ESR 8 | not dead 9 | # IE 9-11 -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # For IE 9-11 support, please uncomment the last line of the file and adjust as needed 5 | > 0.5% 6 | last 2 versions 7 | Firefox ESR 8 | not dead 9 | # IE 9-11 -------------------------------------------------------------------------------- /chapter10/react-micro-components/README.md: -------------------------------------------------------------------------------- 1 | # React 2 | 3 | 4 | ## Resources 5 | 6 | https://stackoverflow.com/questions/37239731/writing-embeddable-javascript-plugin-with-react-webpack 7 | 8 | 9 | http://krasimirtsonev.com/blog/article/javascript-library-starter-using-webpack-es6 10 | 11 | 12 | https://github.com/krasimir/webpack-library-starter 13 | 14 | 15 | https://stackoverflow.com/questions/25454029/embeddable-javascript-widget-with-react 16 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | // The file contents for the current environment will overwrite these during build. 2 | // The build system defaults to the dev environment which uses `environment.ts`, but if you do 3 | // `ng build --env=prod` then `environment.prod.ts` will be used instead. 4 | // The list of which env maps to which file can be found in `.angular-cli.json`. 5 | 6 | export const environment = { 7 | production: false 8 | }; 9 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /chapter04/react-webpack-demo/Jenkinsfile: -------------------------------------------------------------------------------- 1 | pipeline { 2 | agent any 3 | 4 | triggers { 5 | pollSCM('* * * * *') 6 | } 7 | 8 | stages { 9 | stage('Setup') { 10 | steps { 11 | sh 'npm install' 12 | } 13 | } 14 | 15 | 16 | stage('Build') { 17 | steps { 18 | sh 'npm build' 19 | } 20 | } 21 | 22 | stage('Test') { 23 | steps { 24 | sh 'npm test' 25 | } 26 | } 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # 5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed 6 | 7 | > 0.5% 8 | last 2 versions 9 | Firefox ESR 10 | not dead 11 | not IE 9-11 -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # 5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed 6 | 7 | > 0.5% 8 | last 2 versions 9 | Firefox ESR 10 | not dead 11 | not IE 9-11 -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /chapter10/react-micro-components/react-widget/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /chapter07/designsystem/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | padding: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", 5 | "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", 6 | sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | code { 12 | font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", 13 | monospace; 14 | } 15 | -------------------------------------------------------------------------------- /chapter08/moco-server/api/README.md: -------------------------------------------------------------------------------- 1 | # Moco Server 示例 2 | 3 | ``java -jar moco-runner-0.12.0-standalone.jar http -p 12306 -g config.json`` 4 | 5 | ```bash 6 | $ curl -X POST -H "authorization: Bear 32423424324" -I -s http://localhost:12306/verify-token 7 | 8 | > HTTP/1.1 200 OK 9 | > content-length: 0 10 | 11 | $ curl -X POST -H "authorization: Bear fasdkaf" -I -s http://localhost:12306/verify-token 12 | 13 | > HTTP/1.1 400 Bad Request 14 | > content-length: 0 15 | ``` -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # 5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed 6 | 7 | > 0.5% 8 | last 2 versions 9 | Firefox ESR 10 | not dead 11 | not IE 9-11 -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # 5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed 6 | 7 | > 0.5% 8 | last 2 versions 9 | Firefox ESR 10 | not dead 11 | not IE 9-11 -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # 5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed 6 | 7 | > 0.5% 8 | last 2 versions 9 | Firefox ESR 10 | not dead 11 | not IE 9-11 -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.log(err)); 13 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.log(err)); 13 | -------------------------------------------------------------------------------- /chapter10/wc-demo/hello-world/app.js: -------------------------------------------------------------------------------- 1 | class HelloElement extends HTMLElement { 2 | constructor() { 3 | super(); 4 | var shadow = this.attachShadow({mode: 'open'}); 5 | shadow.innerHTML += ` 6 | 10 |
11 | hello, 12 |
13 | world 14 | `; 15 | } 16 | } 17 | 18 | customElements.define('hello-element', HelloElement); 19 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # 5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed 6 | 7 | > 0.5% 8 | last 2 versions 9 | Firefox ESR 10 | not dead 11 | not IE 9-11 -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # 5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed 6 | 7 | > 0.5% 8 | last 2 versions 9 | Firefox ESR 10 | not dead 11 | not IE 9-11 -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | 4 | const routes: Routes = [ 5 | { path: '', pathMatch: 'full', redirectTo: '' }, 6 | { path: 'reports', loadChildren: './reports/reports.module#ReportsModule' } 7 | ]; 8 | 9 | @NgModule({ 10 | imports: [RouterModule.forRoot(routes)], 11 | exports: [RouterModule] 12 | }) 13 | export class AppRoutingModule { } 14 | -------------------------------------------------------------------------------- /chapter10/single-spa-sample/src/root-application/root-application.js: -------------------------------------------------------------------------------- 1 | import * as singleSpa from 'single-spa'; 2 | 3 | singleSpa.registerApplication('app-1', () => import ('../app1/app1.js'), pathPrefix('/app1')); 4 | singleSpa.registerApplication('app-2', () => import ('../app2/app2.js'), pathPrefix('/app2')); 5 | 6 | singleSpa.start(); 7 | 8 | function pathPrefix(prefix) { 9 | return function(location) { 10 | return location.pathname.startsWith(`${prefix}`); 11 | } 12 | } -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { Router } from '@angular/router'; 3 | import { mooaPlatform } from 'mooa'; 4 | 5 | @Component({ 6 | selector: 'app-app1', 7 | templateUrl: './app.component.html', 8 | styleUrls: ['./app.component.css'] 9 | }) 10 | export class AppComponent { 11 | constructor(private router: Router) { 12 | mooaPlatform.handleRouterUpdate(this.router, 'app1'); 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/browserslist: -------------------------------------------------------------------------------- 1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | # 5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed 6 | 7 | > 0.5% 8 | last 2 versions 9 | Firefox ESR 10 | not dead 11 | not IE 9-11 -------------------------------------------------------------------------------- /chapter06/basic-mvc-twb/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | 4 | const routes: Routes = [ 5 | { path: '', pathMatch: 'full', redirectTo: '' }, 6 | { path: 'settings', loadChildren: './settings/settings.module#SettingsModule' }, 7 | ]; 8 | 9 | @NgModule({ 10 | imports: [RouterModule.forRoot(routes)], 11 | exports: [RouterModule] 12 | }) 13 | export class AppRoutingModule { } 14 | -------------------------------------------------------------------------------- /chapter10/router-dispatch/nginx.conf: -------------------------------------------------------------------------------- 1 | http { 2 | server { 3 | listen 80; 4 | server_name aofe.phodal.com; 5 | location /api/ { 6 | proxy_pass http://http://172.31.25.15:8000/api; 7 | } 8 | location /web/admin { 9 | proxy_pass http://172.31.25.29/web/admin; 10 | } 11 | location /web/notifications { 12 | proxy_pass http://172.31.25.27/web/notifications; 13 | } 14 | location / { 15 | proxy_pass /; 16 | } 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/scripts/build.js: -------------------------------------------------------------------------------- 1 | let fs = require('fs-extra') 2 | let projects = ['reports', 'settings', 'dashboard']; 3 | 4 | for (let index in projects) { 5 | let project = projects[index]; 6 | let originModulePath = './src/app/' + project; 7 | fs.removeSync(originModulePath); 8 | fs.copy('../' + project + '/src/app/' + project, originModulePath) 9 | .then(() => console.log('copy project: ' + project + ' success!')) 10 | .catch(err => console.error(err)); 11 | } 12 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | 4 | const routes: Routes = [ 5 | { path: '', pathMatch: 'full', redirectTo: '' }, 6 | { path: 'dashboard', loadChildren: './dashboard/dashboard.module#DashboardModule' }, 7 | ]; 8 | 9 | @NgModule({ 10 | imports: [RouterModule.forRoot(routes)], 11 | exports: [RouterModule] 12 | }) 13 | export class AppRoutingModule { } 14 | -------------------------------------------------------------------------------- /chapter10/react-micro-components/react-widget/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | padding: 0; 4 | font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", 5 | "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", 6 | sans-serif; 7 | -webkit-font-smoothing: antialiased; 8 | -moz-osx-font-smoothing: grayscale; 9 | } 10 | 11 | code { 12 | font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", 13 | monospace; 14 | } 15 | -------------------------------------------------------------------------------- /chapter10/stencil-demo/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Stencil Component Starter 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /chapter05/binding-simple/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Two Way Data Binding 6 | 7 | 8 |
9 | 10 | 11 | 12 |
13 | 14 |
15 |
16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/app/dashboard/dashboard.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { DashboardComponent } from './dashboard/dashboard.component'; 4 | import { DashboardService } from './dashboard.service'; 5 | 6 | @NgModule({ 7 | imports: [CommonModule], 8 | declarations: [DashboardComponent], 9 | providers: [DashboardService], 10 | exports: [DashboardComponent] 11 | }) 12 | export class DashboardModule { } 13 | -------------------------------------------------------------------------------- /chapter04/angular-examples/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "moduleResolution": "node", 9 | "emitDecoratorMetadata": true, 10 | "experimentalDecorators": true, 11 | "target": "es5", 12 | "typeRoots": [ 13 | "node_modules/@types" 14 | ], 15 | "lib": [ 16 | "es2017", 17 | "dom" 18 | ] 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | 4 | import { AppRoutingModule } from './app-routing.module'; 5 | import { AppComponent } from './app.component'; 6 | 7 | @NgModule({ 8 | declarations: [ 9 | AppComponent, 10 | ], 11 | imports: [ 12 | BrowserModule, 13 | AppRoutingModule 14 | ], 15 | providers: [], 16 | bootstrap: [AppComponent] 17 | }) 18 | export class AppModule { } 19 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | 4 | import { AppRoutingModule } from './app-routing.module'; 5 | import { AppComponent } from './app.component'; 6 | 7 | @NgModule({ 8 | declarations: [ 9 | AppComponent 10 | ], 11 | imports: [ 12 | BrowserModule, 13 | AppRoutingModule 14 | ], 15 | providers: [], 16 | bootstrap: [AppComponent] 17 | }) 18 | export class AppModule { } 19 | -------------------------------------------------------------------------------- /chapter05/template-engine/assets/simple.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright 2014 Tomasz Mazur, Jacek Becela 3 | * https://github.com/trix/nano 4 | */ 5 | 6 | function simple(template, data) { 7 | return template.replace(/\{\{([\w\.]*)\}\}/g, function (str, key) { 8 | var keys = key.split("."); 9 | var value = data[keys.shift()]; 10 | for (var i = 0; i < keys.length; i++) { 11 | value = value[keys[i]]; 12 | } 13 | return (typeof value !== "undefined" && value !== null) ? value : ""; 14 | }); 15 | } 16 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | 4 | import { AppRoutingModule } from './app-routing.module'; 5 | import { AppComponent } from './app.component'; 6 | 7 | @NgModule({ 8 | declarations: [ 9 | AppComponent, 10 | ], 11 | imports: [ 12 | BrowserModule, 13 | AppRoutingModule 14 | ], 15 | providers: [], 16 | bootstrap: [AppComponent] 17 | }) 18 | export class AppModule { } 19 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | 4 | import { AppRoutingModule } from './app-routing.module'; 5 | import { AppComponent } from './app.component'; 6 | 7 | @NgModule({ 8 | declarations: [ 9 | AppComponent 10 | ], 11 | imports: [ 12 | BrowserModule, 13 | AppRoutingModule 14 | ], 15 | providers: [], 16 | bootstrap: [AppComponent] 17 | }) 18 | export class AppModule { } 19 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | 4 | import { AppRoutingModule } from './app-routing.module'; 5 | import { AppComponent } from './app.component'; 6 | 7 | @NgModule({ 8 | declarations: [ 9 | AppComponent 10 | ], 11 | imports: [ 12 | BrowserModule, 13 | AppRoutingModule 14 | ], 15 | providers: [], 16 | bootstrap: [AppComponent] 17 | }) 18 | export class AppModule { } 19 | -------------------------------------------------------------------------------- /chapter04/gulp-examples/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "chapter02", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "keywords": [], 10 | "author": "", 11 | "license": "ISC", 12 | "dependencies": { 13 | "gulp": "^3.9.1", 14 | "gulp-concat": "^2.6.1", 15 | "gulp-csso": "^3.0.1", 16 | "gulp-less": "^4.0.1", 17 | "gulp-pug": "^4.0.1", 18 | "gulp-sourcemaps": "^2.6.4" 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /chapter07/designsystem/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.css'; 4 | import App from './App'; 5 | import * as serviceWorker from './serviceWorker'; 6 | 7 | ReactDOM.render(, document.getElementById('root')); 8 | 9 | // If you want your app to work offline and load faster, you can change 10 | // unregister() to register() below. Note this comes with some pitfalls. 11 | // Learn more about service workers: http://bit.ly/CRA-PWA 12 | serviceWorker.unregister(); 13 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "moduleResolution": "node", 9 | "emitDecoratorMetadata": true, 10 | "experimentalDecorators": true, 11 | "target": "es5", 12 | "typeRoots": [ 13 | "node_modules/@types" 14 | ], 15 | "lib": [ 16 | "es2017", 17 | "dom" 18 | ] 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "moduleResolution": "node", 9 | "emitDecoratorMetadata": true, 10 | "experimentalDecorators": true, 11 | "target": "es5", 12 | "typeRoots": [ 13 | "node_modules/@types" 14 | ], 15 | "lib": [ 16 | "es2017", 17 | "dom" 18 | ] 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "moduleResolution": "node", 9 | "emitDecoratorMetadata": true, 10 | "experimentalDecorators": true, 11 | "target": "es5", 12 | "typeRoots": [ 13 | "node_modules/@types" 14 | ], 15 | "lib": [ 16 | "es2017", 17 | "dom" 18 | ] 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /chapter08/json-mock-server/README.md: -------------------------------------------------------------------------------- 1 | # 普通 JSON Server 2 | 3 | JSON Server，顾名思义是使用 JSON 文件快速创建 Mock Server。 4 | 5 | ```bash 6 | npm install -g json-server 7 | ``` 8 | 9 | 如下是官方的 JSON 示例： 10 | 11 | ```javascript 12 | { 13 | "posts": [ 14 | { "id": 1, "title": "json-server", "author": "typicode" } 15 | ], 16 | "comments": [ 17 | { "id": 1, "body": "some comment", "postId": 1 } 18 | ], 19 | "profile": { "name": "typicode" } 20 | } 21 | ``` 22 | 23 | 启动脚本： 24 | 25 | ```bash 26 | json-server --watch example.json 27 | ``` -------------------------------------------------------------------------------- /chapter10/lazyload-demo/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "target": "es5", 13 | "typeRoots": [ 14 | "node_modules/@types" 15 | ], 16 | "lib": [ 17 | "es2018", 18 | "dom" 19 | ] 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | BaseApplication 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /chapter04/react-webpack-demo/src/App.css: -------------------------------------------------------------------------------- 1 | .App { 2 | text-align: center; 3 | } 4 | 5 | .App-logo { 6 | animation: App-logo-spin infinite 20s linear; 7 | height: 80px; 8 | } 9 | 10 | .App-header { 11 | background-color: #222; 12 | height: 150px; 13 | padding: 20px; 14 | color: white; 15 | } 16 | 17 | .App-title { 18 | font-size: 1.5em; 19 | } 20 | 21 | .App-intro { 22 | font-size: large; 23 | } 24 | 25 | @keyframes App-logo-spin { 26 | from { transform: rotate(0deg); } 27 | to { transform: rotate(360deg); } 28 | } 29 | -------------------------------------------------------------------------------- /chapter05/js-template/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "js-template", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "build:vdom": "browserify vdom-sample.js -o bundle.js", 8 | "test": "echo \"Error: no test specified\" && exit 1" 9 | }, 10 | "keywords": [], 11 | "author": "", 12 | "license": "ISC", 13 | "dependencies": { 14 | "hyperscript": "^2.0.2", 15 | "virtual-dom": "^2.1.1" 16 | }, 17 | "devDependencies": { 18 | "browserify": "^16.2.2" 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /chapter10/micro-components/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "target": "es5", 13 | "typeRoots": [ 14 | "node_modules/@types" 15 | ], 16 | "lib": [ 17 | "es2018", 18 | "dom" 19 | ] 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "target": "es5", 13 | "typeRoots": [ 14 | "node_modules/@types" 15 | ], 16 | "lib": [ 17 | "es2018", 18 | "dom" 19 | ] 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "target": "es5", 13 | "typeRoots": [ 14 | "node_modules/@types" 15 | ], 16 | "lib": [ 17 | "es2018", 18 | "dom" 19 | ] 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "target": "es5", 13 | "typeRoots": [ 14 | "node_modules/@types" 15 | ], 16 | "lib": [ 17 | "es2018", 18 | "dom" 19 | ] 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "target": "es5", 13 | "typeRoots": [ 14 | "node_modules/@types" 15 | ], 16 | "lib": [ 17 | "es2018", 18 | "dom" 19 | ] 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-quotes/src/widget-quotes/quotes.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { HttpClient } from '@angular/common/http'; 3 | import { Observable } from 'rxjs/Observable'; 4 | 5 | @Injectable() 6 | export class QuotesService { 7 | 8 | constructor(private http: HttpClient) { } 9 | 10 | private readonly url = 'https://quotes.rest/qod?category=inspire'; 11 | 12 | getQuotesOfTheDay(): Observable { 13 | return this.http.get(this.url); 14 | } 15 | 16 | } 17 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "target": "es5", 13 | "typeRoots": [ 14 | "node_modules/@types" 15 | ], 16 | "lib": [ 17 | "es2018", 18 | "dom" 19 | ] 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "target": "es5", 13 | "typeRoots": [ 14 | "node_modules/@types" 15 | ], 16 | "lib": [ 17 | "es2018", 18 | "dom" 19 | ] 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /chapter04/gulp-grunt-webpack-compare/webpack.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | entry: ['./src/styles.scss'], 3 | module: { 4 | rules: [ 5 | { 6 | test: /\.scss$/, 7 | use: [ 8 | 9 | { 10 | loader: 'file-loader', 11 | options: {name: '[name].css',} 12 | }, 13 | {loader: "extract-loader"}, 14 | {loader: 'css-loader'}, 15 | {loader: 'postcss-loader'}, 16 | {loader: 'sass-loader'} 17 | ], 18 | } 19 | ] 20 | } 21 | }; 22 | -------------------------------------------------------------------------------- /chapter10/single-spa-sample/src/app2/app2.component.ts: -------------------------------------------------------------------------------- 1 | import {Component} from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app2', 5 | template: ` 6 |
7 | This was rendered by App2 which is written in Angular 8 |
9 | Angular route 1 10 | Angular route 2 11 | 12 | 13 | `, 14 | }) 15 | export class App2 { 16 | } 17 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/app/graph/graph.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import {RebirthEChartsModule} from 'rebirth-echarts'; 4 | import {HomeComponent} from '../home/home.component'; 5 | import {GraphComponent} from './graph.component'; 6 | 7 | @NgModule({ 8 | imports: [ 9 | CommonModule, 10 | RebirthEChartsModule 11 | ], 12 | declarations: [GraphComponent], 13 | exports: [GraphComponent] 14 | }) 15 | export class GraphModule { } 16 | -------------------------------------------------------------------------------- /chapter05/router/README.md: -------------------------------------------------------------------------------- 1 | 路由 2 | === 3 | 4 | 5 | 6 | 7 | 相关资源 8 | --- 9 | 10 | 轻量级客户端库：[Page.js](https://github.com/visionmedia/page.js) 11 | 12 | - [https://github.com/phodal/lettuce](https://github.com/phodal/lettuce) 13 | 14 | 相关文章 15 | --- 16 | 17 | [Deep dive into client-side routing](http://krasimirtsonev.com/blog/article/deep-dive-into-client-side-routing-navigo-pushstate-hash) 18 | 19 | [A modern JavaScript router in 100 lines](http://krasimirtsonev.com/blog/article/A-modern-JavaScript-router-in-100-lines-history-api-pushState-hash-url) 20 | -------------------------------------------------------------------------------- /chapter08/swagger-demo/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "swagger-demo", 3 | "version": "0.0.1", 4 | "private": true, 5 | "description": "New Swagger API Project", 6 | "keywords": [], 7 | "author": "", 8 | "license": "", 9 | "main": "app.js", 10 | "dependencies": { 11 | "express": "^4.12.3", 12 | "swagger-express-mw": "^0.1.0" 13 | }, 14 | "devDependencies": { 15 | "should": "^7.1.0", 16 | "supertest": "^1.0.0" 17 | }, 18 | "scripts": { 19 | "start": "node app.js", 20 | "test": "swagger project test" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/reports/reports.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterModule, Routes } from '@angular/router'; 4 | import { ReportsComponent } from './reports.component'; 5 | 6 | export const ROUTES: Routes = [ 7 | { path: '', component: ReportsComponent } 8 | ]; 9 | 10 | @NgModule({ 11 | declarations: [ReportsComponent], 12 | imports: [ 13 | RouterModule.forChild(ROUTES), 14 | CommonModule 15 | ] 16 | }) 17 | export class ReportsModule { } 18 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "module": "es2015", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "target": "es5", 13 | "typeRoots": [ 14 | "node_modules/@types" 15 | ], 16 | "lib": [ 17 | "es2017", 18 | "dom" 19 | ] 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/app/reports/reports.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterModule, Routes } from '@angular/router'; 4 | import { ReportsComponent } from './reports.component'; 5 | 6 | export const ROUTES: Routes = [ 7 | { path: '', component: ReportsComponent } 8 | ]; 9 | 10 | @NgModule({ 11 | declarations: [ReportsComponent], 12 | imports: [ 13 | RouterModule.forChild(ROUTES), 14 | CommonModule 15 | ] 16 | }) 17 | export class ReportsModule { } 18 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/src/app/reports/reports.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterModule, Routes } from '@angular/router'; 4 | import { ReportsComponent } from './reports.component'; 5 | 6 | export const ROUTES: Routes = [ 7 | { path: '', component: ReportsComponent } 8 | ]; 9 | 10 | @NgModule({ 11 | declarations: [ReportsComponent], 12 | imports: [ 13 | RouterModule.forChild(ROUTES), 14 | CommonModule 15 | ] 16 | }) 17 | export class ReportsModule { } 18 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/dashboard/dashboard.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import {DashboardComponent} from './dashboard.component'; 4 | import {RouterModule, Routes} from '@angular/router'; 5 | 6 | export const ROUTES: Routes = [ 7 | { path: '', component: DashboardComponent } 8 | ]; 9 | 10 | @NgModule({ 11 | declarations: [DashboardComponent], 12 | imports: [ 13 | RouterModule.forChild(ROUTES), 14 | CommonModule 15 | ] 16 | }) 17 | export class DashboardModule { } 18 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/settings/settings.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { SettingsComponent } from './settings.component'; 4 | import { RouterModule, Routes } from '@angular/router'; 5 | 6 | 7 | export const ROUTES: Routes = [ 8 | { path: '', component: SettingsComponent } 9 | ]; 10 | 11 | @NgModule({ 12 | declarations: [SettingsComponent], 13 | imports: [ 14 | RouterModule.forChild(ROUTES), 15 | CommonModule 16 | ] 17 | }) 18 | export class SettingsModule { } 19 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/app/dashboard/dashboard.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import {DashboardComponent} from './dashboard.component'; 4 | import {RouterModule, Routes} from '@angular/router'; 5 | 6 | export const ROUTES: Routes = [ 7 | { path: '', component: DashboardComponent } 8 | ]; 9 | 10 | @NgModule({ 11 | declarations: [DashboardComponent], 12 | imports: [ 13 | RouterModule.forChild(ROUTES), 14 | CommonModule 15 | ] 16 | }) 17 | export class DashboardModule { } 18 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/src/app/dashboard/dashboard.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import {DashboardComponent} from './dashboard.component'; 4 | import {RouterModule, Routes} from '@angular/router'; 5 | 6 | export const ROUTES: Routes = [ 7 | { path: '', component: DashboardComponent } 8 | ]; 9 | 10 | @NgModule({ 11 | declarations: [DashboardComponent], 12 | imports: [ 13 | RouterModule.forChild(ROUTES), 14 | CommonModule 15 | ] 16 | }) 17 | export class DashboardModule { } 18 | -------------------------------------------------------------------------------- /chapter04/gulp-grunt-webpack-compare/gulpfile.js: -------------------------------------------------------------------------------- 1 | var gulp = require('gulp'); 2 | var sass = require('gulp-sass'); 3 | var minifyCss = require('gulp-minify-css'); 4 | var rename = require('gulp-rename'); 5 | 6 | gulp.task('sass', function(done) { 7 | gulp.src('./src/styles.scss') 8 | .pipe(sass()) 9 | .pipe(gulp.dest('./dist/css/')) 10 | .pipe(minifyCss({ 11 | keepSpecialComments: 0 12 | })) 13 | .pipe(rename({ extname: '.min.css' })) 14 | .pipe(gulp.dest('./dist/css/')) 15 | .on('end', done); 16 | }); 17 | 18 | gulp.task('default', ['sass']); -------------------------------------------------------------------------------- /chapter07/styleguide/styleguide/kss-assets/sample.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/app/settings/settings.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { SettingsComponent } from './settings.component'; 4 | import { RouterModule, Routes } from '@angular/router'; 5 | 6 | 7 | export const ROUTES: Routes = [ 8 | { path: '', component: SettingsComponent } 9 | ]; 10 | 11 | @NgModule({ 12 | declarations: [SettingsComponent], 13 | imports: [ 14 | RouterModule.forChild(ROUTES), 15 | CommonModule 16 | ] 17 | }) 18 | export class SettingsModule { } 19 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/src/app/settings/settings.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { SettingsComponent } from './settings.component'; 4 | import { RouterModule, Routes } from '@angular/router'; 5 | 6 | 7 | export const ROUTES: Routes = [ 8 | { path: '', component: SettingsComponent } 9 | ]; 10 | 11 | @NgModule({ 12 | declarations: [SettingsComponent], 13 | imports: [ 14 | RouterModule.forChild(ROUTES), 15 | CommonModule 16 | ] 17 | }) 18 | export class SettingsModule { } 19 | -------------------------------------------------------------------------------- /chapter07/styleguide/styleguide/kss-assets/sample-inline.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/app/dashboard/dashboard.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { HttpClient } from '@angular/common/http'; 3 | import { Observable } from 'rxjs/Observable'; 4 | import { WidgetConfig } from './widget-config.model'; 5 | 6 | @Injectable() 7 | export class DashboardService { 8 | 9 | constructor(private http: HttpClient) { } 10 | 11 | private readonly url = 'assets/widgets/widgets.config.json'; 12 | 13 | getWidgetConfigs(): Observable { 14 | return this.http.get(this.url); 15 | } 16 | 17 | } 18 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | import {mooaPlatform} from 'mooa'; 7 | 8 | if (environment.production) { 9 | enableProdMode(); 10 | } 11 | 12 | mooaPlatform.mount('app1').then((opts) => { 13 | platformBrowserDynamic().bootstrapModule(AppModule).then((module) => { 14 | opts['attachUnmount'](module); 15 | }); 16 | }); 17 | 18 | -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-todays-date/src/widget-todays-date/widget-todays-date.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { WidgetTodaysDateComponent } from './widget-todays-date.component'; 4 | 5 | @NgModule({ 6 | imports: [CommonModule], 7 | declarations: [WidgetTodaysDateComponent], 8 | entryComponents: [WidgetTodaysDateComponent], 9 | providers: [{ 10 | provide: 'widget-todays-date', 11 | useValue: WidgetTodaysDateComponent 12 | }] 13 | }) 14 | export class WidgetTodaysDateModule { } 15 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/assets/app1/index.html: -------------------------------------------------------------------------------- 1 | App1 -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/assets/help/index.html: -------------------------------------------------------------------------------- 1 | help 2 | -------------------------------------------------------------------------------- /chapter10/react-micro-components/react-widget/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import './index.css'; 4 | import App from './App'; 5 | import * as serviceWorker from './serviceWorker'; 6 | 7 | export const init = (config) => { 8 | ReactDOM.render(, document.getElementById('root')); 9 | 10 | // If you want your app to work offline and load faster, you can change 11 | // unregister() to register() below. Note this comes with some pitfalls. 12 | // Learn more about service workers: http://bit.ly/CRA-PWA 13 | serviceWorker.unregister(); 14 | } 15 | -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-hello/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "widget-hello", 3 | "version": "0.0.0", 4 | "main": "dist/bundle.js", 5 | "license": "MIT", 6 | "scripts": { 7 | "build": "rimraf dist && rollup -c" 8 | }, 9 | "dependencies": { 10 | "@angular/core": "^5.2.2", 11 | "@angular/common": "^5.2.2", 12 | "rollup": "^0.55.1" 13 | }, 14 | "devDependencies": { 15 | "rimraf": "^2.6.2", 16 | "rollup-plugin-node-resolve": "^3.0.2", 17 | "rollup-plugin-typescript": "^0.8.1", 18 | "rollup-plugin-typescript2": "^0.10.0", 19 | "typescript": "^2.6.2" 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-hello/src/widget-hello/widget-hello.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'widget-hello', 5 | template: ` 6 |
7 |
8 |
9 | widget-hello 10 |
11 |
12 | Hello World 13 |
14 |
15 |
16 | ` 17 | }) 18 | export class WidgetHelloComponent implements OnInit { 19 | 20 | constructor() { } 21 | 22 | ngOnInit() { } 23 | 24 | } 25 | -------------------------------------------------------------------------------- /chapter05/binding/src/utils/Observe.ts: -------------------------------------------------------------------------------- 1 | import {Dep} from './Dep' 2 | 3 | export function Observe(obj: any, vm: any) { 4 | Object.keys(obj).forEach(function (key) { 5 | defineReactive(vm, key, obj[key]) 6 | }) 7 | } 8 | 9 | function defineReactive(obj: any, key: any, val: any) { 10 | let dep = new Dep() 11 | Object.defineProperty(obj, key, { 12 | get: function () { 13 | if (Dep.target) { 14 | dep.addDep(Dep.target) 15 | } 16 | return val 17 | }, 18 | set: function (newVal) { 19 | if (newVal === val) return 20 | val = newVal 21 | dep.notify() 22 | } 23 | }) 24 | } 25 | -------------------------------------------------------------------------------- /chapter10/stencil-demo/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "allowSyntheticDefaultImports": true, 4 | "allowUnreachableCode": false, 5 | "declaration": false, 6 | "experimentalDecorators": true, 7 | "lib": [ 8 | "dom", 9 | "es2017" 10 | ], 11 | "moduleResolution": "node", 12 | "module": "esnext", 13 | "target": "es2017", 14 | "noUnusedLocals": true, 15 | "noUnusedParameters": true, 16 | "jsx": "react", 17 | "jsxFactory": "h" 18 | }, 19 | "include": [ 20 | "src", 21 | "types/jsx.d.ts" 22 | ], 23 | "exclude": [ 24 | "node_modules" 25 | ] 26 | } 27 | -------------------------------------------------------------------------------- /chapter07/designsystem/src/App.css: -------------------------------------------------------------------------------- 1 | .App { 2 | text-align: center; 3 | } 4 | 5 | .App-logo { 6 | animation: App-logo-spin infinite 20s linear; 7 | height: 40vmin; 8 | } 9 | 10 | .App-header { 11 | background-color: #282c34; 12 | min-height: 100vh; 13 | display: flex; 14 | flex-direction: column; 15 | align-items: center; 16 | justify-content: center; 17 | font-size: calc(10px + 2vmin); 18 | color: white; 19 | } 20 | 21 | .App-link { 22 | color: #61dafb; 23 | } 24 | 25 | @keyframes App-logo-spin { 26 | from { 27 | transform: rotate(0deg); 28 | } 29 | to { 30 | transform: rotate(360deg); 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-todays-date/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "widget-todays-date", 3 | "version": "0.0.0", 4 | "main": "dist/bundle.js", 5 | "license": "MIT", 6 | "scripts": { 7 | "build": "rimraf dist && rollup -c" 8 | }, 9 | "dependencies": { 10 | "@angular/core": "^5.2.2", 11 | "@angular/common": "^5.2.2", 12 | "rollup": "^0.55.1" 13 | }, 14 | "devDependencies": { 15 | "rimraf": "^2.6.2", 16 | "rollup-plugin-node-resolve": "^3.0.2", 17 | "rollup-plugin-typescript": "^0.8.1", 18 | "rollup-plugin-typescript2": "^0.10.0", 19 | "typescript": "^2.6.2" 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-hello/src/widget-hello/widget-hello.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { WidgetHelloComponent } from './widget-hello.component'; 4 | import { ANestedComponent } from './a-nested.component'; 5 | 6 | @NgModule({ 7 | imports: [CommonModule], 8 | declarations: [ 9 | WidgetHelloComponent, 10 | ANestedComponent 11 | ], 12 | entryComponents: [WidgetHelloComponent], 13 | providers: [{ 14 | provide: 'widget-hello', 15 | useValue: WidgetHelloComponent 16 | }] 17 | }) 18 | export class WidgetHelloModule { } 19 | -------------------------------------------------------------------------------- /chapter04/react-webpack-demo/src/App.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import logo from './logo.svg'; 3 | import './App.css'; 4 | 5 | class App extends Component { 6 | render() { 7 | return ( 8 |
9 |
10 | logo 11 |

Welcome to React

12 |
13 |

14 | To get started, edit src/App.js and save to reload. 15 |

16 |
17 | ); 18 | } 19 | } 20 | 21 | export default App; 22 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | 4 | const routes: Routes = [ 5 | { path: '', pathMatch: 'full', redirectTo: '' }, 6 | { path: 'dashboard', loadChildren: './dashboard/dashboard.module#DashboardModule' }, 7 | { path: 'settings', loadChildren: './settings/settings.module#SettingsModule' }, 8 | { path: 'reports', loadChildren: './reports/reports.module#ReportsModule' } 9 | ]; 10 | 11 | @NgModule({ 12 | imports: [RouterModule.forRoot(routes)], 13 | exports: [RouterModule] 14 | }) 15 | export class AppRoutingModule { } 16 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | 4 | const routes: Routes = [ 5 | { path: '', pathMatch: 'full', redirectTo: '' }, 6 | { path: 'dashboard', loadChildren: './dashboard/dashboard.module#DashboardModule' }, 7 | { path: 'settings', loadChildren: './settings/settings.module#SettingsModule' }, 8 | { path: 'reports', loadChildren: './reports/reports.module#ReportsModule' } 9 | ]; 10 | 11 | @NgModule({ 12 | imports: [RouterModule.forRoot(routes)], 13 | exports: [RouterModule] 14 | }) 15 | export class AppRoutingModule { } 16 | -------------------------------------------------------------------------------- /chapter10/react-micro-components/react-widget/src/App.css: -------------------------------------------------------------------------------- 1 | .App { 2 | text-align: center; 3 | } 4 | 5 | .App-logo { 6 | animation: App-logo-spin infinite 20s linear; 7 | height: 40vmin; 8 | } 9 | 10 | .App-header { 11 | background-color: #282c34; 12 | min-height: 100vh; 13 | display: flex; 14 | flex-direction: column; 15 | align-items: center; 16 | justify-content: center; 17 | font-size: calc(10px + 2vmin); 18 | color: white; 19 | } 20 | 21 | .App-link { 22 | color: #61dafb; 23 | } 24 | 25 | @keyframes App-logo-spin { 26 | from { 27 | transform: rotate(0deg); 28 | } 29 | to { 30 | transform: rotate(360deg); 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /chapter08/swagger-demo/app.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | var SwaggerExpress = require('swagger-express-mw'); 4 | var app = require('express')(); 5 | module.exports = app; // for testing 6 | 7 | var config = { 8 | appRoot: __dirname // required config 9 | }; 10 | 11 | SwaggerExpress.create(config, function(err, swaggerExpress) { 12 | if (err) { throw err; } 13 | 14 | // install middleware 15 | swaggerExpress.register(app); 16 | 17 | var port = process.env.PORT || 10010; 18 | app.listen(port); 19 | 20 | if (swaggerExpress.runner.swagger.paths['/hello']) { 21 | console.log('try this:\ncurl http://127.0.0.1:' + port + '/hello?name=Phodal'); 22 | } 23 | }); 24 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | 8 | if (environment.production) { 9 | enableProdMode(); 10 | } 11 | 12 | // mooaPlatform.mount('help').then((opts) => { 13 | // platformBrowserDynamic().bootstrapModule(AppModule).then((module) => { 14 | // opts['attachUnmount'](module); 15 | // }); 16 | // }); 17 | 18 | platformBrowserDynamic().bootstrapModule(AppModule) 19 | .catch(err => console.error(err)); 20 | 21 | -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-todays-date/src/widget-todays-date/widget-todays-date.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'widget-todays-date', 5 | template: ` 6 |
7 |
8 |
9 | widget-todays-date 10 |
11 |
12 | {{currentDate | date}} 13 |
14 |
15 |
16 | ` 17 | }) 18 | export class WidgetTodaysDateComponent implements OnInit { 19 | 20 | currentDate: Date = new Date(); 21 | 22 | constructor() { } 23 | 24 | ngOnInit() { 25 | } 26 | 27 | } 28 | -------------------------------------------------------------------------------- /chapter06/button-demo/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 7 | Document 8 | 9 | 10 | 11 | 21 | 22 | -------------------------------------------------------------------------------- /chapter10/micro-components/widgets/widget-quotes/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "widget-quotes", 3 | "version": "0.0.0", 4 | "main": "dist/bundle.js", 5 | "license": "MIT", 6 | "scripts": { 7 | "build": "rimraf dist && rollup -c" 8 | }, 9 | "dependencies": { 10 | "@angular/common": "^5.2.0", 11 | "@angular/core": "^5.2.0", 12 | "rollup": "^0.55.1", 13 | "rxjs": "^5.5.6" 14 | }, 15 | "devDependencies": { 16 | "rimraf": "^2.6.2", 17 | "rollup-plugin-node-resolve": "^3.0.2", 18 | "rollup-plugin-typescript": "^0.8.1", 19 | "rollup-plugin-typescript2": "^0.10.0", 20 | "rollup-plugin-commonjs": "8.3.0", 21 | "typescript": "~2.5.3" 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /chapter04/gulp-grunt-webpack-compare/gruntfile.js: -------------------------------------------------------------------------------- 1 | module.exports = function (grunt) { 2 | grunt.initConfig({ 3 | sass: { // 编译 SASS 任务 4 | dist: { 5 | options: { 6 | style: 'expanded' 7 | }, 8 | files: { 9 | 'dist/css/styles.css': 'src/styles.scss', 10 | } 11 | } 12 | }, 13 | cssmin: { // 压缩 CSS 任务 14 | dist: { 15 | files: { 16 | 'dist/css/styles.min.css': 'dist/css/styles.css' 17 | } 18 | } 19 | }, 20 | }); 21 | 22 | grunt.loadNpmTasks('grunt-contrib-sass'); 23 | grunt.loadNpmTasks('grunt-contrib-cssmin'); 24 | 25 | grunt.registerTask('default', ['sass', 'cssmin']); 26 | }; 27 | -------------------------------------------------------------------------------- /chapter05/js-template/README.md: -------------------------------------------------------------------------------- 1 | 相关项目：[WINV](https://github.com/phodal/winv) 2 | 3 | 模板： 4 | 5 | ```html 6 | {{motto}} 7 | ``` 8 | 9 | ``` 10 | winv.setTemplate('{{motto}}') 11 | ``` 12 | 13 | 相关资源： 14 | 15 | 16 | Example, sorting https://jsfiddle.net/chefk6uu/ 17 | increase, decrease and revert. 18 | But, I found simple solution: https://jsfiddle.net/m6365sc6/ 19 | 20 | 21 | Virtual DOM 算法： 22 | 23 | 24 | 1. https://github.com/livoras/simple-virtual-dom 25 | 26 | Virtual DOM 库： 27 | 28 | 1. https://github.com/trueadm/t7 29 | 2. https://github.com/WebReflection/hyperHTML 30 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import {mooaPlatform} from 'mooa'; 3 | import {Router} from "@angular/router"; 4 | 5 | @Component({ 6 | selector: 'app-three', 7 | templateUrl: './app.component.html', 8 | styleUrls: ['./app.component.css'] 9 | }) 10 | export class AppComponent { 11 | title = 'app'; 12 | 13 | 14 | navigateToApp1() { 15 | mooaPlatform.navigateTo({ 16 | appName: 'applicationthree', 17 | router: 'home' 18 | }); 19 | } 20 | 21 | constructor(private router: Router) { 22 | mooaPlatform.handleRouterUpdate(this.router, 'applicationthree'); 23 | } 24 | 25 | 26 | 27 | } 28 | -------------------------------------------------------------------------------- /chapter04/angular-examples/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter10/micro-components/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter10/microapps/reports/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter10/microapps/settings/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter10/microapps/aofe-core/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter10/microapps/dashboard/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-app1/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter07/designsystem/src/stories/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import { storiesOf } from '@storybook/react'; 4 | import { action } from '@storybook/addon-actions'; 5 | import { linkTo } from '@storybook/addon-links'; 6 | 7 | import { Button, Welcome } from '@storybook/react/demo'; 8 | 9 | storiesOf('Welcome', module).add('to Storybook', () => ); 10 | 11 | storiesOf('Button', module) 12 | .add('with text', () => ) 13 | .add('with some emoji', () => ( 14 | 19 | )); 20 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationOne/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationThree/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/ApplicationTwo/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter10/nginx-microfrontends/base-application/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | 8 | # dependencies 9 | /node_modules 10 | 11 | # IDEs and editors 12 | /.idea 13 | .project 14 | .classpath 15 | .c9/ 16 | *.launch 17 | .settings/ 18 | *.sublime-workspace 19 | 20 | # IDE - VSCode 21 | .vscode/* 22 | !.vscode/settings.json 23 | !.vscode/tasks.json 24 | !.vscode/launch.json 25 | !.vscode/extensions.json 26 | 27 | # misc 28 | /.sass-cache 29 | /connect.lock 30 | /coverage 31 | /libpeerconnection.log 32 | npm-debug.log 33 | yarn-error.log 34 | testem.log 35 | /typings 36 | 37 | # System Files 38 | .DS_Store 39 | Thumbs.db 40 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | // This file can be replaced during build by using the `fileReplacements` array. 2 | // `ng build ---prod` replaces `environment.ts` with `environment.prod.ts`. 3 | // The list of file replacements can be found in `angular.json`. 4 | 5 | export const environment = { 6 | production: false 7 | }; 8 | 9 | /* 10 | * In development mode, to ignore zone related error stack frames such as 11 | * `zone.run`, `zoneDelegate.invokeTask` for easier debugging, you can 12 | * import the following file, but please comment it out in production mode 13 | * because it will have performance impact when throw error 14 | */ 15 | // import 'zone.js/dist/zone-error'; // Included with Angular CLI. 16 | -------------------------------------------------------------------------------- /chapter10/mooa-examples/mooa-hosts/src/assets/app1/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | MooaApp1 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /chapter10/lazyload-demo/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/dist/zone-testing'; 4 | import { getTestBed } from '@angular/core/testing'; 5 | import { 6 | BrowserDynamicTestingModule, 7 | platformBrowserDynamicTesting 8 | } from '@angular/platform-browser-dynamic/testing'; 9 | 10 | declare const require: any; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting() 16 | ); 17 | // Then we find all the tests. 18 | const context = require.context('./', true, /\.spec\.ts$/); 19 | // And load the modules. 20 | context.keys().map(context); 21 | -------------------------------------------------------------------------------- /chapter10/stencil-demo/src/components/my-component/my-component.tsx: -------------------------------------------------------------------------------- 1 | import { Component, Prop } from '@stencil/core'; 2 | import { format } from '../../utils/utils'; 3 | 4 | @Component({ 5 | tag: 'my-component', 6 | styleUrl: 'my-component.css', 7 | shadow: true 8 | }) 9 | export class MyComponent { 10 | /** 11 | * The first name 12 | */ 13 | @Prop() first: string; 14 | 15 | /** 16 | * The middle name 17 | */ 18 | @Prop() middle: string; 19 | 20 | /** 21 | * The last name 22 | */ 23 | @Prop() last: string; 24 | 25 | private getText(): string { 26 | return format(this.first, this.middle, this.last); 27 | } 28 | 29 | render() { 30 | return
Hello, World! I'm {this.getText()}
; 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /chapter04/angular-examples/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/dist/zone-testing'; 4 | import { getTestBed } from '@angular/core/testing'; 5 | import { 6 | BrowserDynamicTestingModule, 7 | platformBrowserDynamicTesting 8 | } from '@angular/platform-browser-dynamic/testing'; 9 | 10 | declare const require: any; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting() 16 | ); 17 | // Then we find all the tests. 18 | const context = require.context('./', true, /\.spec\.ts$/); 19 | // And load the modules. 20 | context.keys().map(context); 21 | -------------------------------------------------------------------------------- /chapter10/micro-components/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/dist/zone-testing'; 4 | import { getTestBed } from '@angular/core/testing'; 5 | import { 6 | BrowserDynamicTestingModule, 7 | platformBrowserDynamicTesting 8 | } from '@angular/platform-browser-dynamic/testing'; 9 | 10 | declare const require: any; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting() 16 | ); 17 | // Then we find all the tests. 18 | const context = require.context('./', true, /\.spec\.ts$/); 19 | // And load the modules. 20 | context.keys().map(context); 21 | --------------------------------------------------------------------------------