├── README.md ├── frontend-angular-19 ├── .editorconfig ├── .gitignore ├── LICENSE ├── README.md ├── angular.json ├── eslint.config.js ├── nginx.conf ├── ngsw-config.json ├── package-lock.json ├── package.json ├── public │ ├── favicon.ico │ ├── icons │ │ ├── icon-128x128.png │ │ ├── icon-144x144.png │ │ ├── icon-152x152.png │ │ ├── icon-192x192.png │ │ ├── icon-384x384.png │ │ ├── icon-512x512.png │ │ ├── icon-72x72.png │ │ └── icon-96x96.png │ └── manifest.webmanifest ├── src │ ├── app │ │ ├── app.component.css │ │ ├── app.component.html │ │ ├── app.component.spec.ts │ │ ├── app.component.ts │ │ ├── app.config.server.ts │ │ ├── app.config.ts │ │ ├── app.routes.ts │ │ ├── core │ │ │ └── services │ │ │ │ └── seo │ │ │ │ ├── seo.service.spec.ts │ │ │ │ └── seo.service.ts │ │ └── features │ │ │ ├── about │ │ │ ├── about.component.css │ │ │ ├── about.component.html │ │ │ ├── about.component.spec.ts │ │ │ ├── about.component.ts │ │ │ ├── about.config.ts │ │ │ ├── about.routes.ts │ │ │ ├── experience │ │ │ │ ├── experience.component.css │ │ │ │ ├── experience.component.html │ │ │ │ ├── experience.component.spec.ts │ │ │ │ └── experience.component.ts │ │ │ └── skill │ │ │ │ ├── skill.component.css │ │ │ │ ├── skill.component.html │ │ │ │ ├── skill.component.spec.ts │ │ │ │ └── skill.component.ts │ │ │ ├── contact │ │ │ ├── contact.component.css │ │ │ ├── contact.component.html │ │ │ ├── contact.component.spec.ts │ │ │ ├── contact.component.ts │ │ │ ├── contact.config.ts │ │ │ ├── contact.routes.ts │ │ │ ├── mailing │ │ │ │ ├── mailing.component.css │ │ │ │ ├── mailing.component.html │ │ │ │ ├── mailing.component.spec.ts │ │ │ │ └── mailing.component.ts │ │ │ ├── mapping │ │ │ │ ├── mapping.component.css │ │ │ │ ├── mapping.component.html │ │ │ │ ├── mapping.component.spec.ts │ │ │ │ └── mapping.component.ts │ │ │ └── website │ │ │ │ ├── website.component.css │ │ │ │ ├── website.component.html │ │ │ │ ├── website.component.spec.ts │ │ │ │ └── website.component.ts │ │ │ ├── home │ │ │ ├── feature.ts │ │ │ ├── home.component.css │ │ │ ├── home.component.html │ │ │ ├── home.component.spec.ts │ │ │ └── home.component.ts │ │ │ ├── login │ │ │ ├── login.component.css │ │ │ ├── login.component.html │ │ │ ├── login.component.spec.ts │ │ │ └── login.component.ts │ │ │ ├── not-found │ │ │ ├── not-found.component.css │ │ │ ├── not-found.component.html │ │ │ ├── not-found.component.spec.ts │ │ │ └── not-found.component.ts │ │ │ ├── signup │ │ │ ├── signup.component.css │ │ │ ├── signup.component.html │ │ │ ├── signup.component.spec.ts │ │ │ └── signup.component.ts │ │ │ └── tutorials │ │ │ ├── example-bootstrap │ │ │ ├── 00-main │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ ├── items.component.ts │ │ │ │ └── items.ts │ │ │ ├── accordions │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ ├── items.component.spec.ts │ │ │ │ └── items.component.ts │ │ │ ├── alerts │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── badges │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── blockquotes │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── breadcrumb │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── buttons │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── cards │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── checkbox │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── collapses │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── dropdowns │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── forms │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── list-group │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── pagination │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── progress │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── spinners │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── tables │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── tutorial.component.css │ │ │ ├── tutorial.component.html │ │ │ ├── tutorial.component.spec.ts │ │ │ ├── tutorial.component.ts │ │ │ ├── tutorial.config.ts │ │ │ ├── tutorial.routes.ts │ │ │ └── typography │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── example-components │ │ │ ├── channel │ │ │ │ ├── channel.component.css │ │ │ │ ├── channel.component.html │ │ │ │ ├── channel.component.ts │ │ │ │ └── channel.ts │ │ │ ├── tutorial.component.css │ │ │ ├── tutorial.component.html │ │ │ └── tutorial.component.ts │ │ │ ├── example-forms │ │ │ ├── 00-main │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ └── items.ts │ │ │ ├── 01-single │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ └── exercice.component.ts │ │ │ ├── 02-multi │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ ├── movie.spec.ts │ │ │ │ └── movie.ts │ │ │ ├── 03-init-class │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ ├── movie.spec.ts │ │ │ │ └── movie.ts │ │ │ ├── 04-prototype │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ └── exercice.component.ts │ │ │ ├── 05-form-control │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ └── exercice.component.ts │ │ │ ├── 06-form-control-class │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ └── movie.ts │ │ │ ├── 07-form-group │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ └── pretty-json.pipe.ts │ │ │ ├── 08-form-builder │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ └── pretty-json.pipe.ts │ │ │ ├── 09-form-builder-nested │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ ├── movie.ts │ │ │ │ └── pretty-json.pipe.ts │ │ │ ├── 10-form-array │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ ├── movie.ts │ │ │ │ └── pretty-json.pipe.ts │ │ │ ├── 11-form-multi │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ ├── movie.ts │ │ │ │ └── pretty-json.pipe.ts │ │ │ ├── tutorial.component.css │ │ │ ├── tutorial.component.html │ │ │ ├── tutorial.component.ts │ │ │ ├── tutorial.config.ts │ │ │ ├── tutorial.module.ts │ │ │ └── tutorial.routes.ts │ │ │ ├── example-items │ │ │ ├── items.component.css │ │ │ ├── items.component.html │ │ │ ├── items.component.ts │ │ │ └── services │ │ │ │ ├── items.service.spec.ts │ │ │ │ └── items.service.ts │ │ │ └── example-services │ │ │ ├── safe.pipe.ts │ │ │ ├── song │ │ │ ├── mock-songs.ts │ │ │ ├── song.service.spec.ts │ │ │ ├── song.service.ts │ │ │ └── song.ts │ │ │ ├── tutorial.component.css │ │ │ ├── tutorial.component.html │ │ │ ├── tutorial.component.ts │ │ │ └── tutorial.config.ts │ ├── assets │ │ ├── .gitkeep │ │ └── params │ │ │ ├── css │ │ │ ├── fonts.googleapis.css │ │ │ └── fonts.googleapis.min.css │ │ │ ├── images │ │ │ ├── channels │ │ │ │ ├── cinemax.jpg │ │ │ │ ├── cw.jpg │ │ │ │ ├── discovery-channel.jpg │ │ │ │ ├── disney-channel.jpg │ │ │ │ ├── fox.jpg │ │ │ │ ├── hbo.jpg │ │ │ │ ├── history.jpg │ │ │ │ ├── hulu.jpg │ │ │ │ ├── mtv.jpg │ │ │ │ ├── nbc.jpg │ │ │ │ ├── netflix.jpg │ │ │ │ ├── showtime.jpg │ │ │ │ └── usa-network.jpg │ │ │ ├── example-bootstrap │ │ │ │ └── movie-screen.jpg │ │ │ ├── logo │ │ │ │ ├── ganatan-logo.png │ │ │ │ └── ganatan-logo@2x.png │ │ │ └── studio │ │ │ │ ├── 2560px-Valve_old_logo.svg.png │ │ │ │ ├── Bioware-logo.png │ │ │ │ ├── Electronic_Arts-Logo.wine.png │ │ │ │ ├── Logo-Nintendo-1.jpg │ │ │ │ ├── Naughty-dog-logo.png │ │ │ │ └── Rockstar_Games_Logo.svg.png │ │ │ └── js │ │ │ ├── popovers.js │ │ │ ├── toasts.js │ │ │ └── tooltips.js │ ├── environments │ │ ├── environment.development.ts │ │ └── environment.ts │ ├── index.html │ ├── main.server.ts │ ├── main.ts │ ├── robots.txt │ ├── server.ts │ ├── sitemap.xml │ └── styles.css ├── tsconfig.app.json ├── tsconfig.json ├── tsconfig.spec.json └── ui │ ├── assets │ ├── bootstrap │ │ ├── css │ │ │ ├── bootstrap-grid.css │ │ │ ├── bootstrap-grid.css.map │ │ │ ├── bootstrap-grid.min.css │ │ │ ├── bootstrap-grid.min.css.map │ │ │ ├── bootstrap-grid.rtl.css │ │ │ ├── bootstrap-grid.rtl.css.map │ │ │ ├── bootstrap-grid.rtl.min.css │ │ │ ├── bootstrap-grid.rtl.min.css.map │ │ │ ├── bootstrap-reboot.css │ │ │ ├── bootstrap-reboot.css.map │ │ │ ├── bootstrap-reboot.min.css │ │ │ ├── bootstrap-reboot.min.css.map │ │ │ ├── bootstrap-reboot.rtl.css │ │ │ ├── bootstrap-reboot.rtl.css.map │ │ │ ├── bootstrap-reboot.rtl.min.css │ │ │ ├── bootstrap-reboot.rtl.min.css.map │ │ │ ├── bootstrap-utilities.css │ │ │ ├── bootstrap-utilities.css.map │ │ │ ├── bootstrap-utilities.min.css │ │ │ ├── bootstrap-utilities.min.css.map │ │ │ ├── bootstrap-utilities.rtl.css │ │ │ ├── bootstrap-utilities.rtl.css.map │ │ │ ├── bootstrap-utilities.rtl.min.css │ │ │ ├── bootstrap-utilities.rtl.min.css.map │ │ │ ├── bootstrap.css │ │ │ ├── bootstrap.css.map │ │ │ ├── bootstrap.min.css │ │ │ ├── bootstrap.min.css.map │ │ │ ├── bootstrap.rtl.css │ │ │ ├── bootstrap.rtl.css.map │ │ │ ├── bootstrap.rtl.min.css │ │ │ └── bootstrap.rtl.min.css.map │ │ └── js │ │ │ ├── bootstrap.bundle.js │ │ │ ├── bootstrap.bundle.js.map │ │ │ ├── bootstrap.bundle.min.js │ │ │ ├── bootstrap.bundle.min.js.map │ │ │ ├── bootstrap.esm.js │ │ │ ├── bootstrap.esm.js.map │ │ │ ├── bootstrap.esm.min.js │ │ │ ├── bootstrap.esm.min.js.map │ │ │ ├── bootstrap.js │ │ │ ├── bootstrap.js.map │ │ │ ├── bootstrap.min.js │ │ │ └── bootstrap.min.js.map │ ├── fontawesome │ │ ├── css │ │ │ ├── all.css │ │ │ ├── all.min.css │ │ │ ├── brands.css │ │ │ ├── brands.min.css │ │ │ ├── fontawesome.css │ │ │ ├── fontawesome.min.css │ │ │ ├── regular.css │ │ │ ├── regular.min.css │ │ │ ├── solid.css │ │ │ ├── solid.min.css │ │ │ ├── svg-with-js.css │ │ │ ├── svg-with-js.min.css │ │ │ ├── v4-font-face.css │ │ │ ├── v4-font-face.min.css │ │ │ ├── v4-shims.css │ │ │ ├── v4-shims.min.css │ │ │ ├── v5-font-face.css │ │ │ └── v5-font-face.min.css │ │ ├── js │ │ │ ├── all.js │ │ │ ├── all.min.js │ │ │ ├── brands.js │ │ │ ├── brands.min.js │ │ │ ├── conflict-detection.js │ │ │ ├── conflict-detection.min.js │ │ │ ├── fontawesome.js │ │ │ ├── fontawesome.min.js │ │ │ ├── regular.js │ │ │ ├── regular.min.js │ │ │ ├── solid.js │ │ │ ├── solid.min.js │ │ │ ├── v4-shims.js │ │ │ └── v4-shims.min.js │ │ └── webfonts │ │ │ ├── fa-brands-400.ttf │ │ │ ├── fa-brands-400.woff2 │ │ │ ├── fa-regular-400.ttf │ │ │ ├── fa-regular-400.woff2 │ │ │ ├── fa-solid-900.ttf │ │ │ ├── fa-solid-900.woff2 │ │ │ ├── fa-v4compatibility.ttf │ │ │ └── fa-v4compatibility.woff2 │ └── params │ │ ├── css │ │ ├── body.css │ │ ├── fonts.googleapis.css │ │ ├── fonts.googleapis.min.css │ │ ├── footer.css │ │ └── header.css │ │ ├── images │ │ └── logo │ │ │ ├── ganatan-logo.png │ │ │ └── ganatan-logo@2x.png │ │ └── js │ │ ├── popovers.js │ │ ├── toasts.js │ │ └── tooltips.js │ └── home.html └── frontend-angular ├── .editorconfig ├── .gitignore ├── LICENSE ├── README.md ├── angular.json ├── eslint.config.js ├── nginx.conf ├── ngsw-config.json ├── package-lock.json ├── package.json ├── public ├── favicon.ico ├── icons │ ├── icon-128x128.png │ ├── icon-144x144.png │ ├── icon-152x152.png │ ├── icon-192x192.png │ ├── icon-384x384.png │ ├── icon-512x512.png │ ├── icon-72x72.png │ └── icon-96x96.png └── manifest.webmanifest ├── src ├── app │ ├── app.config.server.ts │ ├── app.config.ts │ ├── app.css │ ├── app.html │ ├── app.routes.server.ts │ ├── app.routes.ts │ ├── app.spec.ts │ ├── app.ts │ ├── core │ │ └── services │ │ │ └── seo │ │ │ ├── seo.service.spec.ts │ │ │ └── seo.service.ts │ ├── features │ │ ├── about │ │ │ ├── about.config.ts │ │ │ ├── about.css │ │ │ ├── about.html │ │ │ ├── about.routes.ts │ │ │ ├── about.spec.ts │ │ │ ├── about.ts │ │ │ ├── experience │ │ │ │ ├── experience.css │ │ │ │ ├── experience.html │ │ │ │ ├── experience.spec.ts │ │ │ │ └── experience.ts │ │ │ └── skill │ │ │ │ ├── skill.css │ │ │ │ ├── skill.html │ │ │ │ ├── skill.spec.ts │ │ │ │ └── skill.ts │ │ ├── contact │ │ │ ├── contact.config.ts │ │ │ ├── contact.css │ │ │ ├── contact.html │ │ │ ├── contact.routes.ts │ │ │ ├── contact.spec.ts │ │ │ ├── contact.ts │ │ │ ├── mailing │ │ │ │ ├── mailing.css │ │ │ │ ├── mailing.html │ │ │ │ ├── mailing.spec.ts │ │ │ │ └── mailing.ts │ │ │ ├── mapping │ │ │ │ ├── mapping.css │ │ │ │ ├── mapping.html │ │ │ │ ├── mapping.spec.ts │ │ │ │ └── mapping.ts │ │ │ └── website │ │ │ │ ├── website.css │ │ │ │ ├── website.html │ │ │ │ ├── website.spec.ts │ │ │ │ └── website.ts │ │ ├── home │ │ │ ├── feature.ts │ │ │ ├── home.css │ │ │ ├── home.html │ │ │ ├── home.spec.ts │ │ │ └── home.ts │ │ ├── login │ │ │ ├── login.css │ │ │ ├── login.html │ │ │ ├── login.spec.ts │ │ │ └── login.ts │ │ ├── not-found │ │ │ ├── not-found.css │ │ │ ├── not-found.html │ │ │ ├── not-found.spec.ts │ │ │ └── not-found.ts │ │ ├── signup │ │ │ ├── signup.css │ │ │ ├── signup.html │ │ │ ├── signup.spec.ts │ │ │ └── signup.ts │ │ └── tutorials │ │ │ ├── example-bootstrap │ │ │ ├── 00-main │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ ├── items.component.ts │ │ │ │ └── items.ts │ │ │ ├── accordions │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ ├── items.component.spec.ts │ │ │ │ └── items.component.ts │ │ │ ├── alerts │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── badges │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── blockquotes │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── breadcrumb │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── buttons │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── cards │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── checkbox │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── collapses │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── dropdowns │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── forms │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── list-group │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── pagination │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── progress │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── spinners │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── tables │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── tutorial.component.css │ │ │ ├── tutorial.component.html │ │ │ ├── tutorial.component.spec.ts │ │ │ ├── tutorial.component.ts │ │ │ ├── tutorial.config.ts │ │ │ ├── tutorial.routes.ts │ │ │ └── typography │ │ │ │ ├── items.component.css │ │ │ │ ├── items.component.html │ │ │ │ └── items.component.ts │ │ │ ├── example-components │ │ │ ├── channel │ │ │ │ ├── channel.component.css │ │ │ │ ├── channel.component.html │ │ │ │ ├── channel.component.ts │ │ │ │ └── channel.ts │ │ │ ├── tutorial.component.css │ │ │ ├── tutorial.component.html │ │ │ └── tutorial.component.ts │ │ │ ├── example-forms │ │ │ ├── 00-main │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ └── items.ts │ │ │ ├── 01-single │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ └── exercice.component.ts │ │ │ ├── 02-multi │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ ├── movie.spec.ts │ │ │ │ └── movie.ts │ │ │ ├── 03-init-class │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ ├── movie.spec.ts │ │ │ │ └── movie.ts │ │ │ ├── 04-prototype │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ └── exercice.component.ts │ │ │ ├── 05-form-control │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ └── exercice.component.ts │ │ │ ├── 06-form-control-class │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ └── movie.ts │ │ │ ├── 07-form-group │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ └── pretty-json.pipe.ts │ │ │ ├── 08-form-builder │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ └── pretty-json.pipe.ts │ │ │ ├── 09-form-builder-nested │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ ├── movie.ts │ │ │ │ └── pretty-json.pipe.ts │ │ │ ├── 10-form-array │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ ├── movie.ts │ │ │ │ └── pretty-json.pipe.ts │ │ │ ├── 11-form-multi │ │ │ │ ├── exercice.component.css │ │ │ │ ├── exercice.component.html │ │ │ │ ├── exercice.component.ts │ │ │ │ ├── movie.ts │ │ │ │ └── pretty-json.pipe.ts │ │ │ ├── tutorial.component.css │ │ │ ├── tutorial.component.html │ │ │ ├── tutorial.component.ts │ │ │ ├── tutorial.config.ts │ │ │ └── tutorial.routes.ts │ │ │ ├── example-items │ │ │ ├── items.component.css │ │ │ ├── items.component.html │ │ │ ├── items.component.ts │ │ │ └── services │ │ │ │ ├── items.service.spec.ts │ │ │ │ └── items.service.ts │ │ │ └── example-services │ │ │ ├── safe.pipe.ts │ │ │ ├── song │ │ │ ├── mock-songs.ts │ │ │ ├── song.service.spec.ts │ │ │ ├── song.service.ts │ │ │ └── song.ts │ │ │ ├── tutorial.component.css │ │ │ ├── tutorial.component.html │ │ │ └── tutorial.component.ts │ ├── robots.txt │ └── sitemap.xml ├── assets │ ├── .gitkeep │ └── params │ │ ├── css │ │ ├── fonts.googleapis.css │ │ └── fonts.googleapis.min.css │ │ ├── images │ │ ├── channels │ │ │ ├── cinemax.jpg │ │ │ ├── cw.jpg │ │ │ ├── discovery-channel.jpg │ │ │ ├── disney-channel.jpg │ │ │ ├── fox.jpg │ │ │ ├── hbo.jpg │ │ │ ├── history.jpg │ │ │ ├── hulu.jpg │ │ │ ├── mtv.jpg │ │ │ ├── nbc.jpg │ │ │ ├── netflix.jpg │ │ │ ├── showtime.jpg │ │ │ └── usa-network.jpg │ │ ├── example-bootstrap │ │ │ └── movie-screen.jpg │ │ ├── logo │ │ │ ├── ganatan-logo.png │ │ │ └── ganatan-logo@2x.png │ │ └── studio │ │ │ ├── 2560px-Valve_old_logo.svg.png │ │ │ ├── Bioware-logo.png │ │ │ ├── Electronic_Arts-Logo.wine.png │ │ │ ├── Logo-Nintendo-1.jpg │ │ │ ├── Naughty-dog-logo.png │ │ │ └── Rockstar_Games_Logo.svg.png │ │ └── js │ │ ├── popovers.js │ │ ├── toasts.js │ │ └── tooltips.js ├── environments │ ├── environment.development.ts │ └── environment.ts ├── index.html ├── main.server.ts ├── main.ts ├── robots.txt ├── server.ts ├── sitemap.xml └── styles.css ├── tsconfig.app.json ├── tsconfig.json ├── tsconfig.spec.json └── ui ├── assets ├── bootstrap │ ├── css │ │ ├── bootstrap-grid.css │ │ ├── bootstrap-grid.css.map │ │ ├── bootstrap-grid.min.css │ │ ├── bootstrap-grid.min.css.map │ │ ├── bootstrap-grid.rtl.css │ │ ├── bootstrap-grid.rtl.css.map │ │ ├── bootstrap-grid.rtl.min.css │ │ ├── bootstrap-grid.rtl.min.css.map │ │ ├── bootstrap-reboot.css │ │ ├── bootstrap-reboot.css.map │ │ ├── bootstrap-reboot.min.css │ │ ├── bootstrap-reboot.min.css.map │ │ ├── bootstrap-reboot.rtl.css │ │ ├── bootstrap-reboot.rtl.css.map │ │ ├── bootstrap-reboot.rtl.min.css │ │ ├── bootstrap-reboot.rtl.min.css.map │ │ ├── bootstrap-utilities.css │ │ ├── bootstrap-utilities.css.map │ │ ├── bootstrap-utilities.min.css │ │ ├── bootstrap-utilities.min.css.map │ │ ├── bootstrap-utilities.rtl.css │ │ ├── bootstrap-utilities.rtl.css.map │ │ ├── bootstrap-utilities.rtl.min.css │ │ ├── bootstrap-utilities.rtl.min.css.map │ │ ├── bootstrap.css │ │ ├── bootstrap.css.map │ │ ├── bootstrap.min.css │ │ ├── bootstrap.min.css.map │ │ ├── bootstrap.rtl.css │ │ ├── bootstrap.rtl.css.map │ │ ├── bootstrap.rtl.min.css │ │ └── bootstrap.rtl.min.css.map │ └── js │ │ ├── bootstrap.bundle.js │ │ ├── bootstrap.bundle.js.map │ │ ├── bootstrap.bundle.min.js │ │ ├── bootstrap.bundle.min.js.map │ │ ├── bootstrap.esm.js │ │ ├── bootstrap.esm.js.map │ │ ├── bootstrap.esm.min.js │ │ ├── bootstrap.esm.min.js.map │ │ ├── bootstrap.js │ │ ├── bootstrap.js.map │ │ ├── bootstrap.min.js │ │ └── bootstrap.min.js.map ├── fontawesome │ ├── css │ │ ├── all.css │ │ ├── all.min.css │ │ ├── brands.css │ │ ├── brands.min.css │ │ ├── fontawesome.css │ │ ├── fontawesome.min.css │ │ ├── regular.css │ │ ├── regular.min.css │ │ ├── solid.css │ │ ├── solid.min.css │ │ ├── svg-with-js.css │ │ ├── svg-with-js.min.css │ │ ├── v4-font-face.css │ │ ├── v4-font-face.min.css │ │ ├── v4-shims.css │ │ ├── v4-shims.min.css │ │ ├── v5-font-face.css │ │ └── v5-font-face.min.css │ ├── js │ │ ├── all.js │ │ ├── all.min.js │ │ ├── brands.js │ │ ├── brands.min.js │ │ ├── conflict-detection.js │ │ ├── conflict-detection.min.js │ │ ├── fontawesome.js │ │ ├── fontawesome.min.js │ │ ├── regular.js │ │ ├── regular.min.js │ │ ├── solid.js │ │ ├── solid.min.js │ │ ├── v4-shims.js │ │ └── v4-shims.min.js │ └── webfonts │ │ ├── fa-brands-400.ttf │ │ ├── fa-brands-400.woff2 │ │ ├── fa-regular-400.ttf │ │ ├── fa-regular-400.woff2 │ │ ├── fa-solid-900.ttf │ │ ├── fa-solid-900.woff2 │ │ ├── fa-v4compatibility.ttf │ │ └── fa-v4compatibility.woff2 └── params │ ├── css │ ├── body.css │ ├── fonts.googleapis.css │ ├── fonts.googleapis.min.css │ ├── footer.css │ └── header.css │ ├── images │ └── logo │ │ ├── ganatan-logo.png │ │ └── ganatan-logo@2x.png │ └── js │ ├── popovers.js │ ├── toasts.js │ └── tooltips.js └── home.html /frontend-angular-19/.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 | [*.ts] 12 | quote_type = single 13 | ij_typescript_use_double_quotes = false 14 | 15 | [*.md] 16 | max_line_length = off 17 | trim_trailing_whitespace = false 18 | -------------------------------------------------------------------------------- /frontend-angular-19/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://docs.github.com/get-started/getting-started-with-git/ignoring-files for more about ignoring files. 2 | 3 | # Compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | /bazel-out 8 | 9 | # Node 10 | /node_modules 11 | npm-debug.log 12 | yarn-error.log 13 | 14 | # IDEs and editors 15 | .idea/ 16 | .project 17 | .classpath 18 | .c9/ 19 | *.launch 20 | .settings/ 21 | *.sublime-workspace 22 | 23 | # Visual Studio Code 24 | .vscode/* 25 | !.vscode/settings.json 26 | !.vscode/tasks.json 27 | !.vscode/launch.json 28 | !.vscode/extensions.json 29 | .history/* 30 | 31 | # Miscellaneous 32 | /.angular/cache 33 | .sass-cache/ 34 | /connect.lock 35 | /coverage 36 | /libpeerconnection.log 37 | testem.log 38 | /typings 39 | 40 | # System files 41 | .DS_Store 42 | Thumbs.db 43 | -------------------------------------------------------------------------------- /frontend-angular-19/nginx.conf: -------------------------------------------------------------------------------- 1 | user www-data; 2 | worker_processes auto; 3 | pid /run/nginx.pid; 4 | error_log /var/log/nginx/error.log; 5 | include /etc/nginx/modules-enabled/*.conf; 6 | 7 | events { 8 | worker_connections 768; 9 | } 10 | 11 | http { 12 | sendfile on; 13 | tcp_nopush on; 14 | types_hash_max_size 2048; 15 | 16 | include /etc/nginx/mime.types; 17 | default_type application/octet-stream; 18 | 19 | ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3; # Dropping SSLv3, ref: POODLE 20 | ssl_prefer_server_ciphers on; 21 | 22 | access_log /var/log/nginx/access.log; 23 | gzip on; 24 | include /etc/nginx/conf.d/*.conf; 25 | server { 26 | listen 80 default_server; 27 | listen [::]:80 default_server; 28 | 29 | root /var/www/html; 30 | index index.html index.htm index.nginx-debian.html; 31 | server_name _; 32 | location / { 33 | try_files $uri $uri/ =404; 34 | } 35 | 36 | } 37 | } -------------------------------------------------------------------------------- /frontend-angular-19/ngsw-config.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "./node_modules/@angular/service-worker/config/schema.json", 3 | "index": "/index.html", 4 | "assetGroups": [ 5 | { 6 | "name": "app", 7 | "installMode": "prefetch", 8 | "resources": { 9 | "files": [ 10 | "/favicon.ico", 11 | "/index.csr.html", 12 | "/index.html", 13 | "/manifest.webmanifest", 14 | "/*.css", 15 | "/*.js" 16 | ] 17 | } 18 | }, 19 | { 20 | "name": "assets", 21 | "installMode": "lazy", 22 | "updateMode": "prefetch", 23 | "resources": { 24 | "files": [ 25 | "/**/*.(svg|cur|jpg|jpeg|png|apng|webp|avif|gif|otf|ttf|woff|woff2)" 26 | ] 27 | } 28 | } 29 | ] 30 | } 31 | -------------------------------------------------------------------------------- /frontend-angular-19/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/public/favicon.ico -------------------------------------------------------------------------------- /frontend-angular-19/public/icons/icon-128x128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/public/icons/icon-128x128.png -------------------------------------------------------------------------------- /frontend-angular-19/public/icons/icon-144x144.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/public/icons/icon-144x144.png -------------------------------------------------------------------------------- /frontend-angular-19/public/icons/icon-152x152.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/public/icons/icon-152x152.png -------------------------------------------------------------------------------- /frontend-angular-19/public/icons/icon-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/public/icons/icon-192x192.png -------------------------------------------------------------------------------- /frontend-angular-19/public/icons/icon-384x384.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/public/icons/icon-384x384.png -------------------------------------------------------------------------------- /frontend-angular-19/public/icons/icon-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/public/icons/icon-512x512.png -------------------------------------------------------------------------------- /frontend-angular-19/public/icons/icon-72x72.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/public/icons/icon-72x72.png -------------------------------------------------------------------------------- /frontend-angular-19/public/icons/icon-96x96.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/public/icons/icon-96x96.png -------------------------------------------------------------------------------- /frontend-angular-19/src/app/app.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed } from '@angular/core/testing'; 2 | import { AppComponent } from './app.component'; 3 | 4 | import { ActivatedRoute } from '@angular/router'; 5 | 6 | describe('AppComponent', () => { 7 | beforeEach(async () => { 8 | await TestBed.configureTestingModule({ 9 | imports: [AppComponent], 10 | providers: [ 11 | { 12 | provide: ActivatedRoute, 13 | useValue: {} 14 | } 15 | ] 16 | }).compileComponents(); 17 | }); 18 | 19 | it('should create the app', () => { 20 | const fixture = TestBed.createComponent(AppComponent); 21 | const app = fixture.componentInstance; 22 | expect(app).toBeTruthy(); 23 | }); 24 | 25 | it(`should have the 'angular-starter' title`, () => { 26 | const fixture = TestBed.createComponent(AppComponent); 27 | const app = fixture.componentInstance; 28 | expect(app.title).toEqual('angular-routing'); 29 | }); 30 | 31 | }); 32 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/app.config.server.ts: -------------------------------------------------------------------------------- 1 | import { mergeApplicationConfig, ApplicationConfig } from '@angular/core'; 2 | import { provideServerRendering } from '@angular/platform-server'; 3 | import { appConfig } from './app.config'; 4 | 5 | const serverConfig: ApplicationConfig = { 6 | providers: [ 7 | provideServerRendering(), 8 | ] 9 | }; 10 | 11 | export const config = mergeApplicationConfig(appConfig, serverConfig); 12 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/app.config.ts: -------------------------------------------------------------------------------- 1 | import { ApplicationConfig, provideZoneChangeDetection, isDevMode } from '@angular/core'; 2 | import { provideRouter } from '@angular/router'; 3 | 4 | import { provideHttpClient, withFetch } from '@angular/common/http'; 5 | 6 | import { routes } from './app.routes'; 7 | import { provideClientHydration, withEventReplay } from '@angular/platform-browser'; 8 | import { provideServiceWorker } from '@angular/service-worker'; 9 | 10 | export const appConfig: ApplicationConfig = { 11 | providers: [ 12 | provideHttpClient( 13 | withFetch(), 14 | ), 15 | provideZoneChangeDetection({ eventCoalescing: true }), 16 | provideRouter(routes), 17 | provideClientHydration(withEventReplay()), 18 | provideServiceWorker('ngsw-worker.js', { 19 | enabled: !isDevMode(), 20 | registrationStrategy: 'registerWhenStable:30000' 21 | })] 22 | }; 23 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/core/services/seo/seo.service.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed } from '@angular/core/testing'; 2 | 3 | import { SeoService } from './seo.service'; 4 | 5 | describe('SeoService', () => { 6 | let service: SeoService; 7 | 8 | beforeEach(() => { 9 | TestBed.configureTestingModule({}); 10 | service = TestBed.inject(SeoService); 11 | }); 12 | 13 | it('should be created', () => { 14 | expect(service).toBeTruthy(); 15 | }); 16 | }); 17 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/core/services/seo/seo.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { Meta, Title } from '@angular/platform-browser'; 3 | 4 | @Injectable({ 5 | providedIn: 'root' 6 | }) 7 | export class SeoService { 8 | 9 | constructor( 10 | private meta: Meta, 11 | private titleService: Title) { 12 | 13 | } 14 | 15 | public setMetaDescription(content: string) { 16 | 17 | this.meta.updateTag( 18 | { 19 | name: 'description', 20 | content: content 21 | }); 22 | } 23 | 24 | public setMetaTitle(title:string) { 25 | 26 | this.titleService.setTitle(title); 27 | 28 | } 29 | 30 | } 31 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/about.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/about/about.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/about.component.html: -------------------------------------------------------------------------------- 1 |
2 |

