[{"_1":2,"_156":-5,"_157":-5},"loaderData",{"_3":4,"_13":14,"_21":22,"_135":136},"root",{"_5":-5,"_6":-7,"_7":8,"_9":-7,"_10":11,"_12":-7},"currentUser","primaryEmail","siteVerification","6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI","toast","enableDev",false,"incidentStatus","routes/_layout",{"_15":-5,"_16":17,"_18":17,"_19":11,"_20":11},"username","isAskGordonEnabled",true,"isUsingNewTemplate","showMinimalLanding","showHoneypotTrap","routes/_layout.r.$namespace.$reponame",{"_23":24,"_25":-5,"_26":11,"_27":11,"_28":29,"_30":31,"_32":-5,"_33":11,"_34":35,"_84":-5,"_85":86,"_126":-5,"_127":11,"_128":17,"_129":11,"_130":-5,"_131":11,"_132":-5,"_133":134},"canonicalUrl","https://hub.docker.com/r/magicalyak/angular7-example-app/tags","mcpServer","canSeeDockerfile","canSeeAutobuilds","namespace","magicalyak","reponame","angular7-example-app","cloudBuildSource","isAutobuildsAvailable","repo",{"_36":37,"_38":39,"_41":42,"_43":44,"_45":11,"_46":47,"_48":49,"_50":51,"_53":31,"_28":29,"_54":55,"_56":40,"_57":58,"_59":60,"_61":62,"_63":-5,"_64":58,"_65":66,"_67":11,"_68":29,"_69":70,"_75":11,"_76":77,"_81":29,"_82":83},"categories",[],"content_types",[40],"image","date_registered","2019-04-10T15:23:03.473922Z","description","Docker container based on the excellent example app at Ismaestro/angular7-example-app","is_private","last_updated","2023-02-01T16:30:35.448661Z","last_modified","2024-10-16T13:48:34.145251Z","media_types",[52],"application/vnd.docker.container.image.v1+json","name","pull_count",267,"repository_type","star_count",0,"status",1,"status_description","active","source","collaborator_count","full_description","

\n \n $\"Logo\"$ \n \n\n

Angular Example App

\n\n

\n Example app with Angular 8 + Angular CLI + Angular Universal + i18n + Firebase\n
\n
\n :clap::clap::tada::tada::tada::tada::clap::clap:\n
\n
\n Base project made with much :heart:. Contains CRUD, patterns, generated library, and much more!\n
\n
\n LIVE DEMO\n
\n \n $\"Demo$ \n \n
\n
\n Report bug\n ·\n Request feature\n

\n\n## Table of contents\n\n- [Status](#status)\n- [What's included](#whats-included)\n- [Quick start](#quick-start)\n- [Bugs and feature requests](#bugs-and-feature-requests)\n- [Apply this to your project](#apply-this-to-your-project)\n- [Contributing](#contributing)\n- [Creators](#creators)\n- [Thanks](#thanks)\n- [Copyright and license](#copyright-and-license)\n\n## Status\n\n![travis](https://travis-ci.org/Ismaestro/angular8-example-app.svg?branch=master)\n[![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=Ismaestro_angular8-example-app&metric=alert_status)](https://sonarcloud.io/dashboard?id=Ismaestro_angular8-example-app)\n[![Coverage](https://sonarcloud.io/api/project_badges/measure?project=Ismaestro_angular8-example-app&metric=coverage)](https://sonarcloud.io/dashboard?id=Ismaestro_angular8-example-app)\n[![dependency Status](https://david-dm.org/ismaestro/angular8-example-app.svg)](https://david-dm.org/ismaestro/angular8-example-app#info=dependencies)\n[![devDependency Status](https://david-dm.org/ismaestro/angular8-example-app/dev-status.svg)](https://david-dm.org/ismaestro/angular8-example-app#info=devDependencies)\n[![peerDependencies Status](https://david-dm.org/ismaestro/angular8-example-app/peer-status.svg)](https://david-dm.org/ismaestro/angular8-example-app?type=peer)\n[![npm](https://img.shields.io/badge/demo-online-brightgreen.svg)](http://angularexampleapp.com/)\n\n[![GitHub stars](https://img.shields.io/github/stars/ismaestro/angular8-example-app.svg?style=social&label=Star)](https://github.com/ismaestro/angular8-example-app)\n[![GitHub forks](https://img.shields.io/github/forks/ismaestro/angular8-example-app.svg?style=social&label=Fork)](https://github.com/ismaestro/angular8-example-app/fork)\n\n## What's included\n\n- [x] CRUD: create, update and remove heroes with Firebase\n- [x] Angular Universal (SSR)\n- [x] Use of [preboot](https://github.com/angular/preboot) module to share state between browser and server\n- [x] Security Headers using [helmet](https://helmetjs.github.io). Report [here](https://securityheaders.com/?q=https%3A%2F%2Fwww.angularexampleapp.com).\n- [x] Internationalization with the official i18n. Separated builds for english and spanish.\n- [x] Lazy loading modules\n- [x] Service Workers enabled!\n- [x] Example of Angular Resolver for Hero Detail\n- [x] More logical directory structure (from [here](https://itnext.io/choosing-a-highly-scalable-folder-structure-in-angular-d987de65ec7))\n- [x] Basic example library\n- [x] Following the [best practices](https://angular.io/guide/styleguide)!\n- [x] Search bar, to look for heroes\n- [x] Custom loading page\n- [x] Lazy loading images with [ng-lazyload-image](https://github.com/tjoskar/ng-lazyload-image)\n- [x] Modal and toasts (snakbar)!\n- [x] Scroll restoration and anchor examples\n- [x] Responsive layout (flex layout module)\n- [x] SASS (most common used functions and mixins) and BEM styles\n- [x] Animations with [ng-animate](https://jiayihu.github.io/ng-animate/)\n- [x] Angular Pipes\n- [x] Interceptors and Events (Progress bar active, if a request is pending)\n- [x] Scroll to first invalid input in forms. ([ngx-scroll-to-first-invalid](https://github.com/Ismaestro/ngx-scroll-to-first-invalid))\n- [x] Modernizr (browser features detection)\n- [x] Browser filter (Bowser) because of IE ^^\n- [x] [Sentry](https://sentry.io)! (logs every error in the app)\n- [x] Google Tag Manager\n- [x] ES6 Promises and Observables\n- [x] Unit tests with Jasmine and Karma including code coverage. Use of [ng-bullet](https://www.npmjs.com/package/ng-bullet), [karma-mocha-reporter](https://github.com/litixsoft/karma-mocha-reporter) and [ng-mocks](https://github.com/ike18t/ng-mocks)\n- [x] End-to-end tests with Protractor\n\n### Angular Ivy\n\nThis project is using version 8 of angular but Ivy is not enabled. I'm trying to do it, but some errors appear during this process. I would accept any pull request about this because no one till now knows what to do...\n\n### Angular Universal and i18n\n\nThis project is deployed in firebase using Angular Universal and the official i18n. You can navigate through every language and reload (and share) every page in the application without losing context. This is very useful for SEO purposes and you almost have a ready for production app.\nIf you want to translate the messages you can use this awesome tool, [Tiny Translator](https://martinroob.github.io/tiny-translator/en/#/translate) or follow [this tutorial](https://github.com/martinroob/ngx-i18nsupport/wiki/Tutorial-for-using-xliffmerge-with-angular-cli).\n\nI've created a medium post where you can find a tutorial to apply this concepts to your own project. [Check it here](https://medium.com/@ismaestro/angular-7-example-app-with-angularcli-angular-universal-i18n-official-firebase-66deac2dc31e), and let me know what do you think.\n\n### Firebase\n\nThis repo is using Firebase. We use Cloud Firestore and Cloud Storage to handle CRUD operations over the heroes and to store their images. Also Hosting and Functions to deploy the app with Universal.\n\n## Travis CI\n\nWe use Travis CI to run this tasks in order:\n* Linter\n* Unit tests\n* End to end tests\n* Build for production of browser and server\n* Validate that server generated using curl\n* Sonar\n* Deploy to Firebase\n\n## Quick start\n\n**WARNING**\n\n> Verify that you are running node 10.16.0 by running node -v in a terminal/console window. Older versions produce errors, but newer versions are fine.\n\n ```bash\n npm i\n npm start\n ```\n\nTasks | Description\n----------------------------|---------------------------------------------------------------------------------------\nnpm start | Start the app in development mode with the english language only\nnpm start:es | Start the app in development mode with the spanish language only\nstart:ssr | Start the server like SSR\nextract-i18n | Extract all messages from templates and ts files and update the language files with new translations\nnpm run lint | Run the linter (tslint)\nnpm run test | Run all unit tests with karma and jasmine\nnpm run test:app:watch | Run app unit tests and wait for changes\nnpm run test:library:watch | Run library unit tests and wait for changes\nnpm run e2e | Run end to end tests with protractor\nnpm run build:prod:en | Build the app for production with english translations\nnpm run build:prod:es | Build the app for production with spanish translations\nnpm run build:server:prod | Build the server version for production\nnpm run compile:server | Compiles the server with webpack\nnpm run build:ssr | Complete task with all the build subtasks for SSR\nnpm run build:library | Build the library\nnpm run serve:ssr | Start the node server for angular universal\nnpm run validate:server | Script that validate if server generated previously starts without error\nnpm run bundle-report | Build and run webpack-bundle-analyzer over stats json\nnpm run release:minor | Create a new minor release using standard-version\nnpm run release:major | Create a new major release using standard-version\nnpm run ci | Execute linter, tests and production builds\nnpm run deploy | Build the app and deploy it to firebase hosting\n\n## Bugs and feature requests\n\nHave a bug or a feature request? Please first read the [issue guidelines](https://github.com/Ismaestro/angular8-example-app/blob/master/CONTRIBUTING.md) and search for existing and closed issues. If your problem or idea is not addressed yet, [please open a new issue](https://github.com/Ismaestro/angular8-example-app/issues/new).\n\n## Contributing\n\nPlease read through our [contributing guidelines](https://github.com/Ismaestro/angular8-example-app/blob/master/CONTRIBUTING.md). Included are directions for opening issues, coding standards, and notes on development.\n\nMoreover, all HTML and CSS should conform to the [Code Guide](https://github.com/mdo/code-guide), maintained by [Ismael Ramos](https://github.com/ismaestro).\n\nEditor preferences are available in the [editor config](https://github.com/Ismaestro/angular8-example-app/blob/master/.editorconfig) for easy use in common text editors. Read more and download plugins at .\n\n## Creators\n\n**Ismael Ramos**\n\n- \n\n $\"Buy$ \n\n## Thanks\n\nThanks to all contributors and their support.\n\nIf you have an idea or you want to do something, tell me or just do it!\nI'm always happy to hear your feedback!\n\n## Copyright and license\n\nCode and documentation copyright 2018 the authors. Code released under the [MIT License](https://github.com/Ismaestro/angular8-example-app/blob/master/LICENSE).\n\nEnjoy :metal:\n","has_starred","hub_user","immutable_tags_settings",{"_71":11,"_72":73},"enabled","rules",[74],".*","is_automated","permissions",{"_78":17,"_79":11,"_80":11},"read","write","admin","user","storage_size",36042916,"orgData","recentTags",[87],{"_88":40,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_46":115,"_116":90,"_117":29,"_118":52,"_53":119,"_120":121,"_122":105,"_123":115,"_124":62,"_125":17},"content_type","creator",182657,"digest","sha256:637840fd0ee5c6fe1c039b7afd62f6a023456e023db7be392f5efbdce8870f68","full_size",16997916,"id",52408012,"images",[99],{"_100":101,"_91":92,"_102":103,"_104":105,"_106":107,"_108":109,"_110":103,"_111":-5,"_112":94,"_59":62,"_113":114},"architecture","arm64","features","","last_pulled","2026-09-23T05:23:52.614283528Z","last_pushed","2023-02-01T16:30:36Z","os","linux","os_features","os_version","size","variant","v8","2023-02-01T16:30:35.310047Z","last_updater","last_updater_username","media_type","latest","repository",6959220,"tag_last_pulled","tag_last_pushed","tag_status","v2","sbxKitMetadata","isPotentialSpam","isHubSbxKitsEnabled","showSbxLogoOverride","sbxTrademarkText","displaySecurityMetadata","tagAttestations","tagsHaveAttestations",[],"routes/_layout.r.$namespace.$reponame.tags",{"_34":137,"_144":145,"_133":154,"_155":11},{"_36":138,"_38":139,"_41":42,"_43":44,"_45":11,"_46":47,"_48":49,"_50":140,"_53":31,"_28":29,"_54":55,"_56":40,"_57":58,"_59":60,"_61":62,"_63":-5,"_64":58,"_65":66,"_67":11,"_68":29,"_69":141,"_75":11,"_76":143,"_81":29,"_82":83},[],[40],[52],{"_71":11,"_72":142},[74],{"_78":17,"_79":11,"_80":11},"tags",{"_146":60,"_147":-5,"_148":-5,"_149":150},"count","next","previous","results",[151],{"_88":40,"_89":90,"_91":92,"_93":94,"_95":96,"_97":152,"_46":115,"_116":90,"_117":29,"_118":52,"_53":119,"_120":121,"_122":105,"_123":115,"_124":62,"_125":17},[153],{"_100":101,"_91":92,"_102":103,"_104":105,"_106":107,"_108":109,"_110":103,"_111":-5,"_112":94,"_59":62,"_113":114},[],"canDeleteTags","actionData","errors"]

magicalyak/angular7-example-app

Tags for magicalyak/angular7-example-app