{"id":18842550,"url":"https://github.com/lcube45/formation-ng","last_synced_at":"2026-04-11T13:03:17.525Z","repository":{"id":38669930,"uuid":"215051395","full_name":"lcube45/formation-ng","owner":"lcube45","description":null,"archived":false,"fork":false,"pushed_at":"2023-01-07T10:41:11.000Z","size":2790,"stargazers_count":1,"open_issues_count":24,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-12-30T11:33:57.692Z","etag":null,"topics":["angular","bootstrap","firebase","ng-bootstrap","pwa","schematics-ng","scss"],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/lcube45.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-10-14T13:28:38.000Z","updated_at":"2020-05-29T19:27:43.000Z","dependencies_parsed_at":"2023-02-06T23:00:55.845Z","dependency_job_id":null,"html_url":"https://github.com/lcube45/formation-ng","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lcube45%2Fformation-ng","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lcube45%2Fformation-ng/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lcube45%2Fformation-ng/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lcube45%2Fformation-ng/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lcube45","download_url":"https://codeload.github.com/lcube45/formation-ng/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":239780117,"owners_count":19695734,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","bootstrap","firebase","ng-bootstrap","pwa","schematics-ng","scss"],"created_at":"2024-11-08T02:55:02.345Z","updated_at":"2025-12-30T23:00:15.867Z","avatar_url":"https://github.com/lcube45.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# RxJS\n\n## Type d'observables\n\n* Observable (flux de données distribué à partir du moment ou il y a un souscripteur)\n* Subject (flux de données distribué sans cache même si pas de souscripteur)\n* BehaviorSubject (idem subject avec 1 niveau de cache)\n* ReplaySubject (behavior avec cache plus important)\n* AsyncSubject (behavior avec dernier élément en cache)\n\n## Nature d'observables\n\n* cold (froid) : pas de désinscription au flux (faite après le complete)\n* chaud (hot) : désinscription explicite\n\n## Modules, components\nModules -\u003e Components\n\n## Poids des sélecteurs CSS\nbalise =\u003e 1\nattribut =\u003e 10\nid =\u003e 100\nstyle =\u003e 1000\nimportant =\u003e the boss !\n\n## Wrapper bootstrap pour Angular\nngx-bootstrap\nng-bootstrap\n\n## Schematics\nng add @ng-bootstrap/schematics\nng update @ng-bootstrap/ng-bootstrap\n\n## Types de composants\nComposants d'affichage (silly)\nComposants de conteneurs (organisent d'autres composants)\nComposants de layout (mise en page)\n\n## Génération de documentation\nnpm -g @compodoc/compodoc\nnpm run generate-doc\n\n## Good to know\n* interpolation : {{ mavar }}\n* property binding : []={}\n\n## Bonnes pratiques\n* Faire communiquer des composants entre eux via des services\n* Les composants ne devraient tirer leur logique que des services\n* Convention : ajouter un dollar en fin de nom de variables pour identifier des observables\n* Créer une librairie consiste à encapsuler un module pour être réutiliser\n* Toujours injecter les services en private\n* Routing : forRoot (instancie le routeur) alors que forChild (utilise l'instance déjà créée)\n* Server side rendering pour les problèmes de SEO/Référencement\n* Lazy loading de module gère le préfixe des paths de routes\n* Si Lazy Loading de module, il faut utiliser le pre loading de module\n* Un composant ça se déclare, ça s'importe\n* Un module ça s'exporte\n* Transclusion = projection de template\n* ngx translate : library i18n\n* stratégie \"changement de détection\" (ex: OnPush)\n* Ne pas passer d'objet complet à une directive qui surveille des changements, il faut passer des propriétés (car sinon l'adresse mémoire de l'objet n'évoluant pas, ...)\n\n## Utilisation Firebase\n* déploiement de notre application avec firebase\n* ng deploy (build and push src to firebase)\n\n## PWA\n* ng add @angular/pwa\n* realfavicongenerator.net\n\n## Web components et angular elements\n* ng build --prod --project myelement --output-hashing none --single-bundle true\n\n## Formulaire\n* soit piloté par le template soit par le code (méthode préféré par le code)\n* FormControl = un champ de notre formulaire (input, select, ...)\n* FormGroup = plusieurs FormControl = le formulaire en entier\n\n## Injection\n* par défaut les services sont injectés \"globalement\" (root)\n* on peut limiter l'injection d'un service à un module (syntaxe Providers)\n* les services peuvent être injectés dans un composant (providers) mais ici ce ne sont pas des singletons (à chaque instance du composant = 1 instance du service)\nex: composant datepicker avec un service, plusieurs utilisations du datepicker dans une appli, \non attend donc d'avoir plusieurs instances du service de dialogue avec le composant datepicker\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flcube45%2Fformation-ng","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flcube45%2Fformation-ng","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flcube45%2Fformation-ng/lists"}