about works!

3 | 7 |

Child Routes Result

8 | 9 |
-------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/about.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { AboutComponent } from './about.component'; 4 | import { ActivatedRoute } from '@angular/router'; 5 | 6 | describe('AboutComponent', () => { 7 | let component: AboutComponent; 8 | let fixture: ComponentFixture; 9 | 10 | beforeEach(async () => { 11 | await TestBed.configureTestingModule({ 12 | imports: [AboutComponent], 13 | providers: [ 14 | { 15 | provide: ActivatedRoute, 16 | useValue: {} 17 | } 18 | ] 19 | }) 20 | .compileComponents(); 21 | 22 | fixture = TestBed.createComponent(AboutComponent); 23 | component = fixture.componentInstance; 24 | fixture.detectChanges(); 25 | }); 26 | 27 | it('should create', () => { 28 | expect(component).toBeTruthy(); 29 | }); 30 | }); 31 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/about.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink, RouterOutlet } from '@angular/router'; 4 | 5 | @Component({ 6 | selector: 'app-about', 7 | imports: [CommonModule, RouterLink, RouterOutlet], 8 | templateUrl: './about.component.html', 9 | styleUrl: './about.component.css' 10 | }) 11 | export class AboutComponent { 12 | 13 | } 14 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/about.config.ts: -------------------------------------------------------------------------------- 1 | import { ApplicationConfig } from '@angular/core'; 2 | import { provideRouter } from '@angular/router'; 3 | 4 | import { routes } from './about.routes'; 5 | 6 | export const aboutConfig: ApplicationConfig = { 7 | providers: [provideRouter(routes)] 8 | }; 9 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/about.routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { AboutComponent } from './about.component'; 4 | 5 | export const routes: Routes = [ 6 | { 7 | path: '', component: AboutComponent, children: [ 8 | { 9 | path: '', 10 | loadComponent: () => import(`./experience/experience.component`) 11 | .then(mod => mod.ExperienceComponent) 12 | }, 13 | { 14 | path: 'experience', 15 | loadComponent: () => import(`./experience/experience.component`) 16 | .then(mod => mod.ExperienceComponent) 17 | }, 18 | { 19 | path: 'skill', 20 | loadComponent: () => import(`./skill/skill.component`) 21 | .then(mod => mod.SkillComponent) 22 | }, 23 | 24 | { 25 | path: '**', 26 | loadComponent: () => import(`./experience/experience.component`) 27 | .then(mod => mod.ExperienceComponent) 28 | }, 29 | 30 | ] 31 | }, 32 | ]; -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/experience/experience.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/about/experience/experience.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/experience/experience.component.html: -------------------------------------------------------------------------------- 1 |

