Angular: Lær & Kod
Angular: Lær & Kod — Skriv en komponent, og se den blive gengivet live på din telefon
Angular: Lær & Kod er en gratis iOS- og Android-app til begyndere, studerende og udviklere med JavaScript-baggrund, som vil lære Angular på deres telefon. Dens live-arbejdsområde med tre paneler — component.ts, template.html og styles.css gengiver din kode, mens du skriver, og 38 kurser tager dig fra den første selvstændige komponent til signals, RxJS, NgRx og rendering på serversiden.
- Pris
- Gratis, Pro-opgradering
- Platforme
- iOS og Android
- Sprog
- 22
- Aldersgrænse
- 4+
- Kræver
- iOS 15.1 eller nyere


Ændr en værdi i klassen, og se templaten følge med.
Hele Angulars idé er, at et framework holder en komponents klasse, template og visning synkroniseret for dig. Arbejdsområdet gør det synligt på telefonens skærm: Redigér component.ts, så gengives forhåndsvisningen på ny. Det er den hurtigste måde virkelig at mærke, hvad dependency injection og signals gør, i stedet for blot at læse en definition af dem.
Hvad det er
Angular: Lær & Kod er en gratis uddannelsesapp til iOS og Android, som lærer dig Angular-frameworket fra den første selvstændige komponent og hele vejen gennem et komplet frontend-forløb. Det sker med et live-arbejdsområde med tre paneler (component.ts, template.html, styles.css) og en forhåndsvisning, der gengiver din kode, mens du skriver den. Dens 38 kurser dækker signals, RxJS, routing, forms, NgRx state management og rendering på serversiden samt 60 TypeScript-kodningsopgaver og en AI Mentor til alt det, der ikke giver mening.
Inde i appen
Sådan ser det ud





