{"id":22837831,"url":"https://github.com/rahullkumr/angular-session","last_synced_at":"2025-07-12T08:32:55.171Z","repository":{"id":176167285,"uuid":"654288035","full_name":"Rahullkumr/Angular-session","owner":"Rahullkumr","description":"3 days (6 hrs) session on Angular","archived":false,"fork":false,"pushed_at":"2024-01-20T21:04:23.000Z","size":428,"stargazers_count":1,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-22T07:43:55.352Z","etag":null,"topics":["8007667835","angular"],"latest_commit_sha":null,"homepage":"https://www.linkedin.com/in/akajay2001/","language":null,"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/Rahullkumr.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,"governance":null,"roadmap":null,"authors":null}},"created_at":"2023-06-15T19:49:16.000Z","updated_at":"2024-01-20T21:04:26.000Z","dependencies_parsed_at":null,"dependency_job_id":"794d8be8-9860-44ea-a817-04b697d006cb","html_url":"https://github.com/Rahullkumr/Angular-session","commit_stats":null,"previous_names":["rahullkumr/angular-session"],"tags_count":0,"template":false,"template_full_name":"github/codespaces-blank","purl":"pkg:github/Rahullkumr/Angular-session","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Rahullkumr%2FAngular-session","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Rahullkumr%2FAngular-session/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Rahullkumr%2FAngular-session/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Rahullkumr%2FAngular-session/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Rahullkumr","download_url":"https://codeload.github.com/Rahullkumr/Angular-session/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Rahullkumr%2FAngular-session/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264962450,"owners_count":23689812,"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":["8007667835","angular"],"created_at":"2024-12-12T23:20:11.388Z","updated_at":"2025-07-12T08:32:55.143Z","avatar_url":"https://github.com/Rahullkumr.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"# Angular-session\n## Day 1 \n\nsession on Angular (Google)\n\nwhy Angular?\n1. software is just crud.\n2. angular is a client side library. It has nothing to do with server\n3. earlier, almost 80% of work was done on the server but today all presentation and basic operations are done\n  on the browser. server need is reduced by 20%\n  \n Why and why now, why not 10 years back?\n eg. of bmw.\n json = js object notation\n \n is there memory in browser?\n why is it happening today?\n because ecosystem was not there and today's clients ie mobile and laptops are capable enough to do such calculations.\n \n vvi What is node?\n node = Node.js is an open-source, cross-platform, JavaScript runtime environment that executes JavaScript code outside of a web browser(c++)\n run by:\n html = html parser\n css = css parser\n js = js engine in the browser (taken from V8 engine used by chrome an opensource engine)\n firefox engine is Spidermonkey.\n \n development stacks are: \u003cbr/\u003e\n LAMP \u003cbr/\u003e\n WAMP \u003cbr/\u003e\n MEAN(popular because of ability to develop an app using only one language ie JS) \u003cbr/\u003e\n MERN(popular because of ability to develop an app using only one language ie JS) \u003cbr/\u003e\n \n-------------------------------\nAngular: component based framework. what is component based?\nENTIRE page is made up of independent component, like different components for header, footer, body and other.\nThese days we don't make a single page webpage.\n\nmvvc = model = date, view\n\nwhat is single page app?\neg Instagram, there is no next page concept.\n\nwhy single page appln?\nbecause developers wanted to keep you engaged on the same page. \n\nprogrammer's view point:\nwhenever u were switching to next page entire page was reloaded, but in one page only required data is reloaded.\n\n# TypeScript (object oriented)\nAngular vs AngularJS\n\nbrowser doesn't understand TS.\nTS = superset of JS\nSince modern rowsers(as of now) do not understand TypeScript,  a TS compiler or transpiler is required to convert the TS code to regular JS code.\n\nwhy only Angular not AngularJS?\nbecause of inclusion of TS in the library. AngularJS is the first version.\n\nJS and TS both are same for programmers, since every TS code is automatically converted into JS as browser dosn't understand TS.\n--------------------------\n\n## Let's do installation and run our first Angular app\nWhy we need node for angular developent?\nnode is needed for development of angular apps.\n\n## Installation\n1. Install node:\n```diff\n+ new way\ncurl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash -\nsudo apt-get install -y nodejs\n\n- old way\nnvm install 16.10    (only 16.1 is working in codespace)\nnode --version\n```\n\n2. Install Angular: \n```\nnpm install -g @angular/cli     (-g is for global access)\nng version\n```\n\n## Create and run first Angular app\n```\nng new demoapp1\ncd demoapp1\nng serve -o\n```\n-----------\n# Day2\n\n1. run the angular app using ```ng serve -o```\n   \u003cp\u003e\n     The Path of running an angular app is: see pdf\n   \u003c/p\u003e\n   \n2. Create three modules (header, body and footer) and connect them with app-route\n   ```\n   ng g c header\n   ng g c body\n   ng g c footer\n   ```\n   \n-------------------------\n# Day 3\n\nservices will communicate to external world.\n\nWhy services?\ncomponents vs services?\n\n```ng g s newfoldername``` for creating service\n\ninject service class to the component\n\n## Links provided\n1. [Courses by Amrendra sir](https://akajay.in/learny/)\n\n2. [Presentation link](https://docs.google.com/presentation/d/e/2PACX-1vSuakldhmsoxtx3SW_ZlukMImjHswgd6KdSRRbWOIXXE99oIE8ab4e1d-XJKfhtQJ9Tp0Oma-FMA_ad/pub?start=false\u0026loop=false\u0026delayms=3000\u0026slide=id.g2296c731ee8_0_0)\n\n3. [TODO APP step by step](https://docs.google.com/presentation/d/e/2PACX-1vSuakldhmsoxtx3SW_ZlukMImjHswgd6KdSRRbWOIXXE99oIE8ab4e1d-XJKfhtQJ9Tp0Oma-FMA_ad/pub?start=false\u0026loop=false\u0026delayms=3000\u0026slide=id.g25258cab8bc_0_4)\n\n4. [Angular Services and DI](https://docs.google.com/presentation/d/e/2PACX-1vTeWR2kHhqf6hk9JpMG8FcPIud-mPwgXB0xX9vxcp2QZse9NTruXo7fL8ZbTffvk4YXnLbNbIy3uZOq/pub?start=false\u0026loop=false\u0026delayms=3000\u0026slide=id.p)\n\n5. [Routing and SPA](https://docs.google.com/presentation/d/e/2PACX-1vS1Xe9LUMgyb79TdyhWlyN-BcKoP41U0j7OXTGk2dvUZIbIp953I0ETatXm9ZDZ2LSz_dBWAIhrXFCh/pub?start=false\u0026loop=false\u0026delayms=3000\u0026slide=id.p)\n\n## TODO APPS\n1. [todoapp1.zip](https://drive.google.com/file/d/19E79COFjpaTTbtClsyWr3m_APFqyja-h/view?usp=sharing)\n2. [todoapp2.zip](https://drive.google.com/file/d/1ZdGByeOah5NYTtDOY9JN2d7GK9HgAggs/view?usp=sharing)\n3. [todoapp3.zip](https://drive.google.com/file/d/1wGt1slz911QFdePAzAQVeYNFXJXx4qRT/view?usp=sharing)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frahullkumr%2Fangular-session","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frahullkumr%2Fangular-session","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frahullkumr%2Fangular-session/lists"}