experience works!

2 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/experience/experience.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ExperienceComponent } from './experience.component'; 4 | 5 | describe('ExperienceComponent', () => { 6 | let component: ExperienceComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [ExperienceComponent] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(ExperienceComponent); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/experience/experience.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-experience', 5 | imports: [], 6 | templateUrl: './experience.component.html', 7 | styleUrl: './experience.component.css' 8 | }) 9 | export class ExperienceComponent { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/skill/skill.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/about/skill/skill.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/skill/skill.component.html: -------------------------------------------------------------------------------- 1 |

skill works!

2 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/skill/skill.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SkillComponent } from './skill.component'; 4 | 5 | describe('SkillComponent', () => { 6 | let component: SkillComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [SkillComponent] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(SkillComponent); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/about/skill/skill.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-skill', 5 | imports: [], 6 | templateUrl: './skill.component.html', 7 | styleUrl: './skill.component.css' 8 | }) 9 | export class SkillComponent { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/contact.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/contact/contact.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/contact.component.html: -------------------------------------------------------------------------------- 1 |
2 |

contact works!

3 | 8 |

Child Routes Result

9 | 10 |
-------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/contact.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ContactComponent } from './contact.component'; 4 | import { ActivatedRoute } from '@angular/router'; 5 | 6 | describe('ContactComponent', () => { 7 | let component: ContactComponent; 8 | let fixture: ComponentFixture; 9 | 10 | beforeEach(async () => { 11 | await TestBed.configureTestingModule({ 12 | imports: [ContactComponent], 13 | providers: [ 14 | { 15 | provide: ActivatedRoute, 16 | useValue: {} 17 | } 18 | ] 19 | }) 20 | .compileComponents(); 21 | 22 | fixture = TestBed.createComponent(ContactComponent); 23 | component = fixture.componentInstance; 24 | fixture.detectChanges(); 25 | }); 26 | 27 | it('should create', () => { 28 | expect(component).toBeTruthy(); 29 | }); 30 | }); 31 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/contact.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink, RouterOutlet } from '@angular/router'; 4 | 5 | @Component({ 6 | selector: 'app-contact', 7 | imports: [CommonModule, RouterLink, RouterOutlet], 8 | templateUrl: './contact.component.html', 9 | styleUrl: './contact.component.css' 10 | }) 11 | export class ContactComponent { 12 | 13 | } 14 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/contact.config.ts: -------------------------------------------------------------------------------- 1 | import { ApplicationConfig } from '@angular/core'; 2 | import { provideRouter } from '@angular/router'; 3 | 4 | import { routes } from './contact.routes'; 5 | 6 | export const contactConfig: ApplicationConfig = { 7 | providers: [provideRouter(routes)] 8 | }; 9 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/contact.routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { ContactComponent } from './contact.component'; 4 | 5 | export const routes: Routes = [ 6 | { 7 | path: '', component: ContactComponent, children: [ 8 | { 9 | path: '', 10 | loadComponent: () => import(`./mailing/mailing.component`) 11 | .then(mod => mod.MailingComponent) 12 | }, 13 | { 14 | path: 'mapping', 15 | loadComponent: () => import(`./mapping/mapping.component`) 16 | .then(mod => mod.MappingComponent) 17 | }, 18 | { 19 | path: 'website', 20 | loadComponent: () => import(`./website/website.component`) 21 | .then(mod => mod.WebsiteComponent) 22 | }, 23 | 24 | { 25 | path: '**', 26 | loadComponent: () => import(`./mailing/mailing.component`) 27 | .then(mod => mod.MailingComponent) 28 | }, 29 | 30 | ] 31 | }, 32 | ]; -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/mailing/mailing.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/contact/mailing/mailing.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/mailing/mailing.component.html: -------------------------------------------------------------------------------- 1 |

mailing works!

2 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/mailing/mailing.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MailingComponent } from './mailing.component'; 4 | 5 | describe('MailingComponent', () => { 6 | let component: MailingComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [MailingComponent] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(MailingComponent); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/mailing/mailing.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-mailing', 5 | imports: [], 6 | templateUrl: './mailing.component.html', 7 | styleUrl: './mailing.component.css' 8 | }) 9 | export class MailingComponent { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/mapping/mapping.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/contact/mapping/mapping.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/mapping/mapping.component.html: -------------------------------------------------------------------------------- 1 |

mapping works!

2 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/mapping/mapping.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MappingComponent } from './mapping.component'; 4 | 5 | describe('MappingComponent', () => { 6 | let component: MappingComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [MappingComponent] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(MappingComponent); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/mapping/mapping.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-mapping', 5 | imports: [], 6 | templateUrl: './mapping.component.html', 7 | styleUrl: './mapping.component.css' 8 | }) 9 | export class MappingComponent { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/website/website.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/contact/website/website.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/website/website.component.html: -------------------------------------------------------------------------------- 1 |

website works!

2 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/website/website.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { WebsiteComponent } from './website.component'; 4 | 5 | describe('WebsiteComponent', () => { 6 | let component: WebsiteComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [WebsiteComponent] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(WebsiteComponent); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/contact/website/website.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-website', 5 | imports: [], 6 | templateUrl: './website.component.html', 7 | styleUrl: './website.component.css' 8 | }) 9 | export class WebsiteComponent { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/home/feature.ts: -------------------------------------------------------------------------------- 1 | export class Feature { 2 | 3 | name: string; 4 | description: string; 5 | icon: string; 6 | link: string; 7 | 8 | constructor() { 9 | this.name = ''; 10 | this.description = ''; 11 | this.icon = ''; 12 | this.link = ''; 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/home/home.component.css: -------------------------------------------------------------------------------- 1 | .nga-card { 2 | display: block; 3 | background-color: rgba(255, 255, 255, .8); 4 | box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24); 5 | border-radius: 2px; 6 | transition: all .2s ease-in-out; 7 | cursor: pointer; 8 | } 9 | 10 | .nga-card:hover { 11 | transform: translateY(-3px); 12 | box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23); 13 | } 14 | 15 | .nga-card a { 16 | color: black; 17 | text-decoration: none; 18 | } 19 | 20 | .nga-card a:hover { 21 | color: #0d6efd; 22 | text-decoration: none; 23 | } -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/home/home.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { HomeComponent } from './home.component'; 4 | import { ActivatedRoute } from '@angular/router'; 5 | 6 | describe('HomeComponent', () => { 7 | let component: HomeComponent; 8 | let fixture: ComponentFixture; 9 | 10 | beforeEach(async () => { 11 | await TestBed.configureTestingModule({ 12 | imports: [HomeComponent], 13 | providers: [ 14 | { 15 | provide: ActivatedRoute, 16 | useValue: {} 17 | } 18 | ] 19 | }) 20 | .compileComponents(); 21 | 22 | fixture = TestBed.createComponent(HomeComponent); 23 | component = fixture.componentInstance; 24 | fixture.detectChanges(); 25 | }); 26 | 27 | it('should create', () => { 28 | expect(component).toBeTruthy(); 29 | }); 30 | }); 31 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/login/login.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/login/login.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/login/login.component.html: -------------------------------------------------------------------------------- 1 |

login works!

2 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/login/login.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { LoginComponent } from './login.component'; 4 | 5 | describe('LoginComponent', () => { 6 | let component: LoginComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [LoginComponent] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(LoginComponent); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/login/login.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-login', 5 | templateUrl: './login.component.html', 6 | styleUrl: './login.component.css' 7 | }) 8 | export class LoginComponent { 9 | 10 | } -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/not-found/not-found.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/not-found/not-found.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/not-found/not-found.component.html: -------------------------------------------------------------------------------- 1 |

not-found works!

2 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/not-found/not-found.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { NotFoundComponent } from './not-found.component'; 4 | 5 | describe('NotFoundComponent', () => { 6 | let component: NotFoundComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [NotFoundComponent] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(NotFoundComponent); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/not-found/not-found.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-not-found', 5 | imports: [], 6 | templateUrl: './not-found.component.html', 7 | styleUrl: './not-found.component.css' 8 | }) 9 | export class NotFoundComponent { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/signup/signup.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/signup/signup.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/signup/signup.component.html: -------------------------------------------------------------------------------- 1 |

signup works!

2 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/signup/signup.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SignupComponent } from './signup.component'; 4 | 5 | describe('SignupComponent', () => { 6 | let component: SignupComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [SignupComponent] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(SignupComponent); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/signup/signup.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-signup', 5 | templateUrl: './signup.component.html', 6 | styleUrl: './signup.component.css' 7 | }) 8 | export class SignupComponent { 9 | 10 | } -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/00-main/items.component.css: -------------------------------------------------------------------------------- 1 | .card { 2 | -webkit-transition: -webkit-transform 1s; 3 | -moz-transition: -moz-transform 1s; 4 | -o-transition: -o-transform 1s; 5 | transition: transform 1s; 6 | -webkit-transform-style: preserve-3d; 7 | -moz-transform-style: preserve-3d; 8 | -o-transform-style: preserve-3d; 9 | transform-style: preserve-3d; 10 | position: relative; 11 | } 12 | 13 | .nga-card-header { 14 | padding: 0.5rem 1rem; 15 | margin-bottom: 0; 16 | background-color: white; 17 | } 18 | 19 | .nga-card-rotate { 20 | -webkit-perspective: 800px; 21 | -moz-perspective: 800px; 22 | -o-perspective: 800px; 23 | perspective: 800px; 24 | margin-bottom: 30px; 25 | } 26 | 27 | .nga-card-rotate a { 28 | text-decoration: none; 29 | } 30 | 31 | .nga-card-rotate:not(.manual-flip):hover .card, 32 | .nga-card-rotate.hover.manual-flip .card { 33 | -webkit-transform: rotateY(180deg); 34 | -moz-transform: rotateY(180deg); 35 | -o-transform: rotateY(180deg); 36 | transform: rotateY(180deg); 37 | } -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/00-main/items.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Bootstrap Features

4 |
5 |
6 | 7 |
8 |
9 |
10 | 11 |
12 |
13 |
14 |
15 |
{{ item.name }}
16 |
17 |
18 | 19 |
20 |
21 |
22 |
23 | 24 |
25 |
26 |
-------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/00-main/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink } from '@angular/router'; 4 | import { ITEMS } from './items'; 5 | 6 | @Component({ 7 | selector: 'app-00-main', 8 | imports: [CommonModule, RouterLink], 9 | templateUrl: './items.component.html', 10 | styleUrls: ['./items.component.css'] 11 | }) 12 | export class ItemsComponent { 13 | items = ITEMS; 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/accordions/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/accordions/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/accordions/items.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ItemsComponent } from './items.component'; 4 | 5 | describe('AccordionsComponent', () => { 6 | let component: ItemsComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [ItemsComponent] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(ItemsComponent); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/accordions/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-accordions', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/alerts/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/alerts/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/alerts/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-alerts', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/badges/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/badges/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/badges/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-badge', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/blockquotes/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/blockquotes/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/blockquotes/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-blockquotes', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/breadcrumb/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/breadcrumb/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/breadcrumb/items.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Breadcrumb

4 | 9 | 15 | 22 |
23 |
24 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/breadcrumb/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-breadcrumb', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/buttons/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/buttons/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/buttons/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-buttons', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/cards/items.component.css: -------------------------------------------------------------------------------- 1 | .nga-card { 2 | -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); 3 | box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12) 4 | } 5 | 6 | .nga-card-box { 7 | display: block; 8 | background-color: rgba(255, 255, 255, .8); 9 | box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24); 10 | border-radius: 2px; 11 | transition: all .2s ease-in-out; 12 | cursor: pointer; 13 | } 14 | 15 | .nga-card-box:hover { 16 | box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23); 17 | } -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/cards/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-alerts', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/checkbox/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/checkbox/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/checkbox/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-collapse', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/collapses/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/collapses/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/collapses/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | // eslint-disable-next-line 4 | declare const bootstrap: any; 5 | 6 | @Component({ 7 | selector: 'app-collapse', 8 | templateUrl: './items.component.html', 9 | styleUrls: ['./items.component.css'] 10 | }) 11 | export class ItemsComponent { 12 | 13 | closeCollapse() { 14 | const myCollapse = document.getElementById('collapseWidthJavascript') 15 | new bootstrap.Collapse(myCollapse, { 16 | hide: true, 17 | }) 18 | } 19 | 20 | showCollapse() { 21 | const myCollapse = document.getElementById('collapseWidthJavascript') 22 | new bootstrap.Collapse(myCollapse, { 23 | show: true, 24 | }) 25 | } 26 | 27 | toggleCollapse() { 28 | const myCollapse = document.getElementById('collapseWidthJavascript') 29 | new bootstrap.Collapse(myCollapse, { 30 | toggle: true, 31 | }) 32 | } 33 | 34 | } 35 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/dropdowns/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/dropdowns/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/dropdowns/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-dropdowns', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/forms/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/forms/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/forms/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-forms', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/list-group/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/list-group/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/list-group/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-list-group', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/pagination/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/pagination/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/pagination/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-pagination', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/progress/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/progress/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/progress/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-progress', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/spinners/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/spinners/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/spinners/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-spinners', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/tables/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/tables/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/tables/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-pagination', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/tutorial.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { TutorialComponent } from './tutorial.component'; 4 | import { ActivatedRoute } from '@angular/router'; 5 | 6 | describe('TutorialComponent', () => { 7 | let component: TutorialComponent; 8 | let fixture: ComponentFixture; 9 | 10 | beforeEach(async () => { 11 | await TestBed.configureTestingModule({ 12 | imports: [TutorialComponent], 13 | providers: [ 14 | { 15 | provide: ActivatedRoute, 16 | useValue: {} 17 | } 18 | ] 19 | }) 20 | .compileComponents(); 21 | 22 | fixture = TestBed.createComponent(TutorialComponent); 23 | component = fixture.componentInstance; 24 | fixture.detectChanges(); 25 | }); 26 | 27 | it('should create', () => { 28 | expect(component).toBeTruthy(); 29 | }); 30 | }); 31 | 32 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/tutorial.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink, RouterOutlet } from '@angular/router'; 4 | 5 | @Component({ 6 | selector: 'app-example-bootstrap', 7 | imports: [CommonModule, RouterLink, RouterOutlet], 8 | templateUrl: './tutorial.component.html', 9 | styleUrls: ['./tutorial.component.css'] 10 | }) 11 | export class TutorialComponent { 12 | 13 | } 14 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/tutorial.config.ts: -------------------------------------------------------------------------------- 1 | import { ApplicationConfig } from '@angular/core'; 2 | import { provideRouter } from '@angular/router'; 3 | 4 | import { routes } from './tutorial.routes'; 5 | 6 | export const tutorialConfig: ApplicationConfig = { 7 | providers: [provideRouter(routes)] 8 | }; 9 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/typography/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-bootstrap/typography/items.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-bootstrap/typography/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-collapse', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-components/channel/channel.component.css: -------------------------------------------------------------------------------- 1 | .nga-card-component { 2 | position: relative; 3 | display: flex; 4 | flex-direction: column; 5 | min-width: 0; 6 | word-wrap: break-word; 7 | background-color: #fff; 8 | background-clip: border-box; 9 | cursor: pointer; 10 | -webkit-box-shadow: 0 0px 1px 0 rgba(0, 0, 0, 0.16), 0 0px 5px 0 rgba(0, 0, 0, 0.12); 11 | box-shadow: 0 0px 1px 0 rgba(0, 0, 0, 0.16), 0 0px 5px 0 rgba(0, 0, 0, 0.12); 12 | } 13 | 14 | .nga-card-component:hover { 15 | -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); 16 | box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); 17 | } 18 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-components/channel/channel.component.html: -------------------------------------------------------------------------------- 1 |
2 | {{channel.name }} 3 |
4 |

{{ channel.releaseDate }}

5 | 6 |
7 |
-------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-components/channel/channel.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, EventEmitter, Output, Input } from '@angular/core'; 2 | 3 | import { Channel } from './channel'; 4 | 5 | @Component({ 6 | selector: 'app-channel', 7 | templateUrl: './channel.component.html', 8 | styleUrls: ['./channel.component.css'] 9 | }) 10 | export class ChannelComponent { 11 | 12 | @Input() channel: Channel; 13 | @Input() index: number; 14 | @Output() selected: EventEmitter = new EventEmitter(); 15 | 16 | constructor() { 17 | this.channel = new Channel(); 18 | this.index = 0; 19 | } 20 | 21 | select(channel: Channel): void { 22 | this.selected.emit(channel); 23 | } 24 | 25 | } 26 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-components/channel/channel.ts: -------------------------------------------------------------------------------- 1 | export class Channel { 2 | 3 | title: string; 4 | name: string; 5 | releaseDate: string; 6 | 7 | constructor() { 8 | this.title = ''; 9 | this.name = ''; 10 | this.releaseDate = ''; 11 | } 12 | 13 | } 14 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-components/tutorial.component.css: -------------------------------------------------------------------------------- 1 | .nga-card-component { 2 | position: relative; 3 | display: flex; 4 | flex-direction: column; 5 | min-width: 0; 6 | word-wrap: break-word; 7 | background-color: #fff; 8 | background-clip: border-box; 9 | cursor: pointer; 10 | -webkit-box-shadow: 0 0px 1px 0 rgba(0, 0, 0, 0.16), 0 0px 5px 0 rgba(0, 0, 0, 0.12); 11 | box-shadow: 0 0px 1px 0 rgba(0, 0, 0, 0.16), 0 0px 5px 0 rgba(0, 0, 0, 0.12); 12 | } 13 | 14 | .nga-card-component:hover { 15 | -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); 16 | box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); 17 | } 18 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/00-main/exercice.component.css: -------------------------------------------------------------------------------- 1 | .card { 2 | -webkit-transition: -webkit-transform 1s; 3 | -moz-transition: -moz-transform 1s; 4 | -o-transition: -o-transform 1s; 5 | transition: transform 1s; 6 | -webkit-transform-style: preserve-3d; 7 | -moz-transform-style: preserve-3d; 8 | -o-transform-style: preserve-3d; 9 | transform-style: preserve-3d; 10 | position: relative; 11 | } 12 | 13 | .nga-card-header { 14 | padding: 0.5rem 1rem; 15 | margin-bottom: 0; 16 | background-color: white; 17 | } 18 | 19 | .nga-card-rotate { 20 | -webkit-perspective: 800px; 21 | -moz-perspective: 800px; 22 | -o-perspective: 800px; 23 | perspective: 800px; 24 | margin-bottom: 30px; 25 | } 26 | 27 | .nga-card-rotate a { 28 | text-decoration: none; 29 | } 30 | 31 | .nga-card-rotate:not(.manual-flip):hover .card, 32 | .nga-card-rotate.hover.manual-flip .card { 33 | -webkit-transform: rotateY(180deg); 34 | -moz-transform: rotateY(180deg); 35 | -o-transform: rotateY(180deg); 36 | transform: rotateY(180deg); 37 | } -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/00-main/exercice.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Forms Features  

4 |
5 |
6 | 7 |
8 |
9 |
10 | 11 |
12 |
13 |
14 |
15 |
{{ item.name }}
16 |
17 |
18 | 19 |
20 |
21 |
22 |
23 | 24 |
25 |
26 |
-------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/00-main/exercice.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink } from '@angular/router'; 4 | import { ITEMS } from './items'; 5 | 6 | @Component({ 7 | selector: 'app-prototype', 8 | imports: [CommonModule, RouterLink], 9 | templateUrl: './exercice.component.html', 10 | styleUrls: ['./exercice.component.css'] 11 | }) 12 | export class ExerciceComponent { 13 | items = ITEMS; 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/01-single/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-forms/01-single/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/01-single/exercice.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { FormsModule } from '@angular/forms'; 3 | 4 | @Component({ 5 | selector: 'app-exercice', 6 | imports: [FormsModule], 7 | templateUrl: './exercice.component.html', 8 | styleUrls: ['./exercice.component.css'] 9 | }) 10 | export class ExerciceComponent { 11 | 12 | firstName = 'Paul'; 13 | lastName = 'Atreides'; 14 | 15 | } 16 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/02-multi/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-forms/02-multi/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/02-multi/exercice.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { Movie } from './movie'; 3 | import { CommonModule } from '@angular/common'; 4 | import { FormsModule } from '@angular/forms'; 5 | 6 | @Component({ 7 | selector: 'app-exercice', 8 | imports: [CommonModule, FormsModule], 9 | templateUrl: './exercice.component.html', 10 | styleUrls: ['./exercice.component.css'] 11 | }) 12 | export class ExerciceComponent { 13 | 14 | country: string; 15 | actor: string; 16 | movie: Movie = new Movie(); 17 | movieAny = { name: '' }; 18 | 19 | constructor() { 20 | this.country = 'United States'; 21 | this.actor = 'Tom Cruise'; 22 | this.movie.name = 'Edge of Tomorrow'; 23 | this.movieAny = { name: 'Avatar' }; 24 | } 25 | 26 | } 27 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/02-multi/movie.spec.ts: -------------------------------------------------------------------------------- 1 | import { Movie } from './movie'; 2 | 3 | describe('Movie', () => { 4 | it('should create an instance', () => { 5 | expect(new Movie()).toBeTruthy(); 6 | }); 7 | }); 8 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/02-multi/movie.ts: -------------------------------------------------------------------------------- 1 | export class Movie { 2 | 3 | name: string; 4 | releaseDate: string; 5 | domestic: string; 6 | international: string; 7 | worldwide: string; 8 | franchise: boolean; 9 | 10 | constructor() { 11 | this.name = ''; 12 | this.releaseDate = ''; 13 | this.domestic = ''; 14 | this.international = ''; 15 | this.worldwide = ''; 16 | this.franchise = false; 17 | } 18 | 19 | } 20 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/03-init-class/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-forms/03-init-class/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/03-init-class/exercice.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { Movie } from './movie'; 3 | import { CommonModule } from '@angular/common'; 4 | import { FormsModule } from '@angular/forms'; 5 | 6 | @Component({ 7 | selector: 'app-exercice', 8 | imports: [CommonModule, FormsModule], 9 | templateUrl: './exercice.component.html', 10 | styleUrls: ['./exercice.component.css'] 11 | }) 12 | export class ExerciceComponent { 13 | 14 | movie: Movie = new Movie(); 15 | 16 | constructor() { 17 | this.movie.name = 'Avengers : Endgame'; 18 | this.movie.releaseDate = '04/04/2019'; 19 | this.movie.domestic = '$858,373,000'; 20 | this.movie.international = '$2,797,800,564'; 21 | this.movie.worldwide = '$2,797,800,564'; 22 | this.movie.franchise = true; 23 | } 24 | 25 | } 26 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/03-init-class/movie.spec.ts: -------------------------------------------------------------------------------- 1 | import { Movie } from './movie'; 2 | 3 | describe('Movie', () => { 4 | it('should create an instance', () => { 5 | expect(new Movie()).toBeTruthy(); 6 | }); 7 | }); 8 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/03-init-class/movie.ts: -------------------------------------------------------------------------------- 1 | export class Movie { 2 | 3 | name: string; 4 | releaseDate: string; 5 | domestic: string; 6 | international: string; 7 | worldwide: string; 8 | franchise: boolean; 9 | 10 | constructor() { 11 | this.name = ''; 12 | this.releaseDate = ''; 13 | this.domestic = ''; 14 | this.international = ''; 15 | this.worldwide = ''; 16 | this.franchise = false; 17 | } 18 | 19 | } 20 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/04-prototype/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-forms/04-prototype/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/04-prototype/exercice.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { FormsModule } from '@angular/forms'; 4 | 5 | @Component({ 6 | selector: 'app-prototype', 7 | imports: [CommonModule, FormsModule], 8 | templateUrl: './exercice.component.html', 9 | styleUrls: ['./exercice.component.css'] 10 | }) 11 | export class ExerciceComponent {} 12 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/05-form-control/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-forms/05-form-control/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/06-form-control-class/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-forms/06-form-control-class/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/06-form-control-class/movie.ts: -------------------------------------------------------------------------------- 1 | export class Movie { 2 | 3 | name: string; 4 | releaseDate: string; 5 | franchise: boolean; 6 | budget: number; 7 | worldwide: number; 8 | summary: string; 9 | 10 | constructor() { 11 | this.name = ''; 12 | this.releaseDate = '03/01/1892'; 13 | this.franchise = false; 14 | this.budget = 0; 15 | this.worldwide = 0 16 | this.summary = ''; 17 | } 18 | 19 | } 20 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/07-form-group/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-forms/07-form-group/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/07-form-group/pretty-json.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'prettyjson' 5 | }) 6 | export class PrettyJsonPipe implements PipeTransform { 7 | // eslint-disable-next-line 8 | transform(value: any, ...args: any[]): any { 9 | return JSON.stringify(value, null, 2) 10 | .replace(/ /g, ' ') 11 | .replace(/\n/g, '
'); 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/08-form-builder/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-forms/08-form-builder/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/08-form-builder/pretty-json.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'prettyjson' 5 | }) 6 | export class PrettyJsonPipe implements PipeTransform { 7 | // eslint-disable-next-line 8 | transform(value: any, ...args: any[]): any { 9 | return JSON.stringify(value, null, 2) 10 | .replace(/ /g, ' ') 11 | .replace(/\n/g, '
'); 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/09-form-builder-nested/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-forms/09-form-builder-nested/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/09-form-builder-nested/movie.ts: -------------------------------------------------------------------------------- 1 | export class Movie { 2 | name: string; 3 | releaseDate: string; 4 | 5 | constructor() { 6 | this.name = ''; 7 | this.releaseDate = ''; 8 | } 9 | 10 | } -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/09-form-builder-nested/pretty-json.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'prettyjson' 5 | }) 6 | export class PrettyJsonPipe implements PipeTransform { 7 | // eslint-disable-next-line 8 | transform(value: any, ...args: any[]): any { 9 | return JSON.stringify(value, null, 2) 10 | .replace(/ /g, ' ') 11 | .replace(/\n/g, '
'); 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/10-form-array/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-forms/10-form-array/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/10-form-array/movie.ts: -------------------------------------------------------------------------------- 1 | export class Movie { 2 | name: string; 3 | releaseDate: string; 4 | 5 | constructor() { 6 | this.name = ''; 7 | this.releaseDate = ''; 8 | } 9 | 10 | } -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/10-form-array/pretty-json.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'prettyjson' 5 | }) 6 | export class PrettyJsonPipe implements PipeTransform { 7 | // eslint-disable-next-line 8 | transform(value: any, ...args: any[]): any { 9 | return JSON.stringify(value, null, 2) 10 | .replace(/ /g, ' ') 11 | .replace(/\n/g, '
'); 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/11-form-multi/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-forms/11-form-multi/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/11-form-multi/movie.ts: -------------------------------------------------------------------------------- 1 | export class Movie { 2 | name: string; 3 | releaseDate: string; 4 | 5 | constructor() { 6 | this.name = ''; 7 | this.releaseDate = ''; 8 | } 9 | 10 | } -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/11-form-multi/pretty-json.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'prettyjson' 5 | }) 6 | export class PrettyJsonPipe implements PipeTransform { 7 | // eslint-disable-next-line 8 | transform(value: any, ...args: any[]): any { 9 | return JSON.stringify(value, null, 2) 10 | .replace(/ /g, ' ') 11 | .replace(/\n/g, '
'); 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/tutorial.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink, RouterOutlet } from '@angular/router'; 4 | 5 | @Component({ 6 | selector: 'app-example-forms', 7 | imports: [CommonModule, RouterLink, RouterOutlet], 8 | templateUrl: './tutorial.component.html', 9 | styleUrls: ['./tutorial.component.css'] 10 | }) 11 | export class TutorialComponent { 12 | } 13 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/tutorial.config.ts: -------------------------------------------------------------------------------- 1 | import { ApplicationConfig } from '@angular/core'; 2 | import { provideRouter } from '@angular/router'; 3 | 4 | import { routes } from './tutorial.routes'; 5 | 6 | export const tutorialConfig: ApplicationConfig = { 7 | providers: [provideRouter(routes)] 8 | }; 9 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-forms/tutorial.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | 4 | import { TutorialRoutingModule } from './tutorial-routing.module'; 5 | import { TutorialComponent } from './tutorial.component'; 6 | import { HttpClientModule } from '@angular/common/http'; 7 | 8 | @NgModule({ 9 | declarations: [ 10 | TutorialComponent, 11 | ], 12 | imports: [ 13 | CommonModule, 14 | TutorialRoutingModule, 15 | HttpClientModule, 16 | ], 17 | exports: [ 18 | TutorialComponent, 19 | ], 20 | }) 21 | export class TutorialModule { } 22 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-items/items.component.css: -------------------------------------------------------------------------------- 1 | .httpclient-table { 2 | border-radius: 10px; 3 | } 4 | 5 | .httpclient-table table { 6 | color: #FFFFFF; 7 | } 8 | 9 | .httpclient-table.blue-gradient { 10 | background: linear-gradient(40deg, #45cafc, #5664bd) !important 11 | } -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-items/services/items.service.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed } from '@angular/core/testing'; 2 | import { HttpClient } from '@angular/common/http'; 3 | import { ItemsService } from './items.service'; 4 | 5 | describe('ItemsService', () => { 6 | let service: ItemsService; 7 | 8 | beforeEach(() => { 9 | TestBed.configureTestingModule({ 10 | providers: [ 11 | ItemsService, 12 | { provide: HttpClient, useValue: {} } 13 | ] 14 | }); 15 | service = TestBed.inject(ItemsService); 16 | }); 17 | 18 | it('should be created', () => { 19 | expect(service).toBeTruthy(); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-items/services/items.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { HttpClient, HttpHeaders } from '@angular/common/http'; 3 | import { Observable } from 'rxjs'; 4 | 5 | const httpOptions = { 6 | headers: new HttpHeaders( 7 | { 8 | 'Content-Type': 'application/json', 9 | } 10 | ) 11 | }; 12 | 13 | @Injectable({ 14 | providedIn: 'root' 15 | }) 16 | export class ItemsService { 17 | 18 | constructor(private http: HttpClient) { } 19 | 20 | getItems(url: string): Observable { 21 | return this.http.get(url, httpOptions); 22 | } 23 | 24 | } -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-services/safe.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser'; 3 | 4 | @Pipe({ name: 'safe' }) 5 | export class SafePipe implements PipeTransform { 6 | constructor(private sanitizer: DomSanitizer) { } 7 | // eslint-disable-next-line 8 | transform(url: any): SafeResourceUrl { 9 | return this.sanitizer.bypassSecurityTrustResourceUrl(url); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-services/song/song.service.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed } from '@angular/core/testing'; 2 | 3 | import { SongService } from './song.service'; 4 | 5 | describe('SongService', () => { 6 | let service: SongService; 7 | 8 | beforeEach(() => { 9 | TestBed.configureTestingModule({}); 10 | service = TestBed.inject(SongService); 11 | }); 12 | 13 | it('should be created', () => { 14 | expect(service).toBeTruthy(); 15 | }); 16 | }); 17 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-services/song/song.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | 3 | import { Song } from './song'; 4 | import { SONGS } from './mock-songs'; 5 | 6 | @Injectable({ 7 | providedIn: 'root' 8 | }) 9 | export class SongService { 10 | 11 | song: Song[]; 12 | constructor() { 13 | this.song = []; 14 | } 15 | 16 | getSongs(year: number): Song[] { 17 | this.song = SONGS[year - 1].items; 18 | 19 | return this.song; 20 | } 21 | 22 | } 23 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-services/song/song.ts: -------------------------------------------------------------------------------- 1 | export class Song { 2 | 3 | link: string; 4 | top: string; 5 | artist: string; 6 | title: string; 7 | 8 | constructor() { 9 | this.link = ''; 10 | this.top = ''; 11 | this.artist = ''; 12 | this.title = ''; 13 | 14 | } 15 | 16 | } 17 | -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-services/tutorial.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/app/features/tutorials/example-services/tutorial.component.css -------------------------------------------------------------------------------- /frontend-angular-19/src/app/features/tutorials/example-services/tutorial.config.ts: -------------------------------------------------------------------------------- 1 | import { ApplicationConfig } from '@angular/core'; 2 | import { provideRouter } from '@angular/router'; 3 | 4 | import { routes } from './tutorial.routes'; 5 | 6 | export const tutorialConfig: ApplicationConfig = { 7 | providers: [provideRouter(routes)] 8 | }; 9 | -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/.gitkeep -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/cinemax.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/cinemax.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/cw.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/cw.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/discovery-channel.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/discovery-channel.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/disney-channel.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/disney-channel.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/fox.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/fox.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/hbo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/hbo.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/history.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/history.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/hulu.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/hulu.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/mtv.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/mtv.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/nbc.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/nbc.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/netflix.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/netflix.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/showtime.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/showtime.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/channels/usa-network.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/channels/usa-network.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/example-bootstrap/movie-screen.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/example-bootstrap/movie-screen.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/logo/ganatan-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/logo/ganatan-logo.png -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/logo/ganatan-logo@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/logo/ganatan-logo@2x.png -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/studio/2560px-Valve_old_logo.svg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/studio/2560px-Valve_old_logo.svg.png -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/studio/Bioware-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/studio/Bioware-logo.png -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/studio/Electronic_Arts-Logo.wine.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/studio/Electronic_Arts-Logo.wine.png -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/studio/Logo-Nintendo-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/studio/Logo-Nintendo-1.jpg -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/studio/Naughty-dog-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/studio/Naughty-dog-logo.png -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/images/studio/Rockstar_Games_Logo.svg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/src/assets/params/images/studio/Rockstar_Games_Logo.svg.png -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/js/popovers.js: -------------------------------------------------------------------------------- 1 | var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]')) 2 | var popoverList = popoverTriggerList.map(function (popoverTriggerEl) { 3 | return new bootstrap.Popover(popoverTriggerEl) 4 | }) 5 | -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/js/toasts.js: -------------------------------------------------------------------------------- 1 | var myToastEl = document.getElementById('myToast') 2 | myToastEl.classList.add("show"); 3 | -------------------------------------------------------------------------------- /frontend-angular-19/src/assets/params/js/tooltips.js: -------------------------------------------------------------------------------- 1 | /*var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-toggle="tooltip"]')) 2 | var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) { 3 | return new bootstrap.Tooltip(tooltipTriggerEl) 4 | })*/ 5 | 6 | var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]')) 7 | var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) { 8 | return new bootstrap.Tooltip(tooltipTriggerEl) 9 | }) 10 | 11 | -------------------------------------------------------------------------------- /frontend-angular-19/src/environments/environment.development.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | application: 3 | { 4 | name: 'angular-bootstrap', 5 | version: 'Angular 19.2.1', 6 | bootstrap: 'Bootstrap 5.3.3', 7 | fontawesome: 'Font Awesome 6.7.2', 8 | } 9 | }; -------------------------------------------------------------------------------- /frontend-angular-19/src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | application: 3 | { 4 | name: 'angular-bootstrap', 5 | version: 'Angular 19.2.1', 6 | bootstrap: 'Bootstrap 5.3.3', 7 | fontawesome: 'Font Awesome 6.7.2', 8 | } 9 | }; -------------------------------------------------------------------------------- /frontend-angular-19/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | AngularStarter 7 | 8 | 9 | 10 | 11 | 12 | 13 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /frontend-angular-19/src/main.server.ts: -------------------------------------------------------------------------------- 1 | import { bootstrapApplication } from '@angular/platform-browser'; 2 | import { AppComponent } from './app/app.component'; 3 | import { config } from './app/app.config.server'; 4 | 5 | const bootstrap = () => bootstrapApplication(AppComponent, config); 6 | 7 | export default bootstrap; 8 | -------------------------------------------------------------------------------- /frontend-angular-19/src/main.ts: -------------------------------------------------------------------------------- 1 | import { bootstrapApplication } from '@angular/platform-browser'; 2 | import { appConfig } from './app/app.config'; 3 | import { AppComponent } from './app/app.component'; 4 | 5 | bootstrapApplication(AppComponent, appConfig) 6 | .catch((err) => console.error(err)); 7 | -------------------------------------------------------------------------------- /frontend-angular-19/src/robots.txt: -------------------------------------------------------------------------------- 1 | User-agent: * 2 | Disallow: 3 | Sitemap: https://angular.ganatan.com/sitemap.xml -------------------------------------------------------------------------------- /frontend-angular-19/src/styles.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding-top: 3.5rem; 3 | font-family: "Roboto", sans-serif; 4 | } -------------------------------------------------------------------------------- /frontend-angular-19/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | /* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */ 2 | /* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */ 3 | { 4 | "extends": "./tsconfig.json", 5 | "compilerOptions": { 6 | "outDir": "./out-tsc/app", 7 | "types": [ 8 | "node" 9 | ] 10 | }, 11 | "files": [ 12 | "src/main.ts", 13 | "src/main.server.ts", 14 | "src/server.ts" 15 | ], 16 | "include": [ 17 | "src/**/*.d.ts" 18 | ] 19 | } 20 | -------------------------------------------------------------------------------- /frontend-angular-19/tsconfig.json: -------------------------------------------------------------------------------- 1 | /* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */ 2 | /* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */ 3 | { 4 | "compileOnSave": false, 5 | "compilerOptions": { 6 | "outDir": "./dist/out-tsc", 7 | "strict": true, 8 | "noImplicitOverride": true, 9 | "noPropertyAccessFromIndexSignature": true, 10 | "noImplicitReturns": true, 11 | "noFallthroughCasesInSwitch": true, 12 | "skipLibCheck": true, 13 | "isolatedModules": true, 14 | "esModuleInterop": true, 15 | "experimentalDecorators": true, 16 | "moduleResolution": "bundler", 17 | "importHelpers": true, 18 | "target": "ES2022", 19 | "module": "ES2022" 20 | }, 21 | "angularCompilerOptions": { 22 | "enableI18nLegacyMessageIdFormat": false, 23 | "strictInjectionParameters": true, 24 | "strictInputAccessModifiers": true, 25 | "strictTemplates": true 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /frontend-angular-19/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | /* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */ 2 | /* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */ 3 | { 4 | "extends": "./tsconfig.json", 5 | "compilerOptions": { 6 | "outDir": "./out-tsc/spec", 7 | "types": [ 8 | "jasmine" 9 | ] 10 | }, 11 | "include": [ 12 | "src/**/*.spec.ts", 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/css/regular.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | * Copyright 2023 Fonticons, Inc. 5 | */ 6 | :root, :host { 7 | --fa-style-family-classic: 'Font Awesome 6 Free'; 8 | --fa-font-regular: normal 400 1em/1 'Font Awesome 6 Free'; } 9 | 10 | @font-face { 11 | font-family: 'Font Awesome 6 Free'; 12 | font-style: normal; 13 | font-weight: 400; 14 | font-display: block; 15 | src: url("../webfonts/fa-regular-400.woff2") format("woff2"), url("../webfonts/fa-regular-400.ttf") format("truetype"); } 16 | 17 | .far, 18 | .fa-regular { 19 | font-weight: 400; } 20 | -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/css/regular.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | * Copyright 2023 Fonticons, Inc. 5 | */ 6 | :host,:root{--fa-style-family-classic:"Font Awesome 6 Free";--fa-font-regular:normal 400 1em/1 "Font Awesome 6 Free"}@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:400;font-display:block;src:url(../webfonts/fa-regular-400.woff2) format("woff2"),url(../webfonts/fa-regular-400.ttf) format("truetype")}.fa-regular,.far{font-weight:400} -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/css/solid.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | * Copyright 2023 Fonticons, Inc. 5 | */ 6 | :root, :host { 7 | --fa-style-family-classic: 'Font Awesome 6 Free'; 8 | --fa-font-solid: normal 900 1em/1 'Font Awesome 6 Free'; } 9 | 10 | @font-face { 11 | font-family: 'Font Awesome 6 Free'; 12 | font-style: normal; 13 | font-weight: 900; 14 | font-display: block; 15 | src: url("../webfonts/fa-solid-900.woff2") format("woff2"), url("../webfonts/fa-solid-900.ttf") format("truetype"); } 16 | 17 | .fas, 18 | .fa-solid { 19 | font-weight: 900; } 20 | -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/css/solid.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | * Copyright 2023 Fonticons, Inc. 5 | */ 6 | :host,:root{--fa-style-family-classic:"Font Awesome 6 Free";--fa-font-solid:normal 900 1em/1 "Font Awesome 6 Free"}@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:900;font-display:block;src:url(../webfonts/fa-solid-900.woff2) format("woff2"),url(../webfonts/fa-solid-900.ttf) format("truetype")}.fa-solid,.fas{font-weight:900} -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/css/v5-font-face.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | * Copyright 2023 Fonticons, Inc. 5 | */ 6 | @font-face { 7 | font-family: 'Font Awesome 5 Brands'; 8 | font-display: block; 9 | font-weight: 400; 10 | src: url("../webfonts/fa-brands-400.woff2") format("woff2"), url("../webfonts/fa-brands-400.ttf") format("truetype"); } 11 | 12 | @font-face { 13 | font-family: 'Font Awesome 5 Free'; 14 | font-display: block; 15 | font-weight: 900; 16 | src: url("../webfonts/fa-solid-900.woff2") format("woff2"), url("../webfonts/fa-solid-900.ttf") format("truetype"); } 17 | 18 | @font-face { 19 | font-family: 'Font Awesome 5 Free'; 20 | font-display: block; 21 | font-weight: 400; 22 | src: url("../webfonts/fa-regular-400.woff2") format("woff2"), url("../webfonts/fa-regular-400.ttf") format("truetype"); } 23 | -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/css/v5-font-face.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | * Copyright 2023 Fonticons, Inc. 5 | */ 6 | @font-face{font-family:"Font Awesome 5 Brands";font-display:block;font-weight:400;src:url(../webfonts/fa-brands-400.woff2) format("woff2"),url(../webfonts/fa-brands-400.ttf) format("truetype")}@font-face{font-family:"Font Awesome 5 Free";font-display:block;font-weight:900;src:url(../webfonts/fa-solid-900.woff2) format("woff2"),url(../webfonts/fa-solid-900.ttf) format("truetype")}@font-face{font-family:"Font Awesome 5 Free";font-display:block;font-weight:400;src:url(../webfonts/fa-regular-400.woff2) format("woff2"),url(../webfonts/fa-regular-400.ttf) format("truetype")} -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/webfonts/fa-brands-400.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/ui/assets/fontawesome/webfonts/fa-brands-400.ttf -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/webfonts/fa-brands-400.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/ui/assets/fontawesome/webfonts/fa-brands-400.woff2 -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/webfonts/fa-regular-400.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/ui/assets/fontawesome/webfonts/fa-regular-400.ttf -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/webfonts/fa-regular-400.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/ui/assets/fontawesome/webfonts/fa-regular-400.woff2 -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/webfonts/fa-solid-900.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/ui/assets/fontawesome/webfonts/fa-solid-900.ttf -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/webfonts/fa-solid-900.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/ui/assets/fontawesome/webfonts/fa-solid-900.woff2 -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/webfonts/fa-v4compatibility.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/ui/assets/fontawesome/webfonts/fa-v4compatibility.ttf -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/fontawesome/webfonts/fa-v4compatibility.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/ui/assets/fontawesome/webfonts/fa-v4compatibility.woff2 -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/params/css/body.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding-top: 3.5rem; 3 | font-family: "Roboto", sans-serif; 4 | } 5 | -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/params/css/footer.css: -------------------------------------------------------------------------------- 1 | .nga-footer { 2 | background-color: #212121; 3 | color: white; 4 | } 5 | 6 | .nga-footer a { 7 | color: white; 8 | text-decoration: none 9 | } 10 | 11 | .nga-footer a:hover, 12 | .nga-footer a:focus { 13 | color: yellow; 14 | text-decoration: underline; 15 | } 16 | 17 | .nga-footer .hint { 18 | background-color: #1976d2; 19 | } 20 | 21 | .nga-footer .hint:hover { 22 | opacity: 0.8; 23 | } 24 | -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/params/css/header.css: -------------------------------------------------------------------------------- 1 | .navbar.navbar-dark .navbar-nav .nav-item .nav-link { 2 | color: white; 3 | font-weight: 500; 4 | border-top: 1px solid #09238d; 5 | border-bottom: 1px solid #09238d; 6 | } 7 | 8 | .navbar.navbar-dark .navbar-nav .nav-item .nav-link:hover { 9 | color: yellow; 10 | border-top: 1px solid yellow; 11 | border-bottom: 1px solid yellow; 12 | } 13 | 14 | .nga-navbar { 15 | -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 11px 10px 0 rgba(0, 0, 0, 0.12); 16 | box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 11px 10px 0 rgba(0, 0, 0, 0.12); 17 | background-color: #09238d; 18 | } 19 | 20 | .nga-logo { 21 | font-weight: 700; 22 | } 23 | 24 | .nga-logo:hover { 25 | color: rgba(255, 255, 255, 0.75); 26 | } -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/params/images/logo/ganatan-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/ui/assets/params/images/logo/ganatan-logo.png -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/params/images/logo/ganatan-logo@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular-19/ui/assets/params/images/logo/ganatan-logo@2x.png -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/params/js/popovers.js: -------------------------------------------------------------------------------- 1 | var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-toggle="popover"]')) 2 | var popoverList = popoverTriggerList.map(function (popoverTriggerEl) { 3 | return new bootstrap.Popover(popoverTriggerEl) 4 | }) -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/params/js/toasts.js: -------------------------------------------------------------------------------- 1 | var myToastEl = document.getElementById('myToast') 2 | myToastEl.classList.add("show"); 3 | -------------------------------------------------------------------------------- /frontend-angular-19/ui/assets/params/js/tooltips.js: -------------------------------------------------------------------------------- 1 | var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-toggle="tooltip"]')) 2 | var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) { 3 | return new bootstrap.Tooltip(tooltipTriggerEl) 4 | }) 5 | -------------------------------------------------------------------------------- /frontend-angular/.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 | [*.ts] 12 | quote_type = single 13 | ij_typescript_use_double_quotes = false 14 | 15 | [*.md] 16 | max_line_length = off 17 | trim_trailing_whitespace = false 18 | -------------------------------------------------------------------------------- /frontend-angular/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://docs.github.com/get-started/getting-started-with-git/ignoring-files for more about ignoring files. 2 | 3 | # Compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | /bazel-out 8 | 9 | # Node 10 | /node_modules 11 | npm-debug.log 12 | yarn-error.log 13 | 14 | # IDEs and editors 15 | .idea/ 16 | .project 17 | .classpath 18 | .c9/ 19 | *.launch 20 | .settings/ 21 | *.sublime-workspace 22 | 23 | # Visual Studio Code 24 | .vscode/* 25 | !.vscode/settings.json 26 | !.vscode/tasks.json 27 | !.vscode/launch.json 28 | !.vscode/extensions.json 29 | .history/* 30 | 31 | # Miscellaneous 32 | /.angular/cache 33 | .sass-cache/ 34 | /connect.lock 35 | /coverage 36 | /libpeerconnection.log 37 | testem.log 38 | /typings 39 | 40 | # System files 41 | .DS_Store 42 | Thumbs.db 43 | -------------------------------------------------------------------------------- /frontend-angular/README.md: -------------------------------------------------------------------------------- 1 | ### Installation 2 | * `npm install` (installing dependencies) 3 | * `npm outdated` (verifying dependencies) 4 | 5 | ### Developpement 6 | * `npm run start` 7 | * in your browser [http://localhost:4200](http://localhost:4200) 8 | 9 | ## Linter 10 | * `npm run lint` 11 | 12 | ## Tests 13 | * `npm run test` 14 | * `npm run coverage` 15 | 16 | ### Compilation 17 | * `npm run build` ( without SSR) 18 | 19 | ### Production 20 | * `npm run serve` 21 | * in your browser [http://localhost:4000](http://localhost:4000) 22 | 23 | 24 | ### Author 25 | * Author : danny 26 | -------------------------------------------------------------------------------- /frontend-angular/nginx.conf: -------------------------------------------------------------------------------- 1 | user www-data; 2 | worker_processes auto; 3 | pid /run/nginx.pid; 4 | error_log /var/log/nginx/error.log; 5 | include /etc/nginx/modules-enabled/*.conf; 6 | 7 | events { 8 | worker_connections 768; 9 | } 10 | 11 | http { 12 | sendfile on; 13 | tcp_nopush on; 14 | types_hash_max_size 2048; 15 | 16 | include /etc/nginx/mime.types; 17 | default_type application/octet-stream; 18 | 19 | ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3; # Dropping SSLv3, ref: POODLE 20 | ssl_prefer_server_ciphers on; 21 | 22 | access_log /var/log/nginx/access.log; 23 | gzip on; 24 | include /etc/nginx/conf.d/*.conf; 25 | server { 26 | listen 80 default_server; 27 | listen [::]:80 default_server; 28 | 29 | root /var/www/html; 30 | index index.html index.htm index.nginx-debian.html; 31 | server_name _; 32 | location / { 33 | try_files $uri $uri/ =404; 34 | } 35 | 36 | } 37 | } -------------------------------------------------------------------------------- /frontend-angular/ngsw-config.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "./node_modules/@angular/service-worker/config/schema.json", 3 | "index": "/index.html", 4 | "assetGroups": [ 5 | { 6 | "name": "app", 7 | "installMode": "prefetch", 8 | "resources": { 9 | "files": [ 10 | "/favicon.ico", 11 | "/index.csr.html", 12 | "/index.html", 13 | "/manifest.webmanifest", 14 | "/*.css", 15 | "/*.js" 16 | ] 17 | } 18 | }, 19 | { 20 | "name": "assets", 21 | "installMode": "lazy", 22 | "updateMode": "prefetch", 23 | "resources": { 24 | "files": [ 25 | "/**/*.(svg|cur|jpg|jpeg|png|apng|webp|avif|gif|otf|ttf|woff|woff2)" 26 | ] 27 | } 28 | } 29 | ] 30 | } 31 | -------------------------------------------------------------------------------- /frontend-angular/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/public/favicon.ico -------------------------------------------------------------------------------- /frontend-angular/public/icons/icon-128x128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/public/icons/icon-128x128.png -------------------------------------------------------------------------------- /frontend-angular/public/icons/icon-144x144.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/public/icons/icon-144x144.png -------------------------------------------------------------------------------- /frontend-angular/public/icons/icon-152x152.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/public/icons/icon-152x152.png -------------------------------------------------------------------------------- /frontend-angular/public/icons/icon-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/public/icons/icon-192x192.png -------------------------------------------------------------------------------- /frontend-angular/public/icons/icon-384x384.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/public/icons/icon-384x384.png -------------------------------------------------------------------------------- /frontend-angular/public/icons/icon-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/public/icons/icon-512x512.png -------------------------------------------------------------------------------- /frontend-angular/public/icons/icon-72x72.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/public/icons/icon-72x72.png -------------------------------------------------------------------------------- /frontend-angular/public/icons/icon-96x96.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/public/icons/icon-96x96.png -------------------------------------------------------------------------------- /frontend-angular/src/app/app.config.server.ts: -------------------------------------------------------------------------------- 1 | import { mergeApplicationConfig, ApplicationConfig } from '@angular/core'; 2 | import { provideServerRendering, withRoutes } from '@angular/ssr'; 3 | import { appConfig } from './app.config'; 4 | import { serverRoutes } from './app.routes.server'; 5 | 6 | const serverConfig: ApplicationConfig = { 7 | providers: [ 8 | provideServerRendering(withRoutes(serverRoutes)) 9 | ] 10 | }; 11 | 12 | export const config = mergeApplicationConfig(appConfig, serverConfig); 13 | -------------------------------------------------------------------------------- /frontend-angular/src/app/app.config.ts: -------------------------------------------------------------------------------- 1 | import { ApplicationConfig, provideBrowserGlobalErrorListeners, provideZoneChangeDetection, isDevMode } from '@angular/core'; 2 | import { provideRouter } from '@angular/router'; 3 | 4 | import { routes } from './app.routes'; 5 | import { provideClientHydration, withEventReplay } from '@angular/platform-browser'; 6 | import { provideServiceWorker } from '@angular/service-worker'; 7 | 8 | import { provideHttpClient, withFetch } from '@angular/common/http'; 9 | 10 | export const appConfig: ApplicationConfig = { 11 | providers: [ 12 | provideHttpClient( 13 | withFetch(), 14 | ), 15 | provideBrowserGlobalErrorListeners(), 16 | provideZoneChangeDetection({ eventCoalescing: true }), 17 | provideRouter(routes), provideClientHydration(withEventReplay()), provideServiceWorker('ngsw-worker.js', { 18 | enabled: !isDevMode(), 19 | registrationStrategy: 'registerWhenStable:30000' 20 | }) 21 | ] 22 | }; 23 | -------------------------------------------------------------------------------- /frontend-angular/src/app/app.routes.server.ts: -------------------------------------------------------------------------------- 1 | import { RenderMode, ServerRoute } from '@angular/ssr'; 2 | 3 | export const serverRoutes: ServerRoute[] = [ 4 | { 5 | path: '**', 6 | renderMode: RenderMode.Prerender 7 | } 8 | ]; 9 | -------------------------------------------------------------------------------- /frontend-angular/src/app/app.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed } from '@angular/core/testing'; 2 | import { App } from './app'; 3 | import { ActivatedRoute } from '@angular/router'; 4 | 5 | describe('App', () => { 6 | beforeEach(async () => { 7 | await TestBed.configureTestingModule({ 8 | imports: [App], 9 | providers: [ 10 | { 11 | provide: ActivatedRoute, 12 | useValue: {} 13 | } 14 | ] 15 | }).compileComponents(); 16 | }); 17 | 18 | it('should create the app', () => { 19 | const fixture = TestBed.createComponent(App); 20 | const app = fixture.componentInstance; 21 | expect(app).toBeTruthy(); 22 | }); 23 | 24 | it('should render title', () => { 25 | const fixture = TestBed.createComponent(App); 26 | const app = fixture.componentInstance; 27 | expect(app.title).toEqual('angular-routing'); 28 | }); 29 | }); 30 | -------------------------------------------------------------------------------- /frontend-angular/src/app/app.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink, RouterOutlet } from '@angular/router'; 4 | 5 | @Component({ 6 | selector: 'app-root', 7 | imports: [CommonModule, RouterLink, RouterOutlet], 8 | templateUrl: './app.html', 9 | styleUrl: './app.css' 10 | }) 11 | export class App implements OnInit { 12 | title = 'angular-routing'; 13 | footerUrl = 'https://www.ganatan.com'; 14 | footerLink = 'www.ganatan.com'; 15 | ngOnInit(): void { 16 | 17 | const navMain = document.getElementById('navbarCollapse'); 18 | if (navMain) { 19 | navMain.onclick = function onClick() { 20 | if (navMain) { 21 | navMain.classList.remove("show"); 22 | } 23 | } 24 | } 25 | } 26 | } -------------------------------------------------------------------------------- /frontend-angular/src/app/core/services/seo/seo.service.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed } from '@angular/core/testing'; 2 | 3 | import { SeoService } from './seo.service'; 4 | 5 | describe('SeoService', () => { 6 | let service: SeoService; 7 | 8 | beforeEach(() => { 9 | TestBed.configureTestingModule({}); 10 | service = TestBed.inject(SeoService); 11 | }); 12 | 13 | it('should be created', () => { 14 | expect(service).toBeTruthy(); 15 | }); 16 | }); 17 | -------------------------------------------------------------------------------- /frontend-angular/src/app/core/services/seo/seo.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { Meta, Title } from '@angular/platform-browser'; 3 | 4 | @Injectable({ 5 | providedIn: 'root' 6 | }) 7 | export class SeoService { 8 | 9 | constructor( 10 | private meta: Meta, 11 | private titleService: Title) { 12 | 13 | } 14 | 15 | public setMetaDescription(content: string) { 16 | 17 | this.meta.updateTag( 18 | { 19 | name: 'description', 20 | content: content 21 | }); 22 | } 23 | 24 | public setMetaTitle(title:string) { 25 | 26 | this.titleService.setTitle(title); 27 | 28 | } 29 | 30 | } 31 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/about.config.ts: -------------------------------------------------------------------------------- 1 | import { ApplicationConfig } from '@angular/core'; 2 | import { provideRouter } from '@angular/router'; 3 | 4 | import { routes } from './about.routes'; 5 | 6 | export const aboutConfig: ApplicationConfig = { 7 | providers: [provideRouter(routes)] 8 | }; 9 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/about.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/about/about.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/about.html: -------------------------------------------------------------------------------- 1 |
2 |

about works!

3 | 7 |

Child Routes Result

8 | 9 |
-------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/about.routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { About } from './about'; 4 | 5 | export const routes: Routes = [ 6 | { 7 | path: '', component: About, children: [ 8 | { 9 | path: '', 10 | loadComponent: () => import(`./experience/experience`) 11 | .then(mod => mod.Experience) 12 | }, 13 | { 14 | path: 'experience', 15 | loadComponent: () => import(`./experience/experience`) 16 | .then(mod => mod.Experience) 17 | }, 18 | { 19 | path: 'skill', 20 | loadComponent: () => import(`./skill/skill`) 21 | .then(mod => mod.Skill) 22 | }, 23 | 24 | { 25 | path: '**', 26 | loadComponent: () => import(`./experience/experience`) 27 | .then(mod => mod.Experience) 28 | }, 29 | 30 | ] 31 | }, 32 | ]; -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/about.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { About } from './about'; 4 | import { ActivatedRoute } from '@angular/router'; 5 | 6 | describe('About', () => { 7 | let component: About; 8 | let fixture: ComponentFixture; 9 | 10 | beforeEach(async () => { 11 | await TestBed.configureTestingModule({ 12 | imports: [About], 13 | providers: [ 14 | { 15 | provide: ActivatedRoute, 16 | useValue: {} 17 | } 18 | ] 19 | }).compileComponents(); 20 | 21 | fixture = TestBed.createComponent(About); 22 | component = fixture.componentInstance; 23 | fixture.detectChanges(); 24 | }); 25 | 26 | it('should create', () => { 27 | expect(component).toBeTruthy(); 28 | }); 29 | }); 30 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/about.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink, RouterOutlet } from '@angular/router'; 4 | 5 | @Component({ 6 | selector: 'app-about', 7 | imports: [CommonModule, RouterLink, RouterOutlet], 8 | templateUrl: './about.html', 9 | styleUrl: './about.css' 10 | }) 11 | export class About { 12 | 13 | } -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/experience/experience.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/about/experience/experience.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/experience/experience.html: -------------------------------------------------------------------------------- 1 |

experience works!

2 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/experience/experience.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { Experience } from './experience'; 4 | 5 | describe('Experience', () => { 6 | let component: Experience; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [Experience] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(Experience); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/experience/experience.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-experience', 5 | imports: [], 6 | templateUrl: './experience.html', 7 | styleUrl: './experience.css' 8 | }) 9 | export class Experience { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/skill/skill.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/about/skill/skill.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/skill/skill.html: -------------------------------------------------------------------------------- 1 |

skill works!

2 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/skill/skill.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { Skill } from './skill'; 4 | 5 | describe('Skill', () => { 6 | let component: Skill; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [Skill] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(Skill); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/about/skill/skill.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-skill', 5 | imports: [], 6 | templateUrl: './skill.html', 7 | styleUrl: './skill.css' 8 | }) 9 | export class Skill { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/contact.config.ts: -------------------------------------------------------------------------------- 1 | import { ApplicationConfig } from '@angular/core'; 2 | import { provideRouter } from '@angular/router'; 3 | 4 | import { routes } from './contact.routes'; 5 | 6 | export const contactConfig: ApplicationConfig = { 7 | providers: [provideRouter(routes)] 8 | }; 9 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/contact.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/contact/contact.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/contact.html: -------------------------------------------------------------------------------- 1 |
2 |

contact works!

3 | 8 |

Child Routes Result

9 | 10 |
-------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/contact.routes.ts: -------------------------------------------------------------------------------- 1 | import { Routes } from '@angular/router'; 2 | 3 | import { Contact } from './contact'; 4 | 5 | export const routes: Routes = [ 6 | { 7 | path: '', component: Contact, children: [ 8 | { 9 | path: '', 10 | loadComponent: () => import(`./mailing/mailing`) 11 | .then(mod => mod.Mailing) 12 | }, 13 | { 14 | path: 'mapping', 15 | loadComponent: () => import(`./mapping/mapping`) 16 | .then(mod => mod.Mapping) 17 | }, 18 | { 19 | path: 'website', 20 | loadComponent: () => import(`./website/website`) 21 | .then(mod => mod.Website) 22 | }, 23 | 24 | { 25 | path: '**', 26 | loadComponent: () => import(`./mailing/mailing`) 27 | .then(mod => mod.Mailing) 28 | }, 29 | 30 | ] 31 | }, 32 | ]; -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/contact.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { Contact } from './contact'; 4 | import { ActivatedRoute } from '@angular/router'; 5 | 6 | describe('Contact', () => { 7 | let component: Contact; 8 | let fixture: ComponentFixture; 9 | 10 | beforeEach(async () => { 11 | await TestBed.configureTestingModule({ 12 | imports: [Contact], 13 | providers: [ 14 | { 15 | provide: ActivatedRoute, 16 | useValue: {} 17 | } 18 | ] 19 | }) 20 | .compileComponents(); 21 | 22 | fixture = TestBed.createComponent(Contact); 23 | component = fixture.componentInstance; 24 | fixture.detectChanges(); 25 | }); 26 | 27 | it('should create', () => { 28 | expect(component).toBeTruthy(); 29 | }); 30 | }); 31 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/contact.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink, RouterOutlet } from '@angular/router'; 4 | 5 | 6 | @Component({ 7 | selector: 'app-contact', 8 | imports: [CommonModule, RouterLink, RouterOutlet], 9 | templateUrl: './contact.html', 10 | styleUrl: './contact.css' 11 | }) 12 | export class Contact { 13 | 14 | } -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/mailing/mailing.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/contact/mailing/mailing.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/mailing/mailing.html: -------------------------------------------------------------------------------- 1 |

mailing works!

2 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/mailing/mailing.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { Mailing } from './mailing'; 4 | 5 | describe('Mailing', () => { 6 | let component: Mailing; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [Mailing] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(Mailing); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/mailing/mailing.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-mailing', 5 | imports: [], 6 | templateUrl: './mailing.html', 7 | styleUrl: './mailing.css' 8 | }) 9 | export class Mailing { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/mapping/mapping.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/contact/mapping/mapping.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/mapping/mapping.html: -------------------------------------------------------------------------------- 1 |

mapping works!

2 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/mapping/mapping.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { Mapping } from './mapping'; 4 | 5 | describe('Mapping', () => { 6 | let component: Mapping; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [Mapping] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(Mapping); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/mapping/mapping.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-mapping', 5 | imports: [], 6 | templateUrl: './mapping.html', 7 | styleUrl: './mapping.css' 8 | }) 9 | export class Mapping { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/website/website.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/contact/website/website.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/website/website.html: -------------------------------------------------------------------------------- 1 |

website works!

2 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/website/website.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { Website } from './website'; 4 | 5 | describe('Website', () => { 6 | let component: Website; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [Website] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(Website); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/contact/website/website.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-website', 5 | imports: [], 6 | templateUrl: './website.html', 7 | styleUrl: './website.css' 8 | }) 9 | export class Website { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/home/feature.ts: -------------------------------------------------------------------------------- 1 | export class Feature { 2 | 3 | name: string; 4 | description: string; 5 | icon: string; 6 | link: string; 7 | 8 | constructor() { 9 | this.name = ''; 10 | this.description = ''; 11 | this.icon = ''; 12 | this.link = ''; 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/home/home.css: -------------------------------------------------------------------------------- 1 | .nga-card { 2 | display: block; 3 | background-color: rgba(255, 255, 255, .8); 4 | box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24); 5 | border-radius: 2px; 6 | transition: all .2s ease-in-out; 7 | cursor: pointer; 8 | } 9 | 10 | .nga-card:hover { 11 | transform: translateY(-3px); 12 | box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23); 13 | } 14 | 15 | .nga-card a { 16 | color: black; 17 | text-decoration: none; 18 | } 19 | 20 | .nga-card a:hover { 21 | color: #0d6efd; 22 | text-decoration: none; 23 | } 24 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/home/home.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { Home } from './home'; 4 | import { ActivatedRoute } from '@angular/router'; 5 | 6 | describe('Home', () => { 7 | let component: Home; 8 | let fixture: ComponentFixture; 9 | 10 | beforeEach(async () => { 11 | await TestBed.configureTestingModule({ 12 | imports: [Home], 13 | providers: [ 14 | { 15 | provide: ActivatedRoute, 16 | useValue: {} 17 | } 18 | ] 19 | }) 20 | .compileComponents(); 21 | 22 | fixture = TestBed.createComponent(Home); 23 | component = fixture.componentInstance; 24 | fixture.detectChanges(); 25 | }); 26 | 27 | it('should create', () => { 28 | expect(component).toBeTruthy(); 29 | }); 30 | }); 31 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/login/login.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/login/login.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/login/login.html: -------------------------------------------------------------------------------- 1 |

login works!

2 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/login/login.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { Login } from './login'; 4 | 5 | describe('Login', () => { 6 | let component: Login; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [Login] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(Login); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/login/login.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-login', 5 | imports: [], 6 | templateUrl: './login.html', 7 | styleUrl: './login.css' 8 | }) 9 | export class Login { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/not-found/not-found.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/not-found/not-found.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/not-found/not-found.html: -------------------------------------------------------------------------------- 1 |

not-found works!

2 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/not-found/not-found.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { NotFound } from './not-found'; 4 | 5 | describe('NotFound', () => { 6 | let component: NotFound; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [NotFound] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(NotFound); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/not-found/not-found.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-not-found', 5 | imports: [], 6 | templateUrl: './not-found.html', 7 | styleUrl: './not-found.css' 8 | }) 9 | export class NotFound { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/signup/signup.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/signup/signup.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/signup/signup.html: -------------------------------------------------------------------------------- 1 |

signup works!

2 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/signup/signup.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { Signup } from './signup'; 4 | 5 | describe('Signup', () => { 6 | let component: Signup; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [Signup] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(Signup); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/signup/signup.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-signup', 5 | imports: [], 6 | templateUrl: './signup.html', 7 | styleUrl: './signup.css' 8 | }) 9 | export class Signup { 10 | 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/00-main/items.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Bootstrap Features

4 |
5 |
6 | 7 |
8 |
9 |
10 | 11 |
12 |
13 |
14 |
15 |
{{ item.name }}
16 |
17 |
18 | 19 |
20 |
21 |
22 |
23 | 24 |
25 |
26 |
-------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/00-main/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink } from '@angular/router'; 4 | import { ITEMS } from './items'; 5 | 6 | @Component({ 7 | selector: 'app-00-main', 8 | imports: [CommonModule, RouterLink], 9 | templateUrl: './items.component.html', 10 | styleUrls: ['./items.component.css'] 11 | }) 12 | export class ItemsComponent { 13 | items = ITEMS; 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/accordions/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/accordions/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/accordions/items.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ItemsComponent } from './items.component'; 4 | 5 | describe('AccordionsComponent', () => { 6 | let component: ItemsComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | imports: [ItemsComponent] 12 | }) 13 | .compileComponents(); 14 | 15 | fixture = TestBed.createComponent(ItemsComponent); 16 | component = fixture.componentInstance; 17 | fixture.detectChanges(); 18 | }); 19 | 20 | it('should create', () => { 21 | expect(component).toBeTruthy(); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/accordions/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-accordions', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/alerts/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/alerts/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/alerts/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-alerts', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/badges/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/badges/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/badges/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-badge', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/blockquotes/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/blockquotes/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/blockquotes/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-blockquotes', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/breadcrumb/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/breadcrumb/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/breadcrumb/items.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Breadcrumb

4 | 9 | 15 | 22 |
23 |
24 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/breadcrumb/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-breadcrumb', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/buttons/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/buttons/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/buttons/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-buttons', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/cards/items.component.css: -------------------------------------------------------------------------------- 1 | .nga-card { 2 | -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); 3 | box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12) 4 | } 5 | 6 | .nga-card-box { 7 | display: block; 8 | background-color: rgba(255, 255, 255, .8); 9 | box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24); 10 | border-radius: 2px; 11 | transition: all .2s ease-in-out; 12 | cursor: pointer; 13 | } 14 | 15 | .nga-card-box:hover { 16 | box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23); 17 | } -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/cards/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-alerts', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/checkbox/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/checkbox/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/checkbox/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-collapse', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/collapses/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/collapses/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/collapses/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | // eslint-disable-next-line 4 | declare const bootstrap: any; 5 | 6 | @Component({ 7 | selector: 'app-collapse', 8 | templateUrl: './items.component.html', 9 | styleUrls: ['./items.component.css'] 10 | }) 11 | export class ItemsComponent { 12 | 13 | closeCollapse() { 14 | const myCollapse = document.getElementById('collapseWidthJavascript') 15 | new bootstrap.Collapse(myCollapse, { 16 | hide: true, 17 | }) 18 | } 19 | 20 | showCollapse() { 21 | const myCollapse = document.getElementById('collapseWidthJavascript') 22 | new bootstrap.Collapse(myCollapse, { 23 | show: true, 24 | }) 25 | } 26 | 27 | toggleCollapse() { 28 | const myCollapse = document.getElementById('collapseWidthJavascript') 29 | new bootstrap.Collapse(myCollapse, { 30 | toggle: true, 31 | }) 32 | } 33 | 34 | } 35 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/dropdowns/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/dropdowns/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/dropdowns/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-dropdowns', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/forms/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/forms/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/forms/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-forms', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/list-group/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/list-group/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/list-group/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-list-group', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/pagination/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/pagination/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/pagination/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-pagination', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/progress/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/progress/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/progress/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-progress', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/spinners/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/spinners/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/spinners/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-spinners', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/tables/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/tables/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/tables/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-pagination', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/tutorial.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { TutorialComponent } from './tutorial.component'; 4 | import { ActivatedRoute } from '@angular/router'; 5 | 6 | describe('TutorialComponent', () => { 7 | let component: TutorialComponent; 8 | let fixture: ComponentFixture; 9 | 10 | beforeEach(async () => { 11 | await TestBed.configureTestingModule({ 12 | imports: [TutorialComponent], 13 | providers: [ 14 | { 15 | provide: ActivatedRoute, 16 | useValue: {} 17 | } 18 | ] 19 | }) 20 | .compileComponents(); 21 | 22 | fixture = TestBed.createComponent(TutorialComponent); 23 | component = fixture.componentInstance; 24 | fixture.detectChanges(); 25 | }); 26 | 27 | it('should create', () => { 28 | expect(component).toBeTruthy(); 29 | }); 30 | }); 31 | 32 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/tutorial.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink, RouterOutlet } from '@angular/router'; 4 | 5 | @Component({ 6 | selector: 'app-example-bootstrap', 7 | imports: [CommonModule, RouterLink, RouterOutlet], 8 | templateUrl: './tutorial.component.html', 9 | styleUrls: ['./tutorial.component.css'] 10 | }) 11 | export class TutorialComponent { 12 | 13 | } 14 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/tutorial.config.ts: -------------------------------------------------------------------------------- 1 | import { ApplicationConfig } from '@angular/core'; 2 | import { provideRouter } from '@angular/router'; 3 | 4 | import { routes } from './tutorial.routes'; 5 | 6 | export const tutorialConfig: ApplicationConfig = { 7 | providers: [provideRouter(routes)] 8 | }; 9 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/typography/items.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-bootstrap/typography/items.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-bootstrap/typography/items.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-collapse', 5 | templateUrl: './items.component.html', 6 | styleUrls: ['./items.component.css'] 7 | }) 8 | export class ItemsComponent { 9 | 10 | } 11 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-components/channel/channel.component.css: -------------------------------------------------------------------------------- 1 | .nga-card-component { 2 | position: relative; 3 | display: flex; 4 | flex-direction: column; 5 | min-width: 0; 6 | word-wrap: break-word; 7 | background-color: #fff; 8 | background-clip: border-box; 9 | cursor: pointer; 10 | -webkit-box-shadow: 0 0px 1px 0 rgba(0, 0, 0, 0.16), 0 0px 5px 0 rgba(0, 0, 0, 0.12); 11 | box-shadow: 0 0px 1px 0 rgba(0, 0, 0, 0.16), 0 0px 5px 0 rgba(0, 0, 0, 0.12); 12 | } 13 | 14 | .nga-card-component:hover { 15 | -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); 16 | box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); 17 | } 18 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-components/channel/channel.component.html: -------------------------------------------------------------------------------- 1 |
2 | {{channel.name }} 3 |
4 |

{{ channel.releaseDate }}

5 | 6 |
7 |
-------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-components/channel/channel.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, EventEmitter, Output, Input } from '@angular/core'; 2 | 3 | import { Channel } from './channel'; 4 | 5 | @Component({ 6 | selector: 'app-channel', 7 | templateUrl: './channel.component.html', 8 | styleUrls: ['./channel.component.css'] 9 | }) 10 | export class ChannelComponent { 11 | 12 | @Input() channel: Channel; 13 | @Input() index: number; 14 | @Output() selected: EventEmitter = new EventEmitter(); 15 | 16 | constructor() { 17 | this.channel = new Channel(); 18 | this.index = 0; 19 | } 20 | 21 | select(channel: Channel): void { 22 | this.selected.emit(channel); 23 | } 24 | 25 | } 26 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-components/channel/channel.ts: -------------------------------------------------------------------------------- 1 | export class Channel { 2 | 3 | title: string; 4 | name: string; 5 | releaseDate: string; 6 | 7 | constructor() { 8 | this.title = ''; 9 | this.name = ''; 10 | this.releaseDate = ''; 11 | } 12 | 13 | } 14 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-components/tutorial.component.css: -------------------------------------------------------------------------------- 1 | .nga-card-component { 2 | position: relative; 3 | display: flex; 4 | flex-direction: column; 5 | min-width: 0; 6 | word-wrap: break-word; 7 | background-color: #fff; 8 | background-clip: border-box; 9 | cursor: pointer; 10 | -webkit-box-shadow: 0 0px 1px 0 rgba(0, 0, 0, 0.16), 0 0px 5px 0 rgba(0, 0, 0, 0.12); 11 | box-shadow: 0 0px 1px 0 rgba(0, 0, 0, 0.16), 0 0px 5px 0 rgba(0, 0, 0, 0.12); 12 | } 13 | 14 | .nga-card-component:hover { 15 | -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); 16 | box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); 17 | } 18 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/00-main/exercice.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Forms Features  

4 |
5 |
6 | 7 |
8 |
9 |
10 | 11 |
12 |
13 |
14 |
15 |
{{ item.name }}
16 |
17 |
18 | 19 |
20 |
21 |
22 |
23 | 24 |
25 |
26 |
-------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/00-main/exercice.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink } from '@angular/router'; 4 | import { ITEMS } from './items'; 5 | 6 | @Component({ 7 | selector: 'app-prototype', 8 | imports: [CommonModule, RouterLink], 9 | templateUrl: './exercice.component.html', 10 | styleUrls: ['./exercice.component.css'] 11 | }) 12 | export class ExerciceComponent { 13 | items = ITEMS; 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/01-single/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-forms/01-single/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/01-single/exercice.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { FormsModule } from '@angular/forms'; 3 | 4 | @Component({ 5 | selector: 'app-exercice', 6 | imports: [FormsModule], 7 | templateUrl: './exercice.component.html', 8 | styleUrls: ['./exercice.component.css'] 9 | }) 10 | export class ExerciceComponent { 11 | 12 | firstName = 'Paul'; 13 | lastName = 'Atreides'; 14 | 15 | } 16 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/02-multi/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-forms/02-multi/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/02-multi/exercice.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { Movie } from './movie'; 3 | import { CommonModule } from '@angular/common'; 4 | import { FormsModule } from '@angular/forms'; 5 | 6 | @Component({ 7 | selector: 'app-exercice', 8 | imports: [CommonModule, FormsModule], 9 | templateUrl: './exercice.component.html', 10 | styleUrls: ['./exercice.component.css'] 11 | }) 12 | export class ExerciceComponent { 13 | 14 | country: string; 15 | actor: string; 16 | movie: Movie = new Movie(); 17 | movieAny = { name: '' }; 18 | 19 | constructor() { 20 | this.country = 'United States'; 21 | this.actor = 'Tom Cruise'; 22 | this.movie.name = 'Edge of Tomorrow'; 23 | this.movieAny = { name: 'Avatar' }; 24 | } 25 | 26 | } 27 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/02-multi/movie.spec.ts: -------------------------------------------------------------------------------- 1 | import { Movie } from './movie'; 2 | 3 | describe('Movie', () => { 4 | it('should create an instance', () => { 5 | expect(new Movie()).toBeTruthy(); 6 | }); 7 | }); 8 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/02-multi/movie.ts: -------------------------------------------------------------------------------- 1 | export class Movie { 2 | 3 | name: string; 4 | releaseDate: string; 5 | domestic: string; 6 | international: string; 7 | worldwide: string; 8 | franchise: boolean; 9 | 10 | constructor() { 11 | this.name = ''; 12 | this.releaseDate = ''; 13 | this.domestic = ''; 14 | this.international = ''; 15 | this.worldwide = ''; 16 | this.franchise = false; 17 | } 18 | 19 | } 20 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/03-init-class/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-forms/03-init-class/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/03-init-class/exercice.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { Movie } from './movie'; 3 | import { CommonModule } from '@angular/common'; 4 | import { FormsModule } from '@angular/forms'; 5 | 6 | @Component({ 7 | selector: 'app-exercice', 8 | imports: [CommonModule, FormsModule], 9 | templateUrl: './exercice.component.html', 10 | styleUrls: ['./exercice.component.css'] 11 | }) 12 | export class ExerciceComponent { 13 | 14 | movie: Movie = new Movie(); 15 | 16 | constructor() { 17 | this.movie.name = 'Avengers : Endgame'; 18 | this.movie.releaseDate = '04/04/2019'; 19 | this.movie.domestic = '$858,373,000'; 20 | this.movie.international = '$2,797,800,564'; 21 | this.movie.worldwide = '$2,797,800,564'; 22 | this.movie.franchise = true; 23 | } 24 | 25 | } 26 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/03-init-class/movie.spec.ts: -------------------------------------------------------------------------------- 1 | import { Movie } from './movie'; 2 | 3 | describe('Movie', () => { 4 | it('should create an instance', () => { 5 | expect(new Movie()).toBeTruthy(); 6 | }); 7 | }); 8 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/03-init-class/movie.ts: -------------------------------------------------------------------------------- 1 | export class Movie { 2 | 3 | name: string; 4 | releaseDate: string; 5 | domestic: string; 6 | international: string; 7 | worldwide: string; 8 | franchise: boolean; 9 | 10 | constructor() { 11 | this.name = ''; 12 | this.releaseDate = ''; 13 | this.domestic = ''; 14 | this.international = ''; 15 | this.worldwide = ''; 16 | this.franchise = false; 17 | } 18 | 19 | } 20 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/04-prototype/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-forms/04-prototype/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/04-prototype/exercice.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { FormsModule } from '@angular/forms'; 4 | 5 | @Component({ 6 | selector: 'app-prototype', 7 | imports: [CommonModule, FormsModule], 8 | templateUrl: './exercice.component.html', 9 | styleUrls: ['./exercice.component.css'] 10 | }) 11 | export class ExerciceComponent {} 12 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/05-form-control/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-forms/05-form-control/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/06-form-control-class/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-forms/06-form-control-class/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/06-form-control-class/movie.ts: -------------------------------------------------------------------------------- 1 | export class Movie { 2 | 3 | name: string; 4 | releaseDate: string; 5 | franchise: boolean; 6 | budget: number; 7 | worldwide: number; 8 | summary: string; 9 | 10 | constructor() { 11 | this.name = ''; 12 | this.releaseDate = '03/01/1892'; 13 | this.franchise = false; 14 | this.budget = 0; 15 | this.worldwide = 0 16 | this.summary = ''; 17 | } 18 | 19 | } 20 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/07-form-group/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-forms/07-form-group/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/07-form-group/pretty-json.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'prettyjson' 5 | }) 6 | export class PrettyJsonPipe implements PipeTransform { 7 | // eslint-disable-next-line 8 | transform(value: any, ...args: any[]): any { 9 | return JSON.stringify(value, null, 2) 10 | .replace(/ /g, ' ') 11 | .replace(/\n/g, '
'); 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/08-form-builder/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-forms/08-form-builder/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/08-form-builder/pretty-json.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'prettyjson' 5 | }) 6 | export class PrettyJsonPipe implements PipeTransform { 7 | // eslint-disable-next-line 8 | transform(value: any, ...args: any[]): any { 9 | return JSON.stringify(value, null, 2) 10 | .replace(/ /g, ' ') 11 | .replace(/\n/g, '
'); 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/09-form-builder-nested/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-forms/09-form-builder-nested/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/09-form-builder-nested/movie.ts: -------------------------------------------------------------------------------- 1 | export class Movie { 2 | name: string; 3 | releaseDate: string; 4 | 5 | constructor() { 6 | this.name = ''; 7 | this.releaseDate = ''; 8 | } 9 | 10 | } -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/09-form-builder-nested/pretty-json.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'prettyjson' 5 | }) 6 | export class PrettyJsonPipe implements PipeTransform { 7 | // eslint-disable-next-line 8 | transform(value: any, ...args: any[]): any { 9 | return JSON.stringify(value, null, 2) 10 | .replace(/ /g, ' ') 11 | .replace(/\n/g, '
'); 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/10-form-array/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-forms/10-form-array/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/10-form-array/movie.ts: -------------------------------------------------------------------------------- 1 | export class Movie { 2 | name: string; 3 | releaseDate: string; 4 | 5 | constructor() { 6 | this.name = ''; 7 | this.releaseDate = ''; 8 | } 9 | 10 | } -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/10-form-array/pretty-json.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'prettyjson' 5 | }) 6 | export class PrettyJsonPipe implements PipeTransform { 7 | // eslint-disable-next-line 8 | transform(value: any, ...args: any[]): any { 9 | return JSON.stringify(value, null, 2) 10 | .replace(/ /g, ' ') 11 | .replace(/\n/g, '
'); 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/11-form-multi/exercice.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-forms/11-form-multi/exercice.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/11-form-multi/movie.ts: -------------------------------------------------------------------------------- 1 | export class Movie { 2 | name: string; 3 | releaseDate: string; 4 | 5 | constructor() { 6 | this.name = ''; 7 | this.releaseDate = ''; 8 | } 9 | 10 | } -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/11-form-multi/pretty-json.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'prettyjson' 5 | }) 6 | export class PrettyJsonPipe implements PipeTransform { 7 | // eslint-disable-next-line 8 | transform(value: any, ...args: any[]): any { 9 | return JSON.stringify(value, null, 2) 10 | .replace(/ /g, ' ') 11 | .replace(/\n/g, '
'); 12 | } 13 | 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/tutorial.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | import { RouterLink, RouterOutlet } from '@angular/router'; 4 | 5 | @Component({ 6 | selector: 'app-example-forms', 7 | imports: [CommonModule, RouterLink, RouterOutlet], 8 | templateUrl: './tutorial.component.html', 9 | styleUrls: ['./tutorial.component.css'] 10 | }) 11 | export class TutorialComponent { 12 | } 13 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-forms/tutorial.config.ts: -------------------------------------------------------------------------------- 1 | import { ApplicationConfig } from '@angular/core'; 2 | import { provideRouter } from '@angular/router'; 3 | 4 | import { routes } from './tutorial.routes'; 5 | 6 | export const tutorialConfig: ApplicationConfig = { 7 | providers: [provideRouter(routes)] 8 | }; 9 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-items/items.component.css: -------------------------------------------------------------------------------- 1 | .httpclient-table { 2 | border-radius: 10px; 3 | } 4 | 5 | .httpclient-table table { 6 | color: #FFFFFF; 7 | } 8 | 9 | .httpclient-table.blue-gradient { 10 | background: linear-gradient(40deg, #45cafc, #5664bd) !important 11 | } -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-items/services/items.service.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed } from '@angular/core/testing'; 2 | import { HttpClient } from '@angular/common/http'; 3 | import { ItemsService } from './items.service'; 4 | 5 | describe('ItemsService', () => { 6 | let service: ItemsService; 7 | 8 | beforeEach(() => { 9 | TestBed.configureTestingModule({ 10 | providers: [ 11 | ItemsService, 12 | { provide: HttpClient, useValue: {} } 13 | ] 14 | }); 15 | service = TestBed.inject(ItemsService); 16 | }); 17 | 18 | it('should be created', () => { 19 | expect(service).toBeTruthy(); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-items/services/items.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { HttpClient, HttpHeaders } from '@angular/common/http'; 3 | import { Observable } from 'rxjs'; 4 | 5 | const httpOptions = { 6 | headers: new HttpHeaders( 7 | { 8 | 'Content-Type': 'application/json', 9 | } 10 | ) 11 | }; 12 | 13 | @Injectable({ 14 | providedIn: 'root' 15 | }) 16 | export class ItemsService { 17 | 18 | constructor(private http: HttpClient) { } 19 | 20 | getItems(url: string): Observable { 21 | return this.http.get(url, httpOptions); 22 | } 23 | 24 | } -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-services/safe.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser'; 3 | 4 | @Pipe({ name: 'safe' }) 5 | export class SafePipe implements PipeTransform { 6 | constructor(private sanitizer: DomSanitizer) { } 7 | // eslint-disable-next-line 8 | transform(url: any): SafeResourceUrl { 9 | return this.sanitizer.bypassSecurityTrustResourceUrl(url); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-services/song/song.service.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed } from '@angular/core/testing'; 2 | 3 | import { SongService } from './song.service'; 4 | 5 | describe('SongService', () => { 6 | let service: SongService; 7 | 8 | beforeEach(() => { 9 | TestBed.configureTestingModule({}); 10 | service = TestBed.inject(SongService); 11 | }); 12 | 13 | it('should be created', () => { 14 | expect(service).toBeTruthy(); 15 | }); 16 | }); 17 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-services/song/song.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | 3 | import { Song } from './song'; 4 | import { SONGS } from './mock-songs'; 5 | 6 | @Injectable({ 7 | providedIn: 'root' 8 | }) 9 | export class SongService { 10 | 11 | song: Song[]; 12 | constructor() { 13 | this.song = []; 14 | } 15 | 16 | getSongs(year: number): Song[] { 17 | this.song = SONGS[year - 1].items; 18 | 19 | return this.song; 20 | } 21 | 22 | } 23 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-services/song/song.ts: -------------------------------------------------------------------------------- 1 | export class Song { 2 | 3 | link: string; 4 | top: string; 5 | artist: string; 6 | title: string; 7 | 8 | constructor() { 9 | this.link = ''; 10 | this.top = ''; 11 | this.artist = ''; 12 | this.title = ''; 13 | 14 | } 15 | 16 | } 17 | -------------------------------------------------------------------------------- /frontend-angular/src/app/features/tutorials/example-services/tutorial.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/app/features/tutorials/example-services/tutorial.component.css -------------------------------------------------------------------------------- /frontend-angular/src/app/robots.txt: -------------------------------------------------------------------------------- 1 | User-agent: * 2 | Disallow: 3 | Sitemap: https://angular.ganatan.com/sitemap.xml -------------------------------------------------------------------------------- /frontend-angular/src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/.gitkeep -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/cinemax.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/cinemax.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/cw.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/cw.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/discovery-channel.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/discovery-channel.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/disney-channel.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/disney-channel.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/fox.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/fox.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/hbo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/hbo.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/history.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/history.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/hulu.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/hulu.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/mtv.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/mtv.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/nbc.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/nbc.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/netflix.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/netflix.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/showtime.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/showtime.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/channels/usa-network.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/channels/usa-network.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/example-bootstrap/movie-screen.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/example-bootstrap/movie-screen.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/logo/ganatan-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/logo/ganatan-logo.png -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/logo/ganatan-logo@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/logo/ganatan-logo@2x.png -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/studio/2560px-Valve_old_logo.svg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/studio/2560px-Valve_old_logo.svg.png -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/studio/Bioware-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/studio/Bioware-logo.png -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/studio/Electronic_Arts-Logo.wine.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/studio/Electronic_Arts-Logo.wine.png -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/studio/Logo-Nintendo-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/studio/Logo-Nintendo-1.jpg -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/studio/Naughty-dog-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/studio/Naughty-dog-logo.png -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/images/studio/Rockstar_Games_Logo.svg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/src/assets/params/images/studio/Rockstar_Games_Logo.svg.png -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/js/popovers.js: -------------------------------------------------------------------------------- 1 | var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]')) 2 | var popoverList = popoverTriggerList.map(function (popoverTriggerEl) { 3 | return new bootstrap.Popover(popoverTriggerEl) 4 | }) 5 | -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/js/toasts.js: -------------------------------------------------------------------------------- 1 | var myToastEl = document.getElementById('myToast') 2 | myToastEl.classList.add("show"); 3 | -------------------------------------------------------------------------------- /frontend-angular/src/assets/params/js/tooltips.js: -------------------------------------------------------------------------------- 1 | /*var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-toggle="tooltip"]')) 2 | var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) { 3 | return new bootstrap.Tooltip(tooltipTriggerEl) 4 | })*/ 5 | 6 | var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]')) 7 | var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) { 8 | return new bootstrap.Tooltip(tooltipTriggerEl) 9 | }) 10 | 11 | -------------------------------------------------------------------------------- /frontend-angular/src/environments/environment.development.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | application: 3 | { 4 | name: 'angular-bootstrap', 5 | version: 'Angular 20.0.0', 6 | bootstrap: 'Bootstrap 5.3.6', 7 | fontawesome: 'Font Awesome 6.7.2', 8 | } 9 | }; -------------------------------------------------------------------------------- /frontend-angular/src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | application: 3 | { 4 | name: 'angular-bootstrap', 5 | version: 'Angular 20.0.0', 6 | bootstrap: 'Bootstrap 5.3.6', 7 | fontawesome: 'Font Awesome 6.7.2', 8 | } 9 | }; -------------------------------------------------------------------------------- /frontend-angular/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | AngularStarter 6 | 7 | 8 | 9 | 10 | 11 | 12 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /frontend-angular/src/main.server.ts: -------------------------------------------------------------------------------- 1 | import { bootstrapApplication } from '@angular/platform-browser'; 2 | import { App } from './app/app'; 3 | import { config } from './app/app.config.server'; 4 | 5 | const bootstrap = () => bootstrapApplication(App, config); 6 | 7 | export default bootstrap; 8 | -------------------------------------------------------------------------------- /frontend-angular/src/main.ts: -------------------------------------------------------------------------------- 1 | import { bootstrapApplication } from '@angular/platform-browser'; 2 | import { appConfig } from './app/app.config'; 3 | import { App } from './app/app'; 4 | 5 | bootstrapApplication(App, appConfig) 6 | .catch((err) => console.error(err)); 7 | -------------------------------------------------------------------------------- /frontend-angular/src/robots.txt: -------------------------------------------------------------------------------- 1 | User-agent: * 2 | Disallow: 3 | Sitemap: https://angular.ganatan.com/sitemap.xml -------------------------------------------------------------------------------- /frontend-angular/src/styles.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding-top: 3.5rem; 3 | font-family: "Roboto", sans-serif; 4 | } -------------------------------------------------------------------------------- /frontend-angular/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | /* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */ 2 | /* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */ 3 | { 4 | "extends": "./tsconfig.json", 5 | "compilerOptions": { 6 | "outDir": "./out-tsc/app", 7 | "types": [ 8 | "node" 9 | ] 10 | }, 11 | "include": [ 12 | "src/**/*.ts" 13 | ], 14 | "exclude": [ 15 | "src/**/*.spec.ts" 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /frontend-angular/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | /* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */ 2 | /* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */ 3 | { 4 | "extends": "./tsconfig.json", 5 | "compilerOptions": { 6 | "outDir": "./out-tsc/spec", 7 | "types": [ 8 | "jasmine" 9 | ] 10 | }, 11 | "include": [ 12 | "src/**/*.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/css/regular.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | * Copyright 2023 Fonticons, Inc. 5 | */ 6 | :root, :host { 7 | --fa-style-family-classic: 'Font Awesome 6 Free'; 8 | --fa-font-regular: normal 400 1em/1 'Font Awesome 6 Free'; } 9 | 10 | @font-face { 11 | font-family: 'Font Awesome 6 Free'; 12 | font-style: normal; 13 | font-weight: 400; 14 | font-display: block; 15 | src: url("../webfonts/fa-regular-400.woff2") format("woff2"), url("../webfonts/fa-regular-400.ttf") format("truetype"); } 16 | 17 | .far, 18 | .fa-regular { 19 | font-weight: 400; } 20 | -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/css/regular.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | * Copyright 2023 Fonticons, Inc. 5 | */ 6 | :host,:root{--fa-style-family-classic:"Font Awesome 6 Free";--fa-font-regular:normal 400 1em/1 "Font Awesome 6 Free"}@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:400;font-display:block;src:url(../webfonts/fa-regular-400.woff2) format("woff2"),url(../webfonts/fa-regular-400.ttf) format("truetype")}.fa-regular,.far{font-weight:400} -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/css/solid.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | * Copyright 2023 Fonticons, Inc. 5 | */ 6 | :root, :host { 7 | --fa-style-family-classic: 'Font Awesome 6 Free'; 8 | --fa-font-solid: normal 900 1em/1 'Font Awesome 6 Free'; } 9 | 10 | @font-face { 11 | font-family: 'Font Awesome 6 Free'; 12 | font-style: normal; 13 | font-weight: 900; 14 | font-display: block; 15 | src: url("../webfonts/fa-solid-900.woff2") format("woff2"), url("../webfonts/fa-solid-900.ttf") format("truetype"); } 16 | 17 | .fas, 18 | .fa-solid { 19 | font-weight: 900; } 20 | -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/css/solid.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | * Copyright 2023 Fonticons, Inc. 5 | */ 6 | :host,:root{--fa-style-family-classic:"Font Awesome 6 Free";--fa-font-solid:normal 900 1em/1 "Font Awesome 6 Free"}@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:900;font-display:block;src:url(../webfonts/fa-solid-900.woff2) format("woff2"),url(../webfonts/fa-solid-900.ttf) format("truetype")}.fa-solid,.fas{font-weight:900} -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/css/v5-font-face.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | * Copyright 2023 Fonticons, Inc. 5 | */ 6 | @font-face { 7 | font-family: 'Font Awesome 5 Brands'; 8 | font-display: block; 9 | font-weight: 400; 10 | src: url("../webfonts/fa-brands-400.woff2") format("woff2"), url("../webfonts/fa-brands-400.ttf") format("truetype"); } 11 | 12 | @font-face { 13 | font-family: 'Font Awesome 5 Free'; 14 | font-display: block; 15 | font-weight: 900; 16 | src: url("../webfonts/fa-solid-900.woff2") format("woff2"), url("../webfonts/fa-solid-900.ttf") format("truetype"); } 17 | 18 | @font-face { 19 | font-family: 'Font Awesome 5 Free'; 20 | font-display: block; 21 | font-weight: 400; 22 | src: url("../webfonts/fa-regular-400.woff2") format("woff2"), url("../webfonts/fa-regular-400.ttf") format("truetype"); } 23 | -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/css/v5-font-face.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com 3 | * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) 4 | * Copyright 2023 Fonticons, Inc. 5 | */ 6 | @font-face{font-family:"Font Awesome 5 Brands";font-display:block;font-weight:400;src:url(../webfonts/fa-brands-400.woff2) format("woff2"),url(../webfonts/fa-brands-400.ttf) format("truetype")}@font-face{font-family:"Font Awesome 5 Free";font-display:block;font-weight:900;src:url(../webfonts/fa-solid-900.woff2) format("woff2"),url(../webfonts/fa-solid-900.ttf) format("truetype")}@font-face{font-family:"Font Awesome 5 Free";font-display:block;font-weight:400;src:url(../webfonts/fa-regular-400.woff2) format("woff2"),url(../webfonts/fa-regular-400.ttf) format("truetype")} -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/webfonts/fa-brands-400.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/ui/assets/fontawesome/webfonts/fa-brands-400.ttf -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/webfonts/fa-brands-400.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/ui/assets/fontawesome/webfonts/fa-brands-400.woff2 -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/webfonts/fa-regular-400.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/ui/assets/fontawesome/webfonts/fa-regular-400.ttf -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/webfonts/fa-regular-400.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/ui/assets/fontawesome/webfonts/fa-regular-400.woff2 -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/webfonts/fa-solid-900.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/ui/assets/fontawesome/webfonts/fa-solid-900.ttf -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/webfonts/fa-solid-900.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/ui/assets/fontawesome/webfonts/fa-solid-900.woff2 -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/webfonts/fa-v4compatibility.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/ui/assets/fontawesome/webfonts/fa-v4compatibility.ttf -------------------------------------------------------------------------------- /frontend-angular/ui/assets/fontawesome/webfonts/fa-v4compatibility.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/ui/assets/fontawesome/webfonts/fa-v4compatibility.woff2 -------------------------------------------------------------------------------- /frontend-angular/ui/assets/params/css/body.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding-top: 3.5rem; 3 | font-family: "Roboto", sans-serif; 4 | } 5 | -------------------------------------------------------------------------------- /frontend-angular/ui/assets/params/css/footer.css: -------------------------------------------------------------------------------- 1 | .nga-footer { 2 | background-color: #212121; 3 | color: white; 4 | } 5 | 6 | .nga-footer a { 7 | color: white; 8 | text-decoration: none 9 | } 10 | 11 | .nga-footer a:hover, 12 | .nga-footer a:focus { 13 | color: yellow; 14 | text-decoration: underline; 15 | } 16 | 17 | .nga-footer .hint { 18 | background-color: #1976d2; 19 | } 20 | 21 | .nga-footer .hint:hover { 22 | opacity: 0.8; 23 | } 24 | -------------------------------------------------------------------------------- /frontend-angular/ui/assets/params/css/header.css: -------------------------------------------------------------------------------- 1 | .navbar.navbar-dark .navbar-nav .nav-item .nav-link { 2 | color: white; 3 | font-weight: 500; 4 | border-top: 1px solid #09238d; 5 | border-bottom: 1px solid #09238d; 6 | } 7 | 8 | .navbar.navbar-dark .navbar-nav .nav-item .nav-link:hover { 9 | color: yellow; 10 | border-top: 1px solid yellow; 11 | border-bottom: 1px solid yellow; 12 | } 13 | 14 | .nga-navbar { 15 | -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 11px 10px 0 rgba(0, 0, 0, 0.12); 16 | box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 11px 10px 0 rgba(0, 0, 0, 0.12); 17 | background-color: #09238d; 18 | } 19 | 20 | .nga-logo { 21 | font-weight: 700; 22 | } 23 | 24 | .nga-logo:hover { 25 | color: rgba(255, 255, 255, 0.75); 26 | } -------------------------------------------------------------------------------- /frontend-angular/ui/assets/params/images/logo/ganatan-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/ui/assets/params/images/logo/ganatan-logo.png -------------------------------------------------------------------------------- /frontend-angular/ui/assets/params/images/logo/ganatan-logo@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ganatan/angular-httpclient/ba5f94215e8eae8882fe5ed68cfad709304d6b69/frontend-angular/ui/assets/params/images/logo/ganatan-logo@2x.png -------------------------------------------------------------------------------- /frontend-angular/ui/assets/params/js/popovers.js: -------------------------------------------------------------------------------- 1 | var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-toggle="popover"]')) 2 | var popoverList = popoverTriggerList.map(function (popoverTriggerEl) { 3 | return new bootstrap.Popover(popoverTriggerEl) 4 | }) -------------------------------------------------------------------------------- /frontend-angular/ui/assets/params/js/toasts.js: -------------------------------------------------------------------------------- 1 | var myToastEl = document.getElementById('myToast') 2 | myToastEl.classList.add("show"); 3 | -------------------------------------------------------------------------------- /frontend-angular/ui/assets/params/js/tooltips.js: -------------------------------------------------------------------------------- 1 | var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-toggle="tooltip"]')) 2 | var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) { 3 | return new bootstrap.Tooltip(tooltipTriggerEl) 4 | }) 5 | --------------------------------------------------------------------------------