Kurset
Det dækker Angular-kurset
38 kurser og 144 lektioner fra appens egen kursusliste — fra den første standalone component til signals, NgRx og server-side rendering.
Komponenter og grundlæggende projektstruktur
Velkommen til Angular, Angular CLI og projektstruktur, Angular 19-grundprincipper, Dybdegående gennemgang af Standalone Components, Indbygget kontrolflow, Komponentstyling og -indkapsling samt komponenternes livscyklushooks.
Signals og reaktiv state
Grundprincipper i Angular Signals, Signals: Computed og Effects, Signal Inputs og Queries, signalbaseret state management samt NgRx SignalStore — den aktuelle, anbefalede måde at gemme og udlede en komponents state på.
Services, directives og templates
Grundprincipper i Dependency Injection, Pipes: indbyggede og brugerdefinerede, tovejsbinding og modelinputs, Content Projection og Templates, Directive Composition API samt avancerede komponenter og directives.
Routing og formularer
Angular Routing og Navigation, avanceret Angular Router, arbejde med formularer, avancerede Reactive Forms samt brugerdefinerede form controls.
RxJS og HTTP
Grundprincipper i RxJS til Angular, RxJS-operatorer i dybden, HttpClient-interceptors samt HTTP- og API-integration — laget, der forbinder en komponent med en rigtig backend.
State management og test
State management med NgRx, Angular-unit- og komponenttest samt end-to-end-test af Angular.
Ydeevne og produktion
Change Detection og ydeevne, server-side rendering med Angular SSR, Hydration og ydeevne, Angular Animations, internationalisering (i18n), Micro Frontends med Module Federation, opbygning af Angular-biblioteker samt grundlæggende Angular-sikkerhed.
Sådan fungerer det
Sådan fungerer en session i arbejdsområdet
Hver lektion kombinerer en kort forklaring med det live-arbejdsområde, så det Angular-begreb, du lige har læst om, og koden, der bruger det, er på samme skærm i stedet for at blive til en separat øvelse senere.
Læs om begrebet, og åbn derefter arbejdsområdet
En kort lektion introducerer én idé — et signal, et direktiv eller en router guard — og giver dig derefter component.ts, template.html og styles.css side om side sammen med et forhåndsvisningspanel, der gengiver det, du skriver.
Ændr koden, og se komponenten reagere
Redigér en værdi i klassen, så opdateres templaten i forhåndsvisningen. Ødelæg en binding, så viser forhåndsvisningen præcis det. Det kan et statisk kodeeksempel ikke gøre, og derfor er kurset baseret på arbejdsområdet i stedet for tekstuddrag, man kun kan læse.
Løs en TypeScript-opgave, og spørg, når du går i stå
60 kodningsopgaver på tværs af tre sværhedsgrader følger efter lektionerne med hints og gennemarbejdede løsninger, hvis du går i stå med en opgave. Hvis noget stadig ikke giver mening — et signal, der ikke opdateres, eller en injected service, der kommer tilbage som undefined — forklarer AI Mentor det fra lektionens egen chatskærm.
Hvad det indeholder
Dette følger med appen
38
Kurser, A1 til C1
144 lektioner fordelt på 38 kurser, fra standalone components og signals til RxJS, forms, routing, NgRx state management, testning, rendering på serversiden og micro frontends.
Live
Arbejdsområde med tre paneler
component.ts, template.html og styles.css kan redigeres side om side, mens en forhåndsvisning gengiver din Angular-kode, efterhånden som du skriver den — kræver en forbindelse for at køre.
60
TypeScript-kodningsopgaver
Tre sværhedsgrader med hints og gennemarbejdede løsninger samt en Projects-fane med arbejdsområder med flere filer, guidede projektforløb og versionshistorik.
AI
AI-tutor (Pro)
Spørg om en fejl, et begreb eller din egen kode fra lektionens chatskærm. Pro tilføjer også en AI-lektionsgenerator til et emne, du specifikt endnu ikke forstår, samt en AI-playground, der omsætter en beskrevet side til kode.
Verden
World Coding Challenge
Ét fælles problem, hvor alles løsninger er synlige, sammen med streaks, XP, en rangliste og daglige påmindelser.
Certifikat
Gennemførelsesbevis
En afsluttende eksamen og et certifikat med dit navn på samt miniquizzer, flashcard-gennemgang og et cheatsheet på én side med syntaks, decorators og directives.
Baggrund
Hvad er Angular, og i hvilken rækkefølge lærer man det egentlig?
Angular er et frontend-framework, der vedligeholdes af Google og er skrevet i TypeScript. Det bruges til at bygge de interaktive singlepage-grænseflader i store webapps. I modsætning til et bibliotek, som du selv sammensætter, leveres Angular med en fastlagt samling dele: komponenter, en router, et forms-system, dependency injection og RxJS til strømme af hændelser. Den praktiske læringsrækkefølge er først komponenter og templates, derefter signals og services, så routing og forms og til sidst RxJS- og HTTP-laget, der kommunikerer med en rigtig backend.
Standalone componentbyggestenen
En selvstændig del af brugergrænsefladen — med sin egen klasse, template og styles — som erklærer sine egne afhængigheder i stedet for at være en del af et fælles modul. Moderne Angular-apps bygges som et træ af disse komponenter, og derfor starter kurset her i stedet for med ældre modulbaserede mønstre.
Signalden moderne måde at håndtere state på
En reaktiv værdi, der oprettes med signal(), og som alle dele af templaten kan læse. computed() udleder ét signal fra et andet, og effect() kører kode, når et signal ændres. Signals har erstattet meget af det manuelle arbejde med change detection og er nu den anbefalede måde at gemme en komponents state på.
Dependency injectionsådan forbindes delene
I stedet for at en komponent selv opretter de services, den har brug for, beder den om dem, hvorefter Angular leverer dem. Det er det begreb, begyndere oftest snubler over ved første møde, og det, der gør en stor kodebase testbar, fordi en rigtig service nemt kan udskiftes med en falsk service i en test.
RxJS og observablesdataflowet
Et bibliotek til værdier, der ankommer over tid i stedet for på én gang — HTTP-svar, route-parametre og input fra en formular, efterhånden som det ændrer sig. Angulars HttpClient og router returnerer observables direkte, så du får brug for et praktisk kendskab til operatorer som map og switchMap, uanset om du havde planlagt at lære dem.
Egnethed
Hvem det er til — og hvem det ikke er til
Det passer godt til dig, hvis du
- Begynder du på Angular fra bunden og vil se en komponent reagere, før du lærer teorien bag den udenad
- Kender du allerede JavaScript eller TypeScript og er du i gang med at lære dit første framework
- Arbejder du med React eller Vue og skifter du til Angular på grund af et job, hvor du vil have terminologien oversat frem for at få det hele undervist fra bunden
- Vil du have TypeScript-kodningsopgaver og et rigtigt arbejdsområde med et projekt fordelt på flere filer — ikke kun multiple choice-spørgsmål
- Er du studerende eller skifter du karriere og forbereder dig til en jobsamtale som frontendudvikler
Det er ikke det rette værktøj, hvis du
- Har du brug for, at arbejdsområdet fungerer helt uden forbindelse — liveforhåndsvisningen kræver specifikt en forbindelse
- Forventer du, at alt er gratis: Det første kursus og arbejdsområdet er gratis, mens Pro låser resten op, inklusive AI-værktøjerne
- Bygger du allerede Angular-apps til produktion og ønsker du dybdegående arkitektur- eller API-reference frem for et kursus
- Har du brug for en akkrediteret kvalifikation — certifikatet dokumenterer gennemførelse og er ikke en formel uddannelseslegitimation
Spørgsmål
Ofte stillede spørgsmål
Hvad viser Angular-appens livearbejdsområde egentlig?
Tre redigerbare paneler — component.ts til TypeScript-klassen, template.html til markup og styles.css til styling — ved siden af en forhåndsvisning, der gengiver komponenten, mens du redigerer et af de tre paneler. Når du ændrer værdien af et signal i klassen og ser templaten opdatere med det samme, får du vist noget, som et statisk kodestykke i en bog ikke kan vise. Derfor er kurset bygget op omkring dette i stedet for eksempler, der kun skal læses.
Skal jeg kunne JavaScript eller TypeScript, før jeg lærer Angular?
Det hjælper at kunne noget JavaScript, men det er ikke en forudsætning, du skal opfylde først. Angular er skrevet i TypeScript, som er JavaScript med et typesystem, og kurset introducerer typeannoteringer og interfaces, efterhånden som de bliver relevante, i stedet for at antage, at du allerede kender dem. Angular: Lær & Kod begynder med en første standalone component og forklarer TypeScript undervejs.
Hvad er Angular signals, og hvorfor begynder kurset med dem?
Et signal er en reaktiv værdi, der oprettes med signal(), og som templaten læser direkte. computed() udleder et nyt signal fra eksisterende signaler, og effect() kører automatisk kode, når et signal, det afhænger af, ændres. Signals er den aktuelle, af Angular anbefalede måde at gemme en komponents state på og erstatter meget af det manuelle arbejde med change detection fra ældre versioner. Derfor ligger kurset Signals Fundamentals tidligt i forløbet i stedet for at være et avanceret emne.
Hvad er forskellen på Angular og React?
React er et rendering-bibliotek; du vælger selv router, formhåndtering, HTTP-client og state management omkring det. Angular er et komplet framework og leveres allerede med disse valg — komponenter, dependency injection, en router, RxJS og nu også indbyggede signals. React føles ofte lettere at komme i gang med, mens Angular føles tungere, men i et stort team ligner en Angular-kodebase mere andre Angular-kodebaser fra virksomhed til virksomhed. Det er en del af forklaringen på, at store organisationer fortsat bruger det.
Kan det stadig betale sig at lære Angular i 2026?
Ja, især hvis målet er at få arbejde og ikke blot at lave et sideprojekt. Angular bruges i stor udstrækning i store virksomheder og til enterprise-værktøjer, hvor den faste struktur, den indbyggede testunderstøttelse og den langsigtede supportplan betyder mere end nyhedsværdien. Derfor er jobopslag med Angular ofte stabile. Materialet om signals og SignalStore i dette kursus afspejler også, hvor frameworket faktisk har bevæget sig hen, frem for at være et forældet øjebliksbillede.
Hvor lang tid tager det at lære Angular godt nok til at bygge noget?
Regelmæssighed er vigtigere end det samlede timetal. Hvis du arbejder med korte daglige lektioner i arbejdsområdet, kan de fleste begyndere bygge og forbinde nogle få komponenter, sende data mellem dem med signals og kalde en API i løbet af nogle uger. Dependency injection, RxJS-operatorer og state management med NgRx er typisk de dele, der kræver en ekstra gennemgang, og kurset placerer dem efter det grundlæggende i stedet for at begynde med dem.
Findes Angular: Lær & Kod til iPhone og Android, og hvem er det til?
Angular: Lær & Kod fås til iPhone og iPad i App Store og til Android på Google Play. Grænsefladen findes på 22 sprog, og appen har en aldersvurdering på 4+. Den er til komplette begyndere, studerende, karriereskiftere og udviklere, der kan noget JavaScript og vil lære Angular som deres første framework eller skifte til det fra React eller Vue.
Er Angular: Lær & Kod gratis?
Appen kan downloades gratis fra App Store og Google Play. Det første kursus og livearbejdsområdet er gratis. Pro er den betalte opgradering: Den låser op for alle kurser, alle 60 kodningsopgaver samt AI-tutoren, lektionsgeneratoren og legepladsen og fjerner reklamer.
Virker liveforhåndsvisningen offline, i metroen eller i et fly?
Nej, ikke selve forhåndsvisningen — en livegengivelse af din komponent kræver en forbindelse, og det oplyser appen tydeligt i stedet for stille og roligt at levere en forringet oplevelse. Lektioner og læsemateriale indlæses stadig og fungerer på en ustabil forbindelse, men hvis du har brug for et arbejdsområde, der fungerer helt offline, kan denne apps liveforhåndsvisning ikke levere det.
Er denne app tilknyttet Google eller det officielle Angular-team?
Nej. Angular: Lær & Kod er et uafhængigt læringskursus fra CoddyKit og er hverken tilknyttet eller godkendt af Google eller Angular-teamet. Kurset underviser i frameworket, sådan som Google vedligeholder og udgiver det, men selve appen er et tredjepartskursus og ikke et officielt produkt.
Kom i gang
Byg din første Angular-komponent i dag
Gratis at komme i gang på iOS og Android på 22 sprog.
Mere fra CoddyKit
Tilgængelig på iOS og Android.