From d63ddb6518579e3696dc513a544b2e3869e8855c Mon Sep 17 00:00:00 2001 From: "localizeflow[bot]" Date: Fri, 6 Mar 2026 15:40:39 +0000 Subject: [PATCH] chore(i18n): sync translations with latest source changes (chunk 1/1, 12 changes) --- translations/et/.co-op-translator.json | 10 +- .../README.md | 762 ++++++++-------- translations/et/AGENTS.md | 398 ++++----- translations/et/README.md | 250 +++--- translations/pcm/.co-op-translator.json | 10 +- .../README.md | 620 +++++++------ translations/pcm/AGENTS.md | 226 ++--- translations/pcm/README.md | 175 ++-- translations/ta/.co-op-translator.json | 10 +- .../README.md | 845 +++++++++--------- translations/ta/AGENTS.md | 400 ++++----- translations/ta/README.md | 235 ++--- 12 files changed, 1980 insertions(+), 1961 deletions(-) diff --git a/translations/et/.co-op-translator.json b/translations/et/.co-op-translator.json index 280c6eb66..f55168672 100644 --- a/translations/et/.co-op-translator.json +++ b/translations/et/.co-op-translator.json @@ -1,7 +1,7 @@ { "1-getting-started-lessons/1-intro-to-programming-languages/README.md": { - "original_hash": "d45ddcc54eb9232a76d08328b09d792e", - "translation_date": "2026-01-08T10:00:49+00:00", + "original_hash": "bec5e35642176d9e483552bfc82996d8", + "translation_date": "2026-03-06T15:30:44+00:00", "source_file": "1-getting-started-lessons/1-intro-to-programming-languages/README.md", "language_code": "et" }, @@ -493,7 +493,7 @@ }, "AGENTS.md": { "original_hash": "a362efd06d64d4134a0cfe8515a86d34", - "translation_date": "2026-02-06T19:10:18+00:00", + "translation_date": "2026-03-06T15:39:39+00:00", "source_file": "AGENTS.md", "language_code": "et" }, @@ -516,8 +516,8 @@ "language_code": "et" }, "README.md": { - "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc", - "translation_date": "2026-02-06T19:03:47+00:00", + "original_hash": "a2c9eed480687319517c08a6319e5536", + "translation_date": "2026-03-06T15:26:27+00:00", "source_file": "README.md", "language_code": "et" }, diff --git a/translations/et/1-getting-started-lessons/1-intro-to-programming-languages/README.md b/translations/et/1-getting-started-lessons/1-intro-to-programming-languages/README.md index 73a09da2b..2a2029a78 100644 --- a/translations/et/1-getting-started-lessons/1-intro-to-programming-languages/README.md +++ b/translations/et/1-getting-started-lessons/1-intro-to-programming-languages/README.md @@ -1,97 +1,98 @@ -# Sissejuhatus programmeerimiskeeltesse ja kaasaegsesse arendustööriistadesse +# Sissejuhatus programmeerimiskeeltesse ja kaasaegsetesse arendustööriistadesse + +Tere, tulevane arendaja! 👋 Kas ma võin sulle midagi rääkida, mis paneb mind iga päev külmavärinaid saama? Sa oled peagi avastamas, et programmeerimine pole lihtsalt arvutite kohta – see on tõeliste supervõimete omandamine, et ellu viia oma metsikumaid ideid! -Tere tulemast, tulevane arendaja! 👋 Kas tohin sulle midagi rääkida, mis ikka veel igal päeval külmavärinaid tekitab? Sa oled just avastamas, et programmeerimine ei ole ainult arvutite jaoks – see on tegelike supervõimete omandamine oma metsikumaid ideid ellu viimiseks! +Sa tead seda hetke, kui kasutad oma lemmikrakendust ja kõik lihtsalt klapib täpselt? Kui vajutad nuppu ja midagi täiesti maagilist juhtub, mis paneb sind mõtlema „wow, kuidas nad SEDA tegid?” Noh, keegi täpselt nagu sina – tõenäoliselt istudes oma lemmikkohvikus kell 2 öösel oma kolmanda espresso kõrval – kirjutas selle võlu loova koodi. Ja siin on see, mis su mõistuse lööb: selle tunni lõpuks sa mitte ainult ei mõista, kuidas nad seda tegid, vaid sul on suur tahtmine seda ise proovida! -Sa tead seda hetke, kui kasutad oma lemmikrakendust ja kõik lihtsalt klapib täiesti täiuslikult? Kui vajutad nuppu ja juhtub midagi täiesti maagilist, mis paneb sind mõtlema "Wau, kuidas nad seda TEGID?" No keegi, kellel on sina moodi – tõenäoliselt oma lemmikkohvikus kell 2 öösel, joob oma kolmandat espresso – kirjutas just selle koodi, mis selle maagia lõi. Ja siin on see, mis su meeled pea peale pöörab: selle tunni lõpuks sa mitte ainult ei mõista, kuidas nemad seda tegid, vaid sul on ka isu ise proovida! +Kuula, ma saan täiesti aru, kui programmeerimine tundub praegu hirmutav. Kui ma alustasin, arvasin ausalt, et selleks peab olema mingi matemaatikageenius või olema koodinud alates viieaastasest. Aga siin on see, mis täielikult muutis mu perspektiivi: programmeerimine on täpselt nagu uue keele konversatsiooni õppimine. Sa hakkad öeldes „tere” ja „aitäh,” seejärel tellid kohvi, ja enne kui arvad, käid juba sügavaid filosoofilisi arutelusid! Ainult et siin vestled arvutitega ja ausalt? Nad on kõige kannatlikumad vestluskaaslased, kellega sul kunagi on vedanud – nad ei mõista kunagi su vigu hukka ja nad on alati elevil uuesti proovida! -Kuule, ma saan täiesti aru, kui programmeerimine tundub praegu hirmutav. Kui ma esimest korda alustasin, arvasin ausalt, et pead olema mingi matemaatikageenius või kodeerima hakkama juba viieaastaselt. Aga siin on see, mis mu vaatepunkti täiesti muutis: programmeerimine on täpselt nagu uue keele õppimine, et pidada vestlusi. Sa alustad "tere" ja "aitäh" sõnadega, siis jõuad kohvi tellimiseni ja enne kui aru saad, arutad sügavaid filosoofilisi teemasid! Ainult et siin räägid sa arvutitega, ja ausalt? Nemad on kõige kannatlikumad vestluspartnerid üldse – nad ei hinnangu sinu vigu ja on alati valmis uuesti proovima! - -Täna uurime uskumatuid tööriistu, mis teevad kaasaegse veebi arendamise mitte ainult võimalikuks, vaid väga sõltuvust tekitavaks. Räägin täpselt nendest samadest editoridest, brauseritest ja töövoogudest, mida kasutavad Netflixi, Spotify ja sinu lemmik sõltumatu rakenduse stuudio arendajad iga päev. Ja siin on osa, mis paneb sind rõõmust tantsima: enamik neist professionaalsest klassist ja tööstusharu standarditest tööriistadest on täiesti tasuta! +Täna uurime uskumatuid tööriistu, mis muudavad kaasaegse veebiarenduse mitte ainult võimalikuks, vaid lausa sõltuvust tekitavaks. Ma räägin täpselt samadest redaktoritest, brauseritest ja töövoogudest, mida Netflixi, Spotify ja su lemmiku indie-rakenduste stuudio arendajad kasutavad iga päev. Ja siin on see osa, mis paneb sind rõõmust tantsima: enamus neist professionaalse taseme, tööstusstandarditega tööriistadest on täiesti tasuta! ![Intro Programming](../../../../translated_images/et/webdev101-programming.d6e3f98e61ac4bff.webp) -> Sketchnote autor [Tomomi Imura](https://twitter.com/girlie_mac) +> Sketchnote autorilt [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid journey - title Teie programmeerimise teekond täna + title Teie programmeerimisteekond täna section Avastamine Mis on programmeerimine: 5: You Programmeerimiskeeled: 4: You Tööriistade ülevaade: 5: You section Uurimine - Koodiredaktorid: 4: You - Brauserid & DevTööriistad: 5: You + Koodi redaktorid: 4: You + Brauserid & arendajatööriistad: 5: You Käsklusrida: 3: You section Harjutamine - Keele detektiiv: 4: You + Keeledetektiiv: 4: You Tööriistade uurimine: 5: You - Kogukonnaga ühenduse loomine: 5: You + Ühiskonna ühendus: 5: You ``` ## Vaatame, mida sa juba tead! -Enne kui sukeldume lõbusasse ossa, olen uudishimulik – mida sa sellest programmeerimise maailmast juba tead? Ja kuule, kui sa vaatad neid küsimusi ja mõtled "mul pole sellest mitte vähimatki aimu", siis see ei ole mitte ainult okei, vaid ideaalne! See tähendab, et sa oled täiesti õiges kohas. Mõtle sellele viktoriinile nagu venitusele enne trenni – me lihtsalt soojendame neid ajulihaseid! +Enne kui sukeldume põnevasse maailma, olen uudishimulik – mida sa juba tead sellest programmeerimise maailmast? Ja kuula, kui sa vaatad neid küsimusi ja mõtled „mul pole tegelikult õrna aimugi,” siis see pole mitte ainult okei, see on ideaalne! See tähendab, et oled täiesti õiges kohas. Mõtle sellele viktoriinile kui soojendusele enne trenni – me soojendame lihtsalt neid aju lihaseid! + +[Osale eeltunnis viktoriinis](https://ff-quizzes.netlify.app/web/) -[Võta eelmise tunni viktoriin](https://forms.office.com/r/dru4TE0U9n?origin=lprLink) ## Seiklus, millele me koos asume -Ok, ma olen tõesti elevil selle üle, mida me täna avastame! Ausalt, ma sooviksin näha sinu nägu, kui mõned neist mõistetest klapivad. Siin on see uskumatu teekond, kuhu me koos läheme: +Okei, ma olen tõeliselt elevil selle üle, mida me täna uurime! Tõsiselt, sooviksin näha su nägu, kui mõned neist mõistetest lõpuks klapivad. Siin on uskumatult põnev teekond, millele me koos asume: -- **Mis programmeerimine tegelikult on (ja miks see on lahedaim asi üldse!)** – Avastame, kuidas kood on sõna otseses mõttes nähtamatu maagia, mis paneb sinu ümber kõik tööle, alates äratusest, mis kuidagi teab, et on esmaspäeva hommik, kuni algoritmini, mis ideaalselt kureerib sinu Netflixi soovitused -- **Programmeerimiskeeled ja nende hämmastavad isiksused** – Kujuta ette, et lähed peole, kus igaühel on täiesti erinevad supervõimed ja probleemide lahendamise viisid. Nii ongi programmeerimiskeelte maailm ja sulle meeldib neiga kohtuda! -- **Põhilised koostisosad, mis muudavad digitaalse maagia võimalikuks** – Mõtle neile kui ülimale loomingulisele LEGO komplektile. Kui sa mõistad, kuidas need tükid kokku sobivad, siis saad sõna otseses mõttes luua kõike, mida su fantaasia välja mõtleb -- **Professionaalsed tööriistad, mis panevad sind tundma nagu oleksid võlukepp kätte saanud** – Ma ei liialda siin – need tööriistad panevad sind tõesti tundma, nagu sul oleksid supervõimed, ja parim osa? Need on täpselt samad, mida tõsised proffid kasutavad! +- **Mis programmeerimine tegelikult on (ja miks see on kõige lahedam asi maailmas!)** – Avastame, kuidas kood on sõna otseses mõttes nähtamatu võlu, mis paneb kõike su ümber tööle, alates äratusest, mis kuidagi teab, et on esmaspäeva hommik, kuni algoritmini, mis täpselt kureerib su Netflixi soovitusi +- **Programmeerimiskeeled ja nende hämmastavad isiksused** – Kujuta ette, et sisened peole, kus igal inimesel on täiesti erinevad supervõimed ja probleemide lahendamise viisid. Selline on programmeerimiskeelte maailm ja sa armastad neid kohtuda! +- **Põhilised ehitusplokid, mis teevad digitaalse võlu võimalikuks** – Mõtle neile kui ülimale loomingulisele LEGO komplektile. Kui sa mõistad, kuidas need tükid kokku sobivad, märkad, et saad ehitada ükskõik mida, mida su kujutlusvõime unistab +- **Professionaalsed tööriistad, mis panevad sind tundma nagu oleksid just saanud võluri pulga kätte** – Ma pole draamategija – need tööriistad teevad sind tõesti tundma, nagu sul oleksid supervõimed, ja parim osa? Need on täpselt samad, mida kasutavad professionaalid! -> 💡 **Siin on asi**: Ära isegi mõtle kõike täna pähe õppida! Praegu tahan lihtsalt, et tunneksid seda põnevat sädet, mis väljendab kõike seda, mis võimalik on. Detailid tulevad loomulikult meelde, kui harjutame koos – nii õige õppimine käib! +> 💡 **Siin on asi**: Ära proovi kõike täna pähe õppida! Praegu tahan ainult, et tunneksid seda põnevuse sädet selle üle, mis on võimalik. Detailid jäävad loomulikult meelde, kui harjutame koos – nii toimub tõeline õppimine! -> Sa võid selle tunni võtta [Microsoft Learn’is](https://docs.microsoft.com/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon)! +> Sa võid selle tunni teha ka [Microsoft Learn'is](https://learn.microsoft.com/en-us/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon)! -## Misasi on programmeerimine täpsemalt? +## Niisiis, mis see *täpselt* programmeerimine on? -Okei, võtame käsile miljoni-dollarilise küsimuse: mis see programmeerimine tegelikult on? +Okei, võtame käsile miljonidollari küsimuse: mis see programmeerimine päriselt on? -Annan sulle loo, mis täiesti muutis mu mõtteviisi. Eelmisel nädalal proovisin emale seletada, kuidas kasutada meie uut nutikat teleri puldit. Leidsin end ütlemas asju nagu „Vajuta punast nuppu, aga mitte seda suurt punast nuppu, vaid väikest punast nuppu vasakul... ei, sinu teine vasak... okei, nüüd hoia seda kaks sekundit, mitte üks, mitte kolm...” Kas see kõlab tuttavalt? 😅 +Ma räägin sulle loo, mis täielikult muutis minu arusaama sellest. Eelmisel nädalal proovisin selgitada oma emale, kuidas kasutada meie uut nutikat teleri puldit. Ma tabasin end ütlemast asju nagu „Vajuta punast nuppu, aga mitte suurt punast nuppu, väikest punast nuppu vasakul... ei, su teist vasakut... okei, hoia seda nüüd kaks sekundit, mitte üks, mitte kolm...” Kõlab tuttavalt? 😅 -See ongi programmeerimine! See on kunst anda äärmiselt detailseid, samm-sammult juhiseid millelegi, mis on väga võimas, aga vajab kõike täpselt sõnastatult. Ainult et selle asemel, et seletada emale (kes võib küsida „milline punane nupp?!“), seletad sa arvutile (kes teeb täpselt, mida sa ütled, isegi kui see, mida sa ütlesid, pole päris see, mida sa mõtlesid). +See ongi programmeerimine! See on kunst anda äärmiselt detailseid, samm-sammult juhiseid millelegi, mis on väga võimas, aga vajab kõike väga täpselt välja kirjutatuna. Ainult et selle asemel, et seletada emale (kes võis küsida „millise punase nupu?!“), seletad arvutile (kes lihtsalt teeb täpselt seda, mida sa ütled, isegi kui see pole päriselt see, mida sa mõtlesid). -Siin on see, mis mind esimest korda uskumatult imestama pani: arvutid on sisuliselt üsna lihtsad. Nad mõistavad ainult kahte asja – 1 ja 0, mis on põhimõtteliselt „jah“ ja „ei“ või „sees“ ja „väljas“. See ongi kõik! Aga siin muutub asi maagiliseks – me ei pea rääkima 1-de ja 0-de keeles nagu The Matrix’is. Siin tulevad appi **programmeerimiskeeled**. Need on nagu parim tõlk maailmas, kes võtab sinu täiesti normaalsed inimmõtted ja tõlgib need arvuti keelde. +Siin on see, mis mind raputas, kui ma selle asja esimest korda õppisin: arvutid on tegelikult väga lihtsad oma olemuselt. Nad mõistavad sõna otseses mõttes ainult kahte asja – 1 ja 0, mis on põhimõtteliselt „jah“ ja „ei“ või „sees“ ja „väljas“. See on kõik! Aga siin muutub see maagiliseks – me ei pea rääkima ainult 1-des ja 0-des nagu me oleksime Matrixis. Siin tulevad appi **programmeerimiskeeled**. Need on nagu maailma parim tõlk, kes võtab su täiesti normaalsed inimmõtted ja tõlgib need arvuti keelde. -Ja siin on see, mis annab mulle igal hommikul tegelikult külmavärinad: sõna otseses mõttes *kõik* digitaalne sinu elus algas kellegagi nagu sina, tõenäoliselt pidžaamas, kohvitassi kõrval, tippimas koodi oma sülearvutisse. See Instagrami filter, mis paneb sind ideaalsena välja nägema? Keegi kirjutas selle koodi. Soovitus, mis viis sind su uue lemmiklauluni? Arendaja ehitas selle algoritmi. Rakendus, mis aitab sul sõpradega õhtusöögi arveid jagada? Jep, keegi mõtles „see on tüütu, ma arvan, et suudan selle parandada“ ja siis... nad tegidki seda! +Ja siin on see, mis paneb mind iga hommik ärgates ikka külmavärinaid saama: sõna otseses mõttes *kõik* digitaalne sinu elus algas kellegi täpselt nagu sina poolt, tõenäoliselt istudes oma pidžaamas kohvitassi kõrval ja toksides koodi sülearvutis. See Instagrami filter, mis paneb sind ideaalsena välja nägema? Keegi kirjutas selle koodi. Soovitus, mis viis sind sinu uue lemmiklauluni? Üks arendaja ehitas selle algoritmi. Rakendus, mis aitab sõpradega õhtusöögi arve jagada? Jep, keegi mõtles „see on tüütu, ma võiksin selle korda teha“ ja siis... ta tegigi! -Kui õpid programmeerima, ei omanda sa mitte ainult uut oskust – sa muutud osaks sellest uskumatust probleemilahendajate kogukonnast, kes veedavad oma päevi mõeldes: „Mis oleks, kui saaksin midagi ehitada, mis teeb kellegi päeva lihtsalt natuke paremaks?“ Ausalt, kas midagi lahedamat ongi olemas? +Kui õpid programmeerima, ei omanda sa lihtsalt uut oskust – sa saad osaks sellest uskumatu probleemide lahendajate kogukonnast, kes veedavad oma päevi mõeldes: „Mis siis, kui ma looksin midagi, mis teeb kellegi päeva natuke paremaks?“ Ausõna, kas on midagi lahedamat kui see? -✅ **Lõbus faktide otsing**: Siin on midagi väga lahedat, mida võid otsida, kui on vaba hetk – kes sa arvad oli maailma esimene arvutiprogrammeerija? Ma annan vihje: see ei pruugi olla see, keda sa ootad! Selle inimese lugu on absoluutselt põnev ja näitab, et programmeerimine on alati olnud loov probleemilahendus ja kastist välja mõtlemine. +✅ **Lõbus faktihunt**: Siin on midagi väga lahedat, mida saad uurida, kui sul on vaba hetk – kes oli sinu arvates maailma esimene arvutiprogrammeerija? Ma annan sulle vihje: see ei pruugi olla see, keda sa ootad! Selle inimese lugu on tõeliselt põnev ja näitab, et programmeerimine on alati olnud loominguline probleemide lahendamine ja kastist välja mõtlemine. -### 🧠 **Kiirülevaade: Kuidas Sul läheb?** +### 🧠 **Peatus: Kuidas sa end tunned?** -**Võta hetk, et reflekteerida:** -- Kas mõte "arvutitele juhiste andmisest" tundub nüüd arusaadav? -- Kas tead mõnda igapäevast ülesannet, mida tahaksid programmeerimise abil automatiseerida? -- Millised küsimused sul selles programmeerimise teemas praegu kerkivad? +**Võta hetk, et mõelda:** +- Kas idee „anda arvutile juhiseid“ on nüüd arusaadav? +- Kas suudad mõelda igapäevasele tegevusele, mida sooviksid programmeerimisega automatiseerida? +- Millised küsimused sul programmeerimisest praegu mõtteis keerlevad? -> **Pea meeles**: On täiesti normaalne, kui mõned mõisted tunduvad praegu ebaselged. Programmeerimise õppimine on nagu uue keele õppimine – ajul kulub aega, et luua need närvivõrgud. Sa teed suurepärast tööd! +> **Mäleta**: On täiesti normaalne, kui mõned mõisted tunduvad praegu ähmased. Programmeerimist õppida on nagu uut keelt õppida – aju vajab aega, et luua närvivõrgustikke. Sa lähed väga hästi! ## Programmeerimiskeeled on nagu erinevad maagia maitsed -Ok, see võib kõlada veidralt, aga kuula mind – programmeerimiskeeled on väga sarnased erinevatele muusikastiilidele. Mõtle sellele: on jazz, mis on sujuv ja improvisatoorne; rock, mis on võimas ja otsekohene; klassika, mis on elegantne ja struktureeritud; ja hip-hop, mis on loominguline ja väljendusrikas. Igal stiilil on oma vibe, oma kirglike fännide kogukond ja igaüks sobib erinevatele meeleoludele ja sündmustele. +Okei, see kõlab veidralt, aga jää minuga – programmeerimiskeeled on väga sarnased muusika erinevate žanritega. Mõtle sellele: sul on džäss, mis on sujuv ja improviseeriv, rock, mis on võimas ja otsekohene, klassikaline, mis on elegantne ja struktureeritud, ning hip-hop, mis on loov ja väljendusrikas. Igal stiilil on oma tuju, oma kirglike fännide kogukond ja igaüks sobib erinevateks hetkeks ja meeleoludeks. -Programmeerimiskeeled töötavad täpselt samamoodi! Sa ei kasutaks sama keelt, et teha lõbusat mobiilimängu, mida kasutad tohutu kliimaandmete töötlemiseks, just nagu sa ei mängiks death metali joogaklassis (no, enamasti mitte! 😄). +Programmeerimiskeeled toimivad täpselt samamoodi! Sa ei kasuta sama keelt lõbusa mobiilimängu ehitamiseks, mida kasutaksid tohutute kliimandmete arvutamiseks, just nagu sa ei mängiks death metal'i joogatunnis (noh, enamikes joogatundides kindlasti mitte! 😄). -Aga siin on see, mis mind iga kord täielikult hämmastab: need keeled on nagu kõige kannatlikumad ja geniaalsemad tõlgid maailmas, kes istuvad su kõrval. Sa saad väljendada oma ideid viisil, mis tundub loomulik sinu inimese ajule, ja nemad teevad kogu uskumatult keeruka töö selle tõlkimisel 1-deks ja 0-deks, mida arvutid tõesti räägivad. See on nagu sõber, kes on täiesti ladus mõlemas – „inimloomingus“ ja „arvutilogikas“ – ja ta ei väsigi kunagi, ei vaja kohvipause ega mõista sind hukka, kui küsid sama küsimust kaks korda! +Aga siin on see, mis mind iga kord täiesti mõistust võtab: need keeled on nagu kõige kannatlikumad ja geniaalsemad tõlkijad maailmas, kes istuvad su kõrval. Sa saad väljendada oma ideid viisil, mis tundub loomulik su inimmõistusele, ja nemad teevad kogu väga keeruka töö, et tõlkida see 1-ks ja 0-ks, mida arvutid tegelikult räägivad. See on nagu sõber, kes on täiuslikult kahe keele – „inimloovuse“ ja „arvutilogiika“ – valdamises, ja ta ei väsi kunagi, ei vaja kohvipause ega mõista sind hukka, kui küsid sama küsimust kaks korda! -### Populaarsed programmeerimiskeeled ja nende kasutusvaldkonnad +### Populaarsed programmeerimiskeeled ja nende kasutusalad ```mermaid mindmap root((Programmeerimiskeeled)) Veebiarendus JavaScript - Esiplaanimaagia + Frontendi Võlud Interaktiivsed Veebisaidid TypeScript JavaScript + Tüübid - Ettevõtete Rakendused - Andmed & tehisintellekt + Ettevõtte Rakendused + Andmed & TE Python Andmeteadus Masinõpe @@ -107,54 +108,54 @@ mindmap iOS Apple Ökosüsteem Kotlin - Kaasaegne Android + Moodne Android Platvormideülene - Süsteemid & Jõudlus + Süsteemid & Tulemuslikkus C++ Mängud - Jõudluskriitiline + Tulemuslikkusele Oluline Rust Mälu Turvalisus - Süsteemi Programmeerimine + Süsteemiprogrammeerimine Go Pilveteenused - Mõõdetav Tagatise + Skaalautuv Tagaplaan ``` -| Keel | Parim milleks | Miks on populaarne | -|------|---------------|-------------------| -| **JavaScript** | Veebiarendus, kasutajaliidesed | Töötab brauserites ja juhib interaktiivseid veebilehti | -| **Python** | Andmeteadus, automatiseerimine, tehisintellekt | Lihtne lugeda ja õppida, võimsad teegid | -| **Java** | Ettevõtte rakendused, Androidi rakendused | Platvormist sõltumatu, usaldusväärne suurte süsteemide jaoks | +| Keel | Parim kasutusala | Miks see on populaarne | +|----------|----------|------------------| +| **JavaScript** | Veebiarendus, kasutajaliidesed | Jookseb brauserites ja paneb tööle interaktiivsed veebilehed | +| **Python** | Andmeteadus, automaatika, tehisintellekt | Lihtne lugeda ja õppida, võimsad teegid | +| **Java** | Ettevõtte rakendused, Androidi rakendused | Platvormiülene, tugev suurtele süsteemidele | | **C#** | Windowsi rakendused, mänguarendus | Tugev Microsofti ökosüsteemi tugi | -| **Go** | Pilveteenused, backend süsteemid | Kiire, lihtne, loodud kaasaegse arvutustöö jaoks | +| **Go** | Pilveteenused, tagapõhjasüsteemid | Kiire, lihtne, loodud kaasaegseks arvutamiseks | -### Kõrgetasemelised vs madalamatasemelised keeled +### Kõrgtaseme vs madalatasemel keeled -Ok, see oli ausalt öeldes see mõiste, mis mu aju murdis, kui ma esimest korda õppisin, nii et ma jagan võrdlust, mis lõpuks selle minu jaoks selgeks tegi – ja ma tõesti loodan, et see aitab ka sind! +Okei, see oli ausalt see mõiste, mis mu aju murdis, kui ma õppima hakkasin, nii et jagan analoogiat, mis lõpuks mu jaoks kõik klappis – ja loodan väga, et see aitab ka sind! -Kujuta ette, et sa reisisid riiki, kus sa ei räägi keelt ja sul on hädasti vaja leida lähim tualett (me oleme kõik sellises olukorras olnud, eks? 😅): +Kujuta ette, et sa oled riigis, kus sa keelt ei räägi ja sul on väga kiireks vaja leida lähim tualett (me oleme kõik seda kogenud, eks? 😅): -- **Madalatase programmeerimine** on nagu kohalikku murret nii hästi õppida, et saad vestelda vanaemaga, kes müüb nurgal puuvilju, kasutades kultuurilisi viiteid, kohalikke slängisõnu ja sise nalju, mida mõistab ainult keegi, kes seal üles kasvanud on. Väga muljetavaldav ja uskumatult efektiivne... kui sa just oled selles täiesti sorav! Aga üsna üle jõu käiv, kui sa lihtsalt otsid tualetti. +- **Madalatasemeline programmeerimine** on nagu õppida nii hästi kohaliku murret, et saad vestelda vanaemaga, kes müüb nurgatänaval puuvilju, kasutades kultuuriviiteid, kohalikku slängi ja nali, mida mõistaks vaid keegi, kes seal kasvas. Väga muljetavaldav ja äärmiselt tõhus... kui sul kogemusi on! Aga üsna üle jõu käiv, kui sa lihtsalt püüad tualetti leida. -- **Kõrgetase programmeerimine** on nagu sul oleks see imeline kohalik sõber, kes lihtsalt mõistab sind. Sa võid öelda lihtsalt inglise keeles „Ma tõesti pean tualetti minema“, ja tema teeb kogu kultuurilise tõlke ning annab sulle juhised viisil, mis mõistab su mitte-kohalik aju täiuslikult. +- **Kõrgtaseme programmeerimine** on nagu see hämmastav kohalik sõber, kes lihtsalt saab su mõttest aru. Sa ütled otse inglise keeles „Ma tõesti pean tualetti leidma“ ja tema teeb kogu kultuurilise tõlke ning annab sulle juhised viisil, mis mõistab su mitte-kohalik aju täielikult. -Programmeerimise mõistes: -- **Madala taseme keeled** (nagu Assembly või C) lubavad sul pidada uskumatult detailseid vestlusi arvuti enda riistvaraga, aga sa pead mõtlema nagu masin, mis on... noh, ütleme nii, üsna suur vaimne hüpe! -- **Kõrgetase keeled** (nagu JavaScript, Python või C#) lubavad sul mõelda nagu inimene, samal ajal kui nad tegelevad kogu masinakõnega taga. Lisaks on neil imelised toetavad kogukonnad täis inimesi, kes mäletavad, kuidas on olla algaja, ja tõesti tahavad aidata! +Programmeerimise keeles: +- **Madalatasemel keeled** (nagu Assembly või C) lubavad sul arutada väga detailsetel teemadel arvuti riistvaraga, aga sa pead mõtlema nagu masin, mis on... no öelgem nii, et see on suur vaimne hüpe! +- **Kõrgtasemel keeled** (nagu JavaScript, Python või C#) lubavad sul mõelda nagu inimene, samal ajal kui nad teevad kogu masinakeele taga töötleva töö. Pealegi on neil imelised toetavad kogukonnad täis inimesi, kes mäletavad, mida tähendab olla algaja ja kes tõesti tahavad aidata! -Arva ära, milliseid ma võiksin soovitada alustuseks? 😉 Kõrgetasemelised keeled on nagu abiratastega jalgratas, mida sa tegelikult iialgi maha võtta ei taha, sest see muudab kogu kogemuse palju nauditavamaks! +Aru saad, milliseid ma soovitan alustada? 😉 Kõrgtasemel keeled on nagu treeningratastega jalgratas, mida sa tegelikult ei taha kunagi eemaldada, sest need muudavad kogu kogemuse nii mõnusaks! ```mermaid flowchart TB - A["👤 Inimese mõte:
'Ma tahan arvutada Fibonacci numbreid'"] --> B{Vali keeltee tase} + A["👤 Inimese mõte:
'Ma tahan arvutada Fibonacci arve'"] --> B{Vali keeltesäte} - B -->|Kõrgtase| C["🌟 JavaScript/Python
Lihtne lugeda ja kirjutada"] - B -->|Alamtase| D["⚙️ Assembly/C
Otsene riistvara juhtimine"] + B -->|Kõrgetasemeline| C["🌟 JavaScript/Python
Lihtne lugeda ja kirjutada"] + B -->|Madalatase| D["⚙️ Assembly/C
Otsene riistvara kontroll"] C --> E["📝 Kirjuta: fibonacci(10)"] D --> F["📝 Kirjuta: mov r0,#00
sub r0,r0,#01"] - E --> G["🤖 Arvuti aru saamine:
Tõlk käsitleb keerukust"] + E --> G["🤖 Arvuti mõistmine:
Tõlkija käsitleb keerukust"] F --> G G --> H["💻 Sama tulemus:
0, 1, 1, 2, 3, 5, 8, 13..."] @@ -163,18 +164,18 @@ flowchart TB style D fill:#fff3e0 style H fill:#e8f5e8 ``` -### Las ma näitan, miks kõrgetasemelised keeled on palju sõbralikumad +### Näitan sulle, miks kõrgtasemel keeled on palju sõbralikumad -Okei, näitan sulle midagi, mis täiuslikult demonstreerib, miks ma armusin kõrgetasemeliste keeltesse, aga esmalt palun ma midagi. Kui näed esimest koodinäidet, ära ehmu! See peakski tunduma hirmutav. Täpselt seda ma tahan öelda! +Okei, ma näitan sulle midagi, mis täiesti demonstreerib, miks ma armusin kõrgtaseme keeltesse, aga kõigepealt – ma tahan, et lubaksid mulle üht asja. Kui sa näed esimest koodinäidet, ära pabista! See peabki esialgu tunduma hirmutav. Täpselt selle peale ma rõhutan! -Vaatame täpselt sama ülesannet kirjutatuna kahes täiesti erinevas stiilis. Mõlemad loovad nn Fibonacci jada – see on ilus matemaatiline muster, kus iga number on kahe eelneva summa: 0, 1, 1, 2, 3, 5, 8, 13... (Lõbus fakt: seda mustrit leiad sõna otseses mõttes kõikjalt loodusest – päevalille seemnete spiraalid, käbide mustrid, isegi galaktikate kujunemine!) +Vaatame täpselt sama ülesannet, mis on kirjutatud kahel täiesti erineval moel. Mõlemad loovad Fibonacci jada – see on ilus matemaatiline muster, kus iga number on kahe eelneva summa: 0, 1, 1, 2, 3, 5, 8, 13... (Lõbus fakt: seda mustrit leiad sõna otseses mõttes kõikjalt loodusest – päevalille seemnete spiraalid, männikäbide mustrid, isegi galaktikate moodustumine!) -Valmis nägema erinevust? Läheme! +Valmis erinevust nägema? Lähme! -**Kõrgetasemeline keel (JavaScript) – inimloetav:** +**Kõrgtasemel keel (JavaScript) – Inimeste-sõbralik:** ```javascript -// 1. samm: Põhiline Fibonacci seadistus +// Samm 1: Põhiline Fibonacci seadistus const fibonacciCount = 10; let current = 0; let next = 1; @@ -182,32 +183,32 @@ let next = 1; console.log('Fibonacci sequence:'); ``` -**Mis see kood teeb:** -- **Määrab** konstantse väärtuse, kui palju Fibonacci numbreid soovime genereerida -- **Algatab** kaks muutujat, et jälgida jada praegust ja järgmist numbrit -- **Seab** algväärtused (0 ja 1), mis määratlevad Fibonacci mustri -- **Kuvab** päise, et meie väljund oleks äratuntav +**See kood teeb järgnevat:** +- **Deklaratsioonib** konstanti, et määratleda, kui palju Fibonacci numbreid tahame genereerida +- **Algatab** kaks muutujat, et jälgida järjestuse praegust ja järgmist numbrit +- **Seab** algväärtused (0 ja 1), mis defineerivad Fibonacci mustri +- **Kuvab** pealkirja sõnumi väljundi identifitseerimiseks ```javascript -// 2. samm: Järjestuse genereerimine tsükli abil +// Samm 2: Järjestuse genereerimine tsükliga for (let i = 0; i < fibonacciCount; i++) { console.log(`Position ${i + 1}: ${current}`); - // Arvuta järjestuse järgmine number + // Arvuta järgmine arv jadas const sum = current + next; current = next; next = sum; } ``` -**Mis siin juhtub:** -- **Käivitab** tsükli iga positsiooni jaoks jadast `for` tsükli abil -- **Kuvab** iga numbri koos selle positsiooniga, kasutades malliteksti vormindust -- **Arvutab** järgmise Fibonacci numbri, liites praeguse ja järgmise väärtuse -- **Uuendab** meie jälgimismuutujaid, et minna järgmisele iteratsioonile +**Mis siin toimub:** +- **Tsüklitame** järjestuse kõiki positsioone kasutades `for` tsüklit +- **Kuvame** iga numbri koos asukohaga, kasutades mallstringe +- **Arvutame** järgmise Fibonacci numbri praeguse ja järgmise summa abil +- **Uuendame** jälgivaid muutujaid, et liikuda järgmise iteratsiooni juurde ```javascript -// 3. samm: Kaasaegne funktsionaalne lähenemine +// 3. samm: Moodne funktsionaalne lähenemine const generateFibonacci = (count) => { const sequence = [0, 1]; @@ -224,12 +225,12 @@ console.log(fibSequence); ``` **Ülal oleme:** -- **Loonud** taaskasutatava funktsiooni kaasaegse noolefunktsiooni süntaksiga -- **Koostanud** massiivi, et salvestada täielik jada, selle asemel, et kuvada ükshaaval -- **Kasutanud** massiivi indekseerimist, et arvutada iga uus number eelmiste väärtuste põhjal -- **Tagastanud** terve jada, et seda saaks paindlikult kasutada programmis muudes osades +- **Loomis** taaskasutatavat funktsiooni, kasutades kaasaegset noolefunktsiooni süntaksit +- **Ehitanud** massiivi, mis salvestab kogu jadana selle asemel, et kuvada ükshaaval +- **Kasutanud** massiivi indeksit, et arvutada iga uus arv eelnevate põhjal +- **Tagastanud** kogu jada, et seda saaks paindlikult kasutada programmis muudes osades -**Madalatase keel (ARM Assembly) – arvutile sobiv:** +**Madalatasemeline keel (ARM Assembly) – Arvuti-sõbralik:** ```assembly area ascen,code,readonly @@ -256,39 +257,39 @@ back add r0,r1 end ``` -Pane tähele, kuidas JavaScripti versioon loeb peaaegu nagu ingliskeelsed juhised, samas kui Assembly versioon kasutab krüptilisi käske, mis otse kontrollivad arvuti protsessorit. Mõlemad täidavad täpselt sama ülesannet, aga kõrgetasemeline keel on inimestele palju lihtsam mõista, kirjutada ja hooldada. +Tähtis märgata, kuidas JavaScripti versioon loeb peaaegu nagu ingliskeelsed juhised, samas kui Assembly versioon kasutab krüptilisi käske, mis juhivad otse arvuti protsessorit. Mõlemad täidavad täpselt sama ülesande, kuid kõrgtasemel keel on inimestele palju kergemini mõistetav, kirjutatav ja hooldatav. -**Peamised erinevused, mis silma jäävad:** -- **Lugemismugavus**: JavaScript kasutab kirjeldavaid nimesid nagu `fibonacciCount`, Assembly aga krüptilisi silte nagu `r0`, `r1` -- **Kommentaarid**: Kõrgema taseme keeled soodustavad selgitavate kommentaaride kirjutamist, mis muudavad koodi isedokumenteerivaks -- **Struktuur**: JavaScripti loogiline voog peegeldab seda, kuidas inimesed probleemidele samm-sammult mõtlevad +**Peamised erinevused, mida märkad:** +- **Lugemisvõime**: JavaScript kasutab kirjeldavaid nimesid nagu `fibonacciCount`, samal ajal kui Assembly kasutab krüptilisi silte nagu `r0`, `r1` +- **Kommentaarid**: Kõrgtasemel keeltes julgustatakse seletavaid kommentaare, mis muudavad koodi isedokumenteerivaks +- **Struktuur**: JavaScripti loogiline voog järgib seda, kuidas inimesed mõtlevad probleemide peale samm-sammult - **Hooldus**: JavaScripti versiooni uuendamine erinevate nõudmiste jaoks on lihtne ja selge -✅ **Fibonacci jada kohta**: See täiesti vapustav numbrimuster (kus iga number on kahe eelneva summa: 0, 1, 1, 2, 3, 5, 8...) ilmub sõna otseses mõttes *kõikjal* looduses! Leiad selle päevalille spiraalidest, männikoore mustritest, nautiluse kestade kumerusest ja isegi sellest, kuidas puud harunevad. On üsna pea meelt muutv, kuidas matemaatika ja kood aitavad meil mõista ja luua looduses esinevaid mustreid, mida kasutatakse ilu loomisel! +✅ **Fibonacci jada kohta**: See tõeliselt kaunis numbrimuster (kus iga number on kahe eelneva summa: 0, 1, 1, 2, 3, 5, 8...) esineb sõna otseses mõttes *kõigis* looduses! Leiad seda päevalille keeristes, männikäbide mustrites, nutilusete kooriku kumeruses ja isegi puuharude kasvus. On üsna hämmastav, kuidas matemaatika ja kood aitavad meil mõista ja taastoota mustreid, mida loodus kasutab ilu loomisel! -## Ehitusplokid, mis teevad võlu ära +## Ehitusplokid, mis teevad maagia võimalikuks -Hea küll, nüüd kui sa nägid, millisena programmeerimiskeeled tegelikult välja näevad, vaatame lahti põhilised komponendid, millest koosneb sõna otseses mõttes iga kunagi kirjutatud programm. Mõtle neile nagu olulistele koostisosadele oma lemmikretseptis – kui saad aru, mida igaüks teeb, saad lugeda ja kirjutada koodi peaaegu mis tahes keeles! +Ok, nüüd, kui oled näinud, kuidas programmeerimiskeeled toimivad praktikas, vaatame põhiosasid, mis moodustavad sõna otseses mõttes iga kirjutatud programmi. Mõtle neile kui olulistele koostisosadele sinu lemmikretseptis – kui sa mõistad, mida igaüks teeb, suudad lugeda ja kirjutada koodi peaaegu igas keeles! -See on natuke nagu programmeerimise grammatikat õppida. Mäletad koolist, kui õppisid nimisõnu, tegusõnu ja seda, kuidas lauseid kokku panna? Programmeerimisel on oma grammatika ja ausalt öeldes on see palju loogilisem ja andestavam kui inglise keel kunagi oli! 😄 +See on veidi nagu programmeerimise grammatika õppimine. Mäletad koolist, kui õppisid nimisõnu, tegusõnu ja kuidas lauseid kokku panna? Programmeerimisel on oma grammatika versioon, ja ausalt öeldes on see palju loogilisem ja andestavam kui inglise keele grammatika kunagi oli! 😄 -### Lausekanded: samm-sammulised juhised +### Avaldused: Juhised samm-sammult -Alustame **lausekannetest** – need on nagu üksikud laused vestluses arvutiga. Iga lause ütleb arvutile, et see teeb ühe konkreetse asja, nagu juhiste andmine: „Pööra siin vasakule,“ „Peatu punase tule juures,“ „Parki sinna kohta.“ +Alustame **avaldustest** – need on nagu üksikud laused vestluses arvutiga. Iga avaldus käsib arvutil teha üht konkreetset asja, nagu juhiste andmine: "Pööra siin vasakule," "Peatu punase tule juures," "Parki sinna kohta." -Mulle meeldib lausekannete juures, kui loetavad need tavaliselt on. Vaata seda: +Mulle meeldib avalduste puhul eriti see, kui loetavad nad tavaliselt on. Vaata seda: ```javascript -// Põhilised avaldused, mis täidavad ühekordseid toiminguid +// Põhilised avaldused, mis teevad ühe toimingu const userName = "Alex"; console.log("Hello, world!"); const sum = 5 + 3; ``` -**See kood teeb järgmist:** -- **Deklarerib** konstandi, kuhu salvestatakse kasutaja nimi -- **Kuvab** tervitussõnumi konsooli väljundis +**Mis see kood teeb:** +- **Deklareerib** konstantsena muutuja, kuhu salvestatakse kasutaja nimi +- ** Kuvab** tervitussõnumi konsoolil - **Arvutab** ja salvestab matemaatilise operatsiooni tulemuse ```javascript @@ -297,36 +298,36 @@ document.title = "My Awesome Website"; document.body.style.backgroundColor = "lightblue"; ``` -**Samm-sammult toimub järgmist:** -- **Muudab** veebilehe pealkirja, mis ilmub brauseri vahekaardil -- **Muudab** kogu lehe taustavärvi +**Samm-sammult, mis toimub:** +- **Muudab** veebilehe tiitlit, mis kuvatakse brauseri vahekaardil +- **Muutab** kogu lehe keha taustavärvi -### Muutujad: su programmi mälusüsteem +### Muutujad: Sinu programmi mälu süsteem -Olgu, **muutujad** on ausalt öeldes üks mu lemmikkontseptsioone õpetada, sest need on nii sarnased asjadele, mida sa juba iga päev kasutad! +Olgu, **muutujad** on ausalt öeldes üks minu lemmikkontseptsioone õpetada, sest need on väga sarnased asjadele, mida sa kasutad iga päev! -Mõtle natuke oma telefoni kontaktide loendile. Sa ei mäleta kõigi telefoninumbreid – selle asemel salvestad „Ema,“ „Parim sõber“ või „Pitsa koht, mis toob kuni kella 2-ni“ ja laseb telefonil numbrid meeles hoida. Muutujad töötavad täpselt nii! Need on kui sildiga konteinerid, kuhu su programm saab infot salvestada ja hiljem nime abil tagasi võtta. +Mõtle hetkeks oma telefoni kontaktidele. Sa ei õpi kõigi numbreid pähe – selle asemel salvestad "Ema," "Parim sõber" või "Pizzakoht, mis toob kuni kella 2-ni" ja las telefon mäletab tegelikke numbreid. Muutujad töötavad täpselt samamoodi! Need on nagu sildistatud anumad, kuhu su programm saab salvestada informatsiooni ja hiljem seda nime abil hõlpsalt leida. -See, mis on tõeliselt lahe: muutujad võivad su programmi käigus muutuda (seetõttu ongi nimi "muutuja" – näed, kuidas nad selle välja mõtlesid?). Nii nagu sa ehk värskendad pitsakoha kontakti, kui avastad veel parem koha, saab muutujaid uuendada, kui su programm õpib uut infot või olukorrad muutuvad! +Siin on see tõeliselt lahe: muutujad võivad programmi jooksu ajal muutuda (seetõttu nimi "muutuja" – näed, mis nad tegid?). Nagu sa võid uuendada pizzakoha kontakti, kui avastad mõne veel parema, võivad muutujad muutuda, kui su programm saab uut teavet või olukord muutub! -Lubage mul näidata, kui kaunilt lihtne see võib olla: +Las ma näitan, kui ilusasti lihtne see võib olla: ```javascript -// Samm 1: Põhimuutujate loomine +// 1. samm: Põhiliste muutujate loomine const siteName = "Weather Dashboard"; let currentWeather = "sunny"; let temperature = 75; let isRaining = false; ``` -**Nende kontseptsioonide mõistmine:** -- **Salvestada** muutumatud väärtused `const` muutujatesse (näiteks saidi nimi) -- **Kasutada** `let` väärtuste jaoks, mis võivad programmi jooksul muutuda -- **Määrata** erinevaid andmetüüpe: stringid (tekst), numbrid ja boole'id (true/false) -- **Valida** kirjeldavad nimed, mis selgitavad, mida iga muutuja sisaldab +**Nende mõistete mõistmine:** +- **Salvesta** muutumatud väärtused `const` muutujatesse (näiteks saidi nimi) +- **Kasuta** `let` väärtuste jaoks, mis võivad programmi jooksul muutuda +- **Määra** erinevaid andmetüüpe: stringid (tekst), numbrid ja booleanid (true/false) +- **Vali** kirjeldavad nimed, mis selgitavad, mida iga muutuja sisaldab ```javascript -// Samm 2: Objektidega töötamine seotud andmete grupeerimiseks +// Samm 2: Objektidega töötamine seotud andmete rühmitamiseks const weatherData = { location: "San Francisco", humidity: 65, @@ -334,10 +335,10 @@ const weatherData = { }; ``` -**Ülaltoodud juhtumil oleme:** -- **Loonud** objekti, et grupeerida seotud ilmainfot kokku -- **Korraldanud** mitu andmeosa ühe muutuja nime alla -- **Kasutanud** võtme-väärtuse paare, et selgelt märgistada iga infoosa +**Ülal oleme:** +- **Loonud** objekti, mis grupeerib seotud ilmastikuinfo kokku +- **Korraldanud** mitu andmeosist ühe muutuja nime alla +- **Kasutanud** võtme-väärtuse paare, et selgelt sildistada iga info osa ```javascript // Samm 3: Muutujate kasutamine ja uuendamine @@ -349,32 +350,32 @@ currentWeather = "cloudy"; temperature = 68; ``` -**Mõistame iga osa:** -- **Kuvame** infot, kasutades malliliideseid `${}` süntaksiga -- **Juurdepääs** objekti omadustele punktnotatsiooni abil (`weatherData.windSpeed`) -- **Uuendame** `let`iga deklareeritud muutujaid, et kajastada muutuvaid tingimusi -- **Kombineerime** mitut muutujat mõtestatud sõnumite loomiseks +**Selgitame iga osa:** +- **Kuva** infot mallimustritega `${}` süntaksis +- **Juurdu pääsema** objekti omadustele punksümboli (`weatherData.windSpeed`) abil +- **Uuenda** `let`-iga deklareeritud muutujaid, et kajastada muutuvaid tingimusi +- **Kombineeri** mitut muutujat tähenduslike sõnumite loomiseks ```javascript -// Samm 4: Kaasaegne destruktureerimine puhtama koodi jaoks +// Samm 4: Moodne destruktureerimine puhtama koodi jaoks const { location, humidity } = weatherData; console.log(`${location} humidity: ${humidity}%`); ``` -**Mida vaja teada:** -- **Eralda** kindlad omadused objektidest destruktureeriva määramisega -- **Loo** uued muutujad automaatselt samade nimedega nagu objekti võtmed -- **Lihtsusta** koodi, vältides korduvat punktnotatsiooni +**Mida pead teadma:** +- **Eralda** objekti omadusi, kasutades destruktureerivat määramist +- **Loo** automaatselt uusi muutujaid samade nimedega nagu objekti võtmed +- **Lihtsusta** koodi vältides korduvat punksümboli kasutamist -### Juhtimisvoog: õpeta oma programm mõtlema +### Kontrollvoog: Õpi oma programm mõtlema -Hea küll, siin muutub programmeerimine täiesti pea raputavaks! **Juhtimisvoog** on põhimõtteliselt õpetamine, kuidas su programm teeb nutikaid otsuseid, täpselt nii nagu sina iga päev ilma mõtlemata teed. +Ok, siin muutub programmeerimine täiesti vapustavaks! **Kontrollvoog** tähendabki õpetamist sinu programmile, kuidas teha nutikaid otsuseid, täpselt nii nagu sina seda iga päev ilma mõtlemata teed. -Kujuta ette: täna hommikul tegid sa tõenäoliselt midagi sellist: „Kui sajab, võtan kaasa vihmavarju. Kui on külm, panen jope selga. Kui hilinen, jätan hommikusöögi vahele ja võtan kohvi kaasa.“ Su aju järgib loomulikult seda kui-siis loogikat korduvalt päevas! +Kujutle: täna hommikul läksid läbi midagi sellist nagu "Kui sajab, võtan vihmavarju. Kui on külm, panen jope selga. Kui hilinen, jätan hommikusöögi vahele ja võtan kohvi teel." Su aju järgib loogikat "kui-siis" tosinatel kordadel päevas! -See teebki programmidest tundele nutikad ja elavad, mitte lihtsalt igavat, ennustatavat stsenaariumit järgivad. Nad suudavad olukorda vaadata, hinnata, mis toimub ja vastavalt reageerida. See on nagu anda su programmile aju, mis suudab kohaneda ja valikuid teha! +See on põhjus, miks programmid tunduvad targad ja elavad, mitte lihtsalt jälgivad igavat, etteaimatavat stsenaariumi. Nad saavad olukorda analüüsida, hinnata toimuvat ja vastata sobivalt. See on nagu anda sinu programmile aju, mis kohaneb ja teeb valikuid! -Tahad näha, kuidas see kaunilt toimib? Lubage mul näidata: +Tahad näha, kuidas see kenasti töötab? Näitan sulle: ```javascript // Samm 1: Põhiline tingimusloogika @@ -388,14 +389,14 @@ if (userAge >= 18) { } ``` -**See kood teeb järgmist:** -- **Kontrollib**, kas kasutaja vanus vastab hääletamise nõuetele -- **Täidab** erinevaid koodiblokke vastavalt tingimuse tulemusele -- **Arvutab** ja kuvab, kui kaua on veel jäänud hääletamisõiguse saavutamiseni, kui alla 18 -- **Annan** iga stsenaariumi jaoks konkreetset ja kasulikku tagasisidet +**Mis see kood teeb:** +- **Kontrollib**, kas kasutaja vanus vastab hääleõigus nõudele +- **Täidab** erinevaid koodiplokke tingimuse tulemusel +- **Arvutab** ja kuvab, kui kaua veel hääletamisõigust oodata, kui alla 18 +- **Annab** konkreetse ja abistava tagasiside igaks juhtumiks ```javascript -// Samm 2: Mitmed tingimused loogiliste operaatoritega +// 2. samm: Mitmed tingimused koos loogikaliste operaatoritega const userAge = 17; const hasPermission = true; @@ -408,22 +409,22 @@ if (userAge >= 18 && hasPermission) { } ``` -**Siin juhtub järgmist:** -- **Kombineerib** mitmed tingimused `&&` (ja) operaatoriga -- **Loo** tingimuste hierarhia `else if` abil mitme stsenaariumi jaoks -- **Käsitleb** kõiki võimalikke juhtumeid lõpliku `else` lausega -- **Annan** iga olukorra kohta selge, kasutajasõbraliku tagasiside +**Siin tehakse järgmised asjad:** +- **Kombineeritakse** mitmeid tingimusi `&&` (ja) operaatoriga +- **Luuakse** tingimuste hierarhia `else if` abil mitme stsenaariumi jaoks +- **Käsitletakse** kõiki võimalikke juhtumeid lõpliku `else` lausungi abil +- **Antakse** iga erineva situatsiooni puhul selge ja tegevusele suunatud tagasiside ```javascript -// Samm 3: Lühike tingimus teinepoolse operaatoriga +// Samm 3: Lühendatud tingimus kolmikoperaatoriga const votingStatus = userAge >= 18 ? "Can vote" : "Cannot vote yet"; console.log(`Status: ${votingStatus}`); ``` -**Mida meeles pidada:** -- **Kasuta** tingimuslause jaoks lihtsaid kahe valikuga tingimusi ternääroperaatoriga (`? :`) -- **Kirjuta** tingimus esimesena, siis `?`, siis tõene tulemus, siis `:`, siis väär tulemus -- **Kasuta** seda mustrit, kui vajad väärtuste määramist tingimuste põhjal +**Mida pead meeles pidama:** +- **Kasuta** ternaarset operaatorit (`? :`) lihtsate kahe valikuga tingimuste jaoks +- **Kirjuta** kõigepealt tingimus, siis `?`, pärast tõene tulemus, siis `:`, lõpuks väär tulemus +- **Rakenda** seda mustrit siis, kui pead tingimustest sõltuvalt väärtusi määrama ```javascript // Samm 4: Mitme konkreetse juhtumi käsitlemine @@ -446,21 +447,21 @@ switch (dayOfWeek) { } ``` -**See kood saavutab:** -- **Võrdleb** muutuja väärtust mitme kindla juhtumiga -- **Grupeerib** sarnased juhtumid kokku (nädalapäevad vs nädalavahetus) -- **Täidab** sobiva koodibloki, kui leitakse vaste -- **Sisaldab** `default` juhtumit ootamatute väärtuste jaoks -- **Kasutab** `break` lauseid, et vältida järgmise juhtumi täitmist +**See kood teeb järgmist:** +- **Võrdleb** muutuja väärtust mitme spetsiifilise juhtumiga +- **Grupib** sarnased juhtumid (nädalapäevad vs nädalavahetused) +- **Täidab** sobiva koodiploki, kui sobiv juhtum on leitud +- **Lisa-** `default` juhtum ootamatute väärtuste jaoks +- **Kasuta** `break` lauseid, et takistada järgmise juhtumi täidet- -> 💡 **Tegeliku elu võrdlus**: Mõtle juhtimisvoog nagu maailma kannatlikumale GPS-ile, mis juhatab sind. Ta võib öelda „Kui Main Streetil on ummik, võta maantee. Kui maantee on ehituse all, proovi maastikulist teed.“ Programmid kasutavad täpselt sama tingimusloogikat, et nutikalt reageerida erinevatele olukordadele ja anda kasutajatele parim võimalik kogemus. +> 💡 **Tegeliku elu näide**: Mõtle kontrollvoogu kui kõige kannatlikumale GPS-ile, mis annab sulle juhiseid. See võib öelda "Kui Main Streetil on ummik, võta kiirtee. Kui kiirteed blokeerib ehitus, proovi kaunist marsruuti." Programmid kasutavad täpselt sellist tingimusloogikat, et nutikalt erinevatele olukordadele vastata ja alati kasutajale parima kogemuse pakkuda. -### 🎯 **Kontseptide kontroll: ehitusplokkide valdamine** +### 🎯 **Konseptsiooni kontroll: Ehitusplokkide valdamine** -**Vaatame, kuidas sul põhitõdedega läheb:** -- Kas suudad omasõnadega seletada muutujate ja lausekannete vahe? -- Mõtle päriselu olukord, kus kasutaksid kui-siis otsust (nagu meie hääletamise näide) -- Mis on üks asi programmeerimisloogika kohta, mis sind üllatas? +**Vaatame, kuidas sul fundamentaalides läheb:** +- Kas suudad omasõnades selgitada muutujate ja avalduste vahet? +- Mõtle reaalsele olukorrale, kus kasutaksid if-siis otsust (nagu meie hääletamise näites) +- Mis üllatas sind programmeerimisloogika juures kõige rohkem? **Kiire enesekindluse tõstja:** ```mermaid @@ -472,30 +473,30 @@ flowchart LR style C fill:#2196f3 style D fill:#ff4081 ``` -✅ **Mis järgmisena tuleb**: Meil saab olema täielik lõbu, kui sukeldume sügavamale nende kontseptsioonide maailma sel imelisel teekonnal koos! Praegu keskendu lihtsalt sellele põnevale tunnetusele kõigi hämmastavate võimaluste ees. Spetsiifilised oskused ja tehnikad jäävad loomulikuks, kui harjutame koos – luban, et see saab olema palju lõbusam, kui sa võid ette kujutada! +✅ **Mis järgmiseks tuleb**: Meil on ees tõeliselt lõbus sukelduda sügavamale neisse kontseptsioonidesse, jätkates seda uskumatut teekonda koos! Praegu keskendu lihtsalt sellele põnevusele kõigi nende imeliste võimaluste ees. Spetsiifilised oskused ja tehnikad tulevad loomulikult, kui harjutame koos – luban, et see saab olema palju lõbusam, kui oskad oodata! -## Tööriistad, mis teevad asja ära +## Tööriistad tööstuses -Olgu, ausalt öeldes hakkab mul siin põnevusest lausa põrkama! 🚀 Räägime nüüd hämmastavatest tööriistadest, mis panevad sind tundma, nagu oleksid just saanud kätte võtmeks digitaalsele kosmoselaevale. +Ok, ausalt öeldes tunnen end sellepärast nii elevil, et vaevalt suudan ennast tagasi hoida! 🚀 Räägime uskumatuist tööriistadest, mis panevad sind tundma, et oled just saanud käepidemed digitaalsele kosmoselaevale. -Sa tead, kuidas kokal on täiuslikult tasakaalustatud noad, mis tunduvad käe pikendusena? Või kuidas muusikul on see üks kitarr, mis hakkab kohe laulma, kui ta seda puudutab? Arendajatel on oma versioon neist maagilistest tööriistadest ja siin on see osa, mis su mõistuse sassi ajab – enamik neist on täiesti tasuta! +Sa tead, kuidas kokal on need ideaalselt tasakaalustatud noad, mis tunduvad osana tema kätest? Või kuidas muusikul on see üks kitarr, mis hakkab laulma kohe, kui ta seda puudutab? Arendajatel on meie enda versioon neist maagilistest tööriistadest ja siin on see, mis su vaimu täiesti raputab – enamik neist on täiesti tasuta! -Ma peaaegu hüppan mu toolil, mõeldes, et jagan seda sinuga, sest need on täielikult revolutsiooniliselt muutnud tarkvara arendamise viisi. Räägime tehisintellekti jõul töötavatest koodiabilistest, mis aitavad kirjutada su koodi (ma ei naljatan!), pilvekeskkondadest, kus saad ehitada terveid rakendusi sõna otseses mõttes igalt poolt Wi-Fi-ga ja silumise tööriistadest, mis on nii arenenud, nagu oleks sul programmide jaoks röntgen! +Praktiliselt hüppan tugitoolis, mõeldes, et jagan neid sinuga, sest need on täielikult revolutsioonistanud, kuidas me tarkvara ehitame. Räägime AI-toega koodiassistentidest, mis aitavad sinu koodi kirjutada (ja ma ei naljaga tee!), pilvekeskkondadest, kus saad ehitada äppe sõna otseses mõttes kõikjalt Wi-Fi abil, ning silumise tööriistadest, mis on nii arenenud, nagu oleksid saanud oma programmide jaoks röntgenivisioni. -Ja siin on osa, mis annab endiselt külmavärinad: need ei ole „algajate tööriistad“, mida sa välja kasvad. Need on täpselt samad professionaalsed tööriistad, mida kasutavad Google'i, Netflixi ja selle indie-rakenduse stuudio arendajad, keda sa armastad, praegugi. Sa tunned end nende kasutamisel tõelise proffina! +Ja siin on see osa, mis jätab mind külmavärinate sisse: need ei ole "algajate tööriistad", mida sa kunagi välja kasvatad. Need on samad professionaalse taseme tööriistad, mida kasutavad Google’i, Netflix’i ja selle indie-äpi stuudio arendajad just praegu. Sa tunned end sellise professionaalina, kui neid kasutad! ```mermaid graph TD A["💡 Sinu idee"] --> B["⌨️ Koodi redaktor
(VS Code)"] B --> C["🌐 Brauseri arendustööriistad
(Testimine ja silumine)"] C --> D["⚡ Käsklusrida
(Automatiseerimine ja tööriistad)"] - D --> E["📚 Dokumentatsioon
(Õppimine ja viited)"] - E --> F["🚀 Hämmastav veebirakendus!"] + D --> E["📚 Dokumentatsioon
(Õppimine ja viide)"] + E --> F["🚀 Hämmastav veebiäpp!"] - B -.-> G["🤖 AI assistent
(GitHub Copilot)"] + B -.-> G["🤖 Tehisintellekti assistent
(GitHub Copilot)"] C -.-> H["📱 Seadme testimine
(Reageeriv disain)"] - D -.-> I["📦 Pakettide haldurid
(npm, yarn)"] - E -.-> J["👥 Kogukond
(Stack Overflow)"] + D -.-> I["📦 Pakihaldurid
(npm, yarn)"] + E -.-> J["👥 Ühendus
(Stack Overflow)"] style A fill:#fff59d style F fill:#c8e6c9 @@ -504,120 +505,121 @@ graph TD style I fill:#ffccbc style J fill:#e8eaf6 ``` -### Koodiredaktorid ja IDE-d: su uued digitaalsed parimad sõbrad +### Koodi redaktorid ja IDEd: Sinu uued digitaalsed parimad sõbrad -Räägime koodiredaktoritest – need hakkavad tõepoolest saama sinu uueks lemmikkoha, kus aega veeta! Mõtle neile kui isiklikule kodeerimispühamule, kus sa veedad suure osa oma ajast, vormides ja lihvides oma digitaalseid loominguid. +Räägime koodi redaktoritest – need saavad tõesti sinu uueks lemmikkohtadeks, kus aega veeta! Mõtle neile kui oma isiklikule koodi pühamukohale, kus veedad suurema osa ajast digitaalsete loomingute meisterdamisel ja lihvimisel. -Aga siin on see, mis on kaasaegsete redaktorite juures täiesti maagiline: need ei ole lihtsalt uhked tekstiredaktorid. Need on nagu kõige säravam, toetavam kodeerimise mentor, kes istub sinu kõrval 24/7. Nad tabavad trükivead enne, kui sa neid märkad, pakuvad parandusi, mis muudavad sind geeniuseks, aitavad sul mõista, mida iga kooditükk teeb, ja mõned neist suudavad isegi ära arvata, mida sa hakkad kirjutama, ning pakkuda mõtteid lõpetada! +Aga siin on see, mis on moodsa redaktori puhul tõeliselt maagiline: nad ei ole lihtsalt uhked tekstiredaktorid. Nad on nagu kõige geniaalsem, toetavam koodi mentor, kes istub sinu kõrval 24/7. Nad tabavad trükivead enne, kui ise märkad, pakuvad täiustusi, mis panevad sind geniaalseks tundma, aitavad mõista, mida iga koodiosa teeb, ja mõned suudavad isegi ära arvata, mida kavatset ra kirjutada ja pakkuda mõtteid lõpetada! -Mäletan, kui ma avastasin automaatse täiendamise – tundsin, nagu elaksin tulevikus. Sa hakkad midagi kirjutama ja su redaktor ütleb: „Hei, kas sa mõtlesid selle funktsiooni peale, mis teeb täpselt seda, mida vajad?“ See on nagu mõtte lugeja, kes on su kodeerimise kaaslane! +Mäletan, kui avastasin esmakordselt automaatse täitmise – ma tundsin end elavat tulevikus. Sa alustad midagi kirjutama ja su redaktor ütleb: "Hei, kas sa mõtlesid sellele funktsioonile, mis teeb täpselt seda, mida vajad?" See on nagu mõtte lugeja oleks sinu koodi sõber! -**Mida muudab need redaktorid nii uskumatuks?** +**Mis teeb need redaktorid nii hämmastavaks?** -Kaasaegsed koodiredaktorid pakuvad muljetavaldavat valikut funktsioone, mis suurendavad su tootlikkust: +Moodsaid koodi redaktoreid iseloomustavad muljetavaldavad funktsioonid, mis tõstavad su tootlikkust: | Funktsioon | Mida see teeb | Miks see aitab | |------------|---------------|----------------| -| **Süntaksi esiletõstmine** | Värvib erinevad koodiosad | Muudab koodi kergemini loetavaks ja vigade leidmise lihtsamaks | -| **Automaatne täiendamine** | Pakub koodi kirjutades | Kiirendab kodeerimist ja vähendab trükivigu | -| **Silumisvahendid** | Aidata leida ja parandada vigu | Säästab tunde probleemide otsimisest | -| **Laiendused** | Lisavad spetsialiseeritud funktsioone | Kohanda oma redaktorit mis tahes tehnoloogia jaoks | -| **AI abistajad** | Pakuvad koodi ja selgitusi | Kiirendab õppimist ja tootlikkust | +| **Süntaksi esiletõstmine** | Värvib koodi erinevad osad | Muudab koodi kergemini loetavaks ja vead nähtavaks | +| **Automaatne täitmine** | Pakub koodi kirjutamisel soovitusi | Kiirendab kirjutamist ja vähendab trükivigu | +| **Silumisvahendid** | Aitab leida ja parandada vigu | Säästab tunde tõrkeotsingut | +| **Pikendused** | Lisavad spetsiaalseid funktsioone | Kohanda redaktorit mis tahes tehnoloogia jaoks | +| **AI assistendid** | Pakuvad koodi ja seletusi | Kiirendab õppimist ja töö efektiivsust | -> 🎥 **Videoressurss**: Tahad näha neid tööriistu töös? Vaata seda [Tools of the Trade videot](https://youtube.com/watch?v=69WJeXGBdxg), mis annab põhjaliku ülevaate. +> 🎥 **Videoresurss**: Tahad näha neid tööriistu tegevuses? Vaata seda [Tools of the Trade video](https://youtube.com/watch?v=69WJeXGBdxg) põhjalikku ülevaadet. #### Soovitatud redaktorid veebiarenduseks **[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)** (tasuta) - Kõige populaarsem veebiarendajate seas -- Suurepärane laienduste ökosüsteem +- Suurepärane pikendustepood - Sisseehitatud terminal ja Git integratsioon -- **Asendamatud laiendused**: - - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - AI jõul töötavad koodisoovitused +- **Peamised lisad**: + - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - AI-toega koodisoovitused - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) - Reaalajas koostöö - - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - Automaatne koodi vormindus - - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) - Tabab trükivead koodis + - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - Automaatne koodi vormindamine + - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) - Koodis trükivigade leidmine -**[JetBrains WebStorm](https://www.jetbrains.com/webstorm/)** (tasuline, üliõpilastele tasuta) +**[JetBrains WebStorm](https://www.jetbrains.com/webstorm/)** (tasuline, tudengitele tasuta) - Täiustatud silumis- ja testimisvahendid -- Nutikas koodi täiendamine +- Intelligentsed koodi lõpetamise võimalused - Sisseehitatud versioonihaldus -**Pilvepõhised IDE-d** (eri hinnaklassid) -- [GitHub Codespaces](https://github.com/features/codespaces) - Täielik VS Code brauseris -- [Replit](https://replit.com/) - Hea õppimiseks ja koodi jagamiseks -- [StackBlitz](https://stackblitz.com/) - Kohene täispinu veebiarendus +**Pilvepõhised IDEd** (erinevad hinnad) +- [GitHub Codespaces](https://github.com/features/codespaces) - Täielik VS Code otse brauseris +- [Replit](https://replit.com/) - Suurepärane õppimiseks ja koodi jagamiseks +- [StackBlitz](https://stackblitz.com/) - Kohene täispaketti veebiarendus -> 💡 **Algusnõuanne**: Alusta Visual Studio Code’iga – see on tasuta, tööstuses laialt kasutusel ja sellel on tohutu kogukond, kes loob abimaterjale ja laiendusi. +> 💡 **Alguse soovitus**: Alusta Visual Studio Code’ga – see on tasuta, laialt tööstuses kasutatav ja omab tohutut kogukonda, kes loob abistavaid õpetusi ja lisasid. -### Veebibrauserid: su salajane arendustöötuba +### Veebibrauserid: Sinu salajane arenduslabor -Kui oled valmis, siis laseb see teadmine su mõistuse täiesti sassi! Sa tead, kuidas oled brausereid kasutanud sotsiaalmeediat kerimiseks ja videote vaatamiseks? Selgub, et nad on kogu selle aja varjanud seda uskumatut saladuslikku arendustöötuba, mis ootab lihtsalt, et sina selle avastaksid! +Olgu, valmista end täielikuks vaimustusks! Sa tead, et oled kasutanud brausereid sotsiaalmeedias sirvimiseks ja videote vaatamiseks? Selgub, et nad on kogu selle aja varjanud seda imelist salajast arenduslaborit, mis ootab, et sa selle avastaksid! -Iga kord, kui sa paremklõpsad veebilehel ja valid „Elementi kontrolli“, avad varjatud arendustööriistade maailma, mis on ausalt öeldes võimsamad kui mõned kallid tarkvarad, mille eest ma kunagi sadu dollareid maksis. See on nagu avastada, et tavalises köögis on salajane professionaalse koka laboratoorium peidetud! -Esimest korda, kui keegi mulle brauseri DevToolsi näitas, veetsin umbes kolm tundi lihtsalt klõpsides ja öeldes: "OOTA, KAS SEE SAAB KA SEDA TEHA?!" Sa saad päriselt muuta mistahes veebisaiti reaalajas, näha täpselt kui kiiresti kõik laadib, testida, kuidas su sait erinevates seadmetes välja näeb, ja isegi siluda JavaScripti nagu täielik proff. See on absoluutselt vapustav! +Iga kord, kui sa paremklõpsad veebilehel ja valid "Inspect Element", avad endale arendajate tööriistade varjatud maailma, mis on ausalt öeldes võimsamad kui mõni kallis tarkvara, mille eest ma varem sadu dollareid maksisn. See on nagu avastada, et sinu tavaline köök on peitnud professionaalse koka labori salajase paneeli taha! +Esimest korda, kui keegi mulle brauseri DevTools'i näitas, veetsin ma umbes kolm tundi lihtsalt ringi klikkides ja öeldes „OOTA, KAS TA OSKAB KA SEDA?!“ Sa saad reaalselt igat veebilehte otse muuta, näha täpselt, kui kiiresti kõik laadib, testida, kuidas su sait erinevates seadmetes välja näeb, ja isegi JavaScripti nagu tõeline proff siluda. See on täiesti hämmastav! -**Sellepärast on brauserid su salarelv:** +**Siin on, miks brauserid on su salarelv:** -Kui sa lood veebisaiti või veebirakendust, pead nägema, kuidas see maailmas välja näeb ja käitub. Brauserid mitte ainult ei kuva su tööd, vaid annavad ka detailset tagasisidet jõudluse, ligipääsetavuse ja võimalike probleemide kohta. +Kui sa lood veebilehte või veebiäppi, pead nägema, kuidas see reaalses maailmas välja näeb ja käitub. Brauserid ei näita mitte ainult su tööd, vaid annavad ka põhjalikku tagasisidet jõudluse, ligipääsetavuse ja võimalike probleemide kohta. #### Brauseri arendustööriistad (DevTools) -Tänapäeva brauserid sisaldavad põhjalikke arenduskomplekte: +Tänapäeva brauserid sisaldavad põhjalikke arendusvahendite komplekte: -| Tööriista kategooria | Mida see teeb | Näide kasutusjuhtumist | -|----------------------|---------------|-----------------------| -| **Elementide inspekteerija** | HTML/CSS reaalajas vaatamine ja muutmine | Stiili reguleerimine, et näha kohest tulemust | -| **Konsool** | Vaata veateateid ja testi JavaScripti | Probleemide silumine ja katsetamine koodiga | -| **Võrgu monitoor** | Jälgi, kuidas ressursid laaditakse | Jõudluse ja laadimisaja optimeerimine | -| **Ligipääsetavuse kontrollija** | Testi kaasava disaini põhimõtteid | Veendu, et su sait töötab kõigi kasutajate jaoks | -| **Seadmete simulaator** | Eelvaade erinevate ekraanisuurustega | Testi reageerivat disaini ilma mitme seadmeta | +| Tööriista kategooria | Mida see teeb | Näidiskasutus | +|----------------------|---------------|---------------| +| **Elementide inspekteerija** | Vaata ja muuda HTML/CSS reaalajas | Kohanda stiili, et näha koheseid tulemusi | +| **Konsol** | Vaata veateateid ja testi JavaScripti | Silu probleeme ja katseta koodiga | +| **Võrgu jälgija** | Jälgi ressursside laadimist | Optimeeri jõudlust ja laadimisaegu | +| **Ligipääsetavuse kontrollija** | Testi kaasava disaini põhimõtteid | Veendu, et su sait töötab kõigile kasutajatele | +| **Seadmesimulaator** | Eelvaade erinevate ekraanisuuruste peal | Testi reageerivat disaini ilma mitme seadmeta | #### Soovitatud brauserid arenduseks -- **[Chrome](https://developers.google.com/web/tools/chrome-devtools/)** – Tööstusharu standard DevTools koos laiapõhjalise dokumentatsiooniga -- **[Firefox](https://developer.mozilla.org/docs/Tools)** – Suurepärased CSS Gridi ja ligipääsetavuse tööriistad -- **[Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)** – Põhineb Chromiumil, Microsofti arendajate ressurssidega +- **[Chrome](https://developers.google.com/web/tools/chrome-devtools/)** – tööstusstandard DevTools koos põhjaliku dokumentatsiooniga +- **[Firefox](https://developer.mozilla.org/docs/Tools)** – suurepärased CSS Gridi ja ligipääsetavuse tööriistad +- **[Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)** – ehitatud Chromiumile koos Microsofti arendajate ressurssidega + +> ⚠️ **Tähtis testimisnipp**: Testi alati oma veebisaite mitmes brauseris! See, mis töötab ideaalselt Chrome'is, võib Safaris või Firefoxis välja näha teistmoodi. Professionaalsed arendajad testivad kõigis suuremates brauserites, et tagada kasutajakogemuse järjepidevus. -> ⚠️ **Oluline testimisnipp**: Alati testi oma veebisaite mitmes brauseris! Mis töötab ideaalselt Chromes, võib Safaris või Firefoxis erineda. Professionaalsed arendajad testivad kõigis suuremates brauserites, et tagada ühtlane kasutajakogemus. -### Käsureatööriistad: Sinu värav arendaja üleloomulike võimeteni +### Käsurea tööriistad: sinu sissepääs arendaja supervõimetesse -Olgu, olgem täiesti ausad käsurea suhtes, sest ma tahan, et sa kuuled seda kedagi, kes tõesti mõistab. Kui ma selle esimest korda nägin – lihtsalt see hirmutav must ekraan vilkuva tekstiga – mõtlesin tõsiselt: "Ei-ei, üldse mitte! See näeb välja nagu 1980ndate häkkerifilmist ja ma pole kindlasti selleks piisavalt tark!" 😅 +Olgu, olgem nüüd täiesti ausad käsurea suhtes, sest tahan, et sa kuulaksid seda inimeselt, kellel on sellest tõesti arusaamine. Kui ma seda esimest korda nägin – lihtsalt see hirmutav musta taustaga, vilkuva tekstiga ekraan – siis mõtlesin sõna otseses mõttes: „Ei, absoluutselt mitte! See näeb välja nagu midagi 1980. aastate häkkerifilmist, ja ma pole kindlasti piisavalt tark selle jaoks!“ 😅 -Aga siin on see, mida ma sooviksin, et keegi oleks mulle tookord öelnud ja mida ma ütlen sulle nüüd: käsurida pole hirmutav – see on nagu otsekõne arvutile. Mõtle sellele nagu vahe peale, kas tellid toidu uhkest foto- ja menüüplugina kasutavast äpist (mis on mugav ja lihtne) või lähed oma lemmiklokaali restorani, kus peakokk teab täpselt, mis sulle meeldib, ja võib valmistada suunamisi midagi imelist lihtsalt öeldes: "üllata mind millegagi suurepärasega." +Aga siin on see, mida ma soovin, et keegi oleks mulle tol ajal öelnud ja mida ma räägin sulle praegu: käsurida pole hirmuäratav – see on tegelikult nagu otsepöördumine oma arvutiga. Mõtle sellele kui vahe Eesti moodsate toidu tellimise äppide pildi- ja menüüvalikute (mis on mõnus ja lihtne) ning su lemmik kohaliku restorani kõndimise vahele, kus kokk teab täpselt, mida sa armastad, ja suudab valmistada midagi perfektselt ainult sinu sõnadega „üllata mind millegagi imelisega.“ -Käsurida on koht, kuhu arendajad lähevad, et tunda end tõeliste maagikutena. Sa kirjutad paar esmapilgul maagilist sõna (okei, need on lihtsalt käsud, aga tunduvad maagilised!), vajutad Enterit ja BUMM – oled loonud terve projekti struktuuri, paigaldanud võimsaid tööriistu üle kogu maailma või avaldanud oma rakenduse internetis miljonitele vaatamiseks. Kui sa selle esimese võimsuse maitset tunned, on see ausalt üsna sõltuvust tekitav! +Käsurida on koht, kuhu arendajad lähevad, et tunda end tõeliste võluritena. Sa kirjutad mõned näiliselt maagilised sõnad (okei, need on lihtsalt käsud, aga need tunduvad maagilised!), vajutad enterit ja BOOM – oled loonud terve projekti struktuuri, installinud võimsaid tööriistu üle maailma või deployinud oma äpi internetti miljonite nägemiseks. Kui sa saad sellest võimust esimest korda maitse suhu, siis see on ausalt öeldes väga sõltuvust tekitav! -**Miks käsurida saab su lemmiktööriistaks:** +**Miks käsurida saab sinu lemmiktööriistaks:** -Kuigi graafilised liidesed sobivad paljude ülesannete jaoks, paistab käsurida silma automatiseerimise, täpsuse ja kiiruse poolest. Paljud arendustööriistad töötavad peamiselt käsurealiideste kaudu ja nende efektiivne kasutamine võib oluliselt parandada sinu tootlikkust. +Kuigi graafilised kasutajaliidesed sobivad paljude ülesannete jaoks hästi, on käsurida ülim automaatika, täpsuse ja kiiruse osas. Paljud arendustööriistad töötavad peamiselt käsurea kaudu ja nende efektiivne kasutamine võib oluliselt tõsta su tootlikkust. ```bash # Samm 1: Loo ja liigu projekti kataloogi mkdir my-awesome-website cd my-awesome-website ``` - -**See kood teeb järgmist:** -- **Loo** uus kataloog nimega "my-awesome-website" oma projekti jaoks -- **Liigu** äsja loodud kataloogi, et alustada tööd + +**Mida see kood teeb:** +- **Loo** uus kaust nimega „my-awesome-website“ su projekti jaoks +- **Liigu** loodud kausta, et alustada tööd ```bash -# 2. samm: Initsialiseeri projekt koos package.json failiga +# Samm 2: Algata projekt failiga package.json npm init -y -# Paigalda kaasaegsed arendusvahendid +# Paigalda kaasaegsed arendustööriistad npm install --save-dev vite prettier eslint npm install --save-dev @eslint/js ``` - -**Samm-sammult toimub see:** -- **Algatatakse** uus Node.js projekt vaikeseadistustega kasutades `npm init -y` -- **Paigaldatakse** Vite kaasaegse ehitustööriistana kiireks arenduseks ja tootmisversioonideks -- **Lisatakse** Prettier automaatseks koodi vormindamiseks ja ESLint koodi kvaliteedi kontrolliks -- **Kasutatakse** `--save-dev` lippu, et märkida need ainult arendamise sõltuvusteks + +**Samm-sammult toimub järgmist:** +- **Algatamine** uuest Node.js projektist vaikeseadetega kasutades `npm init -y` +- **Installimine** Vite moodsa build-tööriistana kiireks arenduseks ja toodanguks +- **Lisamine** Prettier automaatseks koodi vormindamiseks ja ESLint koodi kvaliteedi kontrollimiseks +- **Kasutamine** `--save-dev` lipuga, et märkida need ainult arendamise sõltuvustena ```bash # 3. samm: Loo projekti struktuur ja failid @@ -627,222 +629,226 @@ echo 'My Site

Hello Wo # Käivita arendusserver npx vite ``` - -**Ülaltoodud toimingud olid:** -- **Organiseeriti** meie projekt, luues eraldi kaustad lähtekoodi ja varade jaoks -- **Genereeriti** põhiline HTML-fail õige dokumendisstruktuuriga -- **Käivitati** Vite arendusserver eluks uuenduste ja kuuma mooduli asendamisega -#### Veebiarenduse olulised käsureatööriistad +**Ülaltoodud toimingutes:** +- **Korraldasime** oma projekti, luues eraldi kaustad lähtekoodile ja varadele +- **Genereerisime** lihtsa HTML faili õige dokumendi struktuuriga +- **Käivitame** Vite arendusteenuse live reload’i ja hot module replacement’iga + +#### Olulised käsurea tööriistad veebiarenduses -| Tööriist | Eesmärk | Miks seda vajad | -|----------|---------|-----------------| -| **[Git](https://git-scm.com/)** | Versioonihaldus | Jälgi muudatusi, tee koostööd teistega, tee varukoopiaid | -| **[Node.js & npm](https://nodejs.org/)** | JavaScripti käituskeskkond ja pakethaldus | Käivita JavaScripti väljaspool brausereid, paigalda kaasaegseid arendustööriistu | -| **[Vite](https://vitejs.dev/)** | Ehitusvahend ja arendusserver | Väga kiire arendus koos kuuma mooduli asendusega | -| **[ESLint](https://eslint.org/)** | Koodi kvaliteet | Leia ja paranda automaatselt JavaScriptis probleemid | -| **[Prettier](https://prettier.io/)** | Koodi vormindamine | Hoia oma kood järjekindlalt vormindatud ja loetavana | +| Tööriist | Eesmärk | Miks sul seda vaja on | +|----------|---------|-----------------------| +| **[Git](https://git-scm.com/)** | Versioonihaldus | Jälgi muudatusi, tee koostööd, varunda oma tööd | +| **[Node.js & npm](https://nodejs.org/)** | JavaScripti runtime & pakendihaldus | Käivita JavaScript brauseri väliselt, installi moodsad arendustööriistad | +| **[Vite](https://vitejs.dev/)** | Build-tööriist ja arendusserver | Välkkiire arendus koos kuuma mooduli asendusega | +| **[ESLint](https://eslint.org/)** | Koodi kvaliteet | Leia ja paranda automaatselt JavaScripti probleemid | +| **[Prettier](https://prettier.io/)** | Koodi vormindamine | Hoia oma kood ühtlaselt vormindatud ja loetav | #### Platvormipõhised valikud -**Windows:** -- **[Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)** – Moodne, rikkalikult funktsioone täis terminal -- **[PowerShell](https://docs.microsoft.com/powershell/?WT.mc_id=academic-77807-sagibbon)** 💻 – Võimas skriptikeel -- **[Command Prompt](https://docs.microsoft.com/windows-server/administration/windows-commands/?WT.mc_id=academic-77807-sagibbon)** 💻 – Traditsiooniline Windowsi käsurida +**Windows:** +- **[Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)** – moodne, rikkalike funktsioonidega terminal +- **[PowerShell](https://docs.microsoft.com/powershell/?WT.mc_id=academic-77807-sagibbon)** 💻 – võimas skriptimiskeskkond +- **[Command Prompt](https://docs.microsoft.com/windows-server/administration/windows-commands/?WT.mc_id=academic-77807-sagibbon)** 💻 – traditsiooniline Windowsi käsurida -**macOS:** -- **[Terminal](https://support.apple.com/guide/terminal/)** 💻 – Eelinstalleeritud terminalirakendus -- **[iTerm2](https://iterm2.com/)** – Täiustatud terminal koos arenenud funktsioonidega +**macOS:** +- **[Terminal](https://support.apple.com/guide/terminal/)** 💻 – sisseehitatud terminali rakendus +- **[iTerm2](https://iterm2.com/)** – täiustatud terminal täiendavate funktsioonidega -**Linux:** -- **[Bash](https://www.gnu.org/software/bash/)** 💻 – Standardlinuxi kest -- **[KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)** – Täiustatud terminaliemulaator +**Linux:** +- **[Bash](https://www.gnu.org/software/bash/)** 💻 – standardne Linuxi shell +- **[KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)** – täiustatud terminali emulaator -> 💻 = Operatsioonisüsteemiga kaasas +> 💻 = Operatsioonisüsteemiga eelinstallitud -> 🎯 **Õppeteekond**: Alusta põhilistest käskudest nagu `cd` (kausta vahetus), `ls` või `dir` (failide listimine) ja `mkdir` (kausta loomine). Harjuta tänapäevaste töövoo käskudega nagu `npm install`, `git status` ja `code .` (avatakse praegune kaust VS Codes). Kui mugavus kasvab, omandad loomulikult ka keerulisemad käsud ja automatiseerimistehnikad. +> 🎯 **Õppeteekond**: Alusta põhiliste käskudega nagu `cd` (kausta vahetus), `ls` või `dir` (failide nimekiri) ja `mkdir` (kausta loomine). Harjuta tänapäevaste töövoo käskudega nagu `npm install`, `git status` ja `code .` (avatakse praegune kaust VS Code’is). Mida mugavamaks saad, seda loomulikult haarad juurde täpsemaid käske ja automatiseerimisvõtteid. -### Dokumentatsioon: Sinu alati olemasolev õppementor -Olgu, las ma jagan väikest saladust, mis paneb sind tundma end palju paremini algajana: isegi kõige kogenumad arendajad veedavad tohutult aega dokumentatsiooni lugedes. Ja see pole sellepärast, et nad ei tea, mida teevad – see on tarkuse tõestus! +### Dokumentatsioon: sinu alati saadaval olev õppemaa -Mõtle dokumentatsioonile kui maailma kannatlikumate, teadlikumate õpetajate kogumile, kes on alati saadaval ööpäevaringselt. Jääd kella kahe paiku öösel probleemiga hätta? Dokumentatsioon ootab soojalt virtuaalse kallistusega ja just õige vastusega. Tahad õppida mõnest uuest lahedast funktsioonist, millest kõik räägivad? Dokumentatsioon aitab samm-sammult näidetega. Püüad aru saada, miks midagi toimib nii nagu toimib? Sa arvasid õigesti – dokumentatsioon seletab selle lahti, kuni mõistmine saabub! +Olgu, jagan sinuga väikest saladust, mis paneb sind tundma ennast palju paremini algajana: ka kõige kogenumad arendajad veedavad tohutu osa oma ajast dokumentatsiooni lugedes. Ja see pole seepärast, et nad ei teakliks, mida teevad – see on hoopis tarkuse märk! -Siin on midagi, mis mu vaatenurka täielikult muutis: veebiarendusmaailm liigub tohutu kiirusega ja keegi – ma tõesti mõtlen, et keegi! – ei talleta kõike pähe. Olen näinud vanemaid arendajaid, kellel on üle 15 aasta kogemust, pärimas põhilist süntaksit ja tead mida? See pole häbi – see on tarkus! Ei ole asi perfektses mälus, vaid selles, et tead, kuhu usaldusväärseid vastuseid kiiresti leida ja kuidas neid kasutada. +Mõtle dokumentatsioonile kui ligipääsule maailma kõige kannatlikumatele ja teadlikumatele õpetajatele, kes on olemas 24/7. Jääd verdama kella kahe ajal öösel? Dokumentatsioon on seal soojalt virtuaalselt embamas ja just vastusega, mida vajad. Tahad õppida mõnda lahedat uut funktsiooni, millest kõigil räägitakse? Dokumentatsioon toetab sind samm-sammult näidistega. Üritad aru saada, miks midagi nii toimib nagu ta toimib? Eks arvasidki – dokumentatsioon on valmis selgitama seda nii, et see lõpuks klapib! -**Tegelik maagia toimub siin:** +Siin on midagi, mis muutis kogu minu vaatenurka: veebiarenduse maailm liigub uskumatult kiiresti ja keegi (ma mõtlen täiesti kedagi!) ei hoia kõike meeles. Olen näinud, kuidas 15+ aastase kogemusega vanemad arendajad otsivad üles lihtsat süntaksit, ja tead mis? See pole piinlik – see on nutikas! Asi ei ole ideaalses mälus; asi on selles, et tead, kust leida usaldusväärseid vastuseid kiiresti ja oskad neid rakendada. -Professionaalsed arendajad veedavad suure osa oma ajast dokumentatsiooni lugedes – mitte sest nad ei tea, mida teevad, vaid kuna veebiarenduse maastik areneb nii kiiresti, et ajakohasena püsimiseks on pidev õppimine vajalik. Hea dokumentatsioon aitab sul mõista mitte ainult *kuidas* midagi kasutada, vaid ka *miks* ja *millal* seda teha. +**Siin toimub tõeline võlu:** + +Professionaalsed arendajad veedavad olulise osa oma ajast dokumentatsiooni lugedes – mitte kuna nad ei teaks, mida teevad, vaid kuna veebiarenduse maastik muutub nii kiiresti, et ajakohasena püsimine nõuab pidevat õppimist. Hea dokumentatsioon aitab mõista mitte ainult seda, *kuidas* midagi kasutada, vaid ka *miks* ja *millal* seda teha. #### Olulised dokumentatsiooni ressursid -**[Mozilla Developer Network (MDN)](https://developer.mozilla.org/docs/Web)** -- Veebitehnoloogiate kuldstandard dokumentatsioonis -- Põhjalikud juhendid HTML-i, CSS-i ja JavaScripti kohta -- Sisaldab brauserite ühilduvuse infot -- Praktikapõhjad näited ja interaktiivsed demo'd +**[Mozilla Developer Network (MDN)](https://developer.mozilla.org/docs/Web)** +- Veebitehnoloogiate kulla standard dokumentatsioonis +- Põhjalikud juhendid HTML, CSS ja JavaScripti kohta +- Sisaldab brauserite ühilduvuse infot +- Pakub praktilisi näiteid ja interaktiivseid demosid -**[Web.dev](https://web.dev)** (Google poolt) -- Kaasaegsed veebiarenduse parimad praktikad -- Jõudluse optimeerimise juhendid -- Ligipääsetavuse ja kaasava disaini põhimõtted -- Reaalsetest projektidest juhtumiuuringud +**[Web.dev](https://web.dev)** (Google’i poolt) +- Kaasaegsed veebiarenduse parimad praktikad +- Jõudluse optimeerimise juhendid +- Ligipääsetavus ja kaasava disaini põhimõtted +- Juhtumiuuringud pärisprojektidest -**[Microsoft Developer Documentation](https://docs.microsoft.com/microsoft-edge/#microsoft-edge-for-developers)** -- Edge brauseri arendusressursid -- Progressiivsete veebirakenduste juhised -- Platvormideülene arendusinfo +**[Microsoft Developer Documentation](https://docs.microsoft.com/microsoft-edge/#microsoft-edge-for-developers)** +- Edge brauseri arendusressursid +- Progressiivsete veebirakenduste juhendid +- Mitmeplatvormiliste arenduste ülevaated -**[Frontend Masters Learning Paths](https://frontendmasters.com/learn/)** -- Struktureeritud õppemarsruudid -- Videokursused tööstuse ekspertidelt -- Praktilised kodeerimisülesanded +**[Frontend Masters Learning Paths](https://frontendmasters.com/learn/)** +- Struktureeritud õppemoodulid +- Videokursused tööstuse ekspertidelt +- Praktilised kodeerimise harjutused -> 📚 **Õppestrateegia**: Ära proovi dokumentatsiooni pähe õppida – selle asemel õpi seda efektiivselt navigeerima. Pane järjehoidjatesse tihti kasutatavad viited ja harjuta otsingufunktsioonide kasutamist, et kiiresti konkreetset infot leida. +> 📚 **Õppestrateegia**: Ära proovi dokumentatsiooni pähe õppida – õpi pigem seda efektiivselt navigeerima. Märgista tihti kasutatavad viited ja harjuta otsingufunktsioonide kasutamist kiire info leidmiseks. ### 🔧 **Tööriista valdamise kontroll: Mis sinuga kõnetab?** -**Võta hetk mõtlemiseks:** -- Millist tööriista tahaksid esimesena proovida? (Vale vastust ei ole!) -- Kas käsurida tundub endiselt hirmutav või oled selle vastu uudishimulik? -- Kas suudad ette kujutada, et kasutad brauseri DevToolsi, et piiluda oma lemmikveebide telgitagustesse? +**Võta hetk ja mõtle:** +- Millist tööriista tahad kõigepealt proovida? (Vale vastust pole!) +- Kas käsurida tundub endiselt hirmutav või oled selle vastu uudishimulik? +- Kas saad ette kujutada, et kasutad brauseri DevTools'i, et piiluda oma lemmikveebisaitide telgitaguseid? ```mermaid -pie title "Arendaja Aeg Vahenditega" +pie title "Arendaja aeg tööriistadega" "Koodiredaktor" : 40 - "Brauseri Testimine" : 25 + "Brauseri testimine" : 25 "Käsurida" : 15 - "Dokumentatsiooni Lugemine" : 15 + "Dokumentatsiooni lugemine" : 15 "Silumine" : 5 -``` -> **Lõbus fakt:** Enamik arendajaid veedab umbes 40% ajast koodiredaktoris, aga märka, kui palju aega kulub testimiseks, õppimiseks ja probleemide lahendamiseks. Programmeerimine ei ole ainult koodi kirjutamine – see on kogemuste loomine! +``` +> **Lõbus fakt**: Enamik arendajaid veedab umbes 40% ajast oma koodiredaktoris, aga märka, kui palju aega kulub testimisele, õppimisele ja probleemide lahendamisele. Programmeerimine ei ole lihtsalt koodi kirjutamine – see on kogemuste loomine! -✅ **Mõtlemise toit:** Siin on midagi huvitavat mõtlemiseks – kuidas arvad, et veebisaitide loomise tööriistad (arendus) erinevad tööriistadest, millega kujundada, kuidas need välja näevad (disain)? See on nagu vahe arhitekti vahel, kes disainib kauni maja, ja töövõtja vahel, kes selle päriselt ehitab. Mõlemad on olulised, kuid vajavad erinevaid tööriistakaste! Selline mõtlemine aitab sul tõesti näha suuremat pilti, kuidas veebisaidid ellu sünnivad. +✅ **Toit mõtlemiseks**: Siin on midagi huvitavat – kuidas sa arvad, et veebisaitide ehitamise tööriistad (arendus) võivad erineda tööriistadest, millega kujundada, kuidas need välja näevad (disain)? See on nagu vahe arhitekti vahel, kes disainib kaunist maja, ja ehitaja vahel, kes selle tegelikult üles ehitab. Mõlemad on olulised, kuid neil on erinevad tööriistakapid! Selline mõtteviis aitab sul tõesti näha suuremat pilti, kuidas veebisaidid elule ärkavad. -## GitHub Copilot Agenti väljakutse 🚀 +## GitHub Copilot Agent väljakutse 🚀 -Kasuta Agentrežiimi järgmise väljakutse lõpuleviimiseks: +Kasuta Agent režiimi, et lõpetada järgmine väljakutse: -**Kirjeldus:** Uuri kaasaegse koodiredaktori või IDE omadusi ja näita, kuidas need võivad parandada su töövoogu veebiarendajana. +**Kirjeldus:** Uuri moodsate koodiredaktorite või IDE omadusi ja näita, kuidas need võivad parandada sinu töövoogu veebiarendajana. -**Juhtlause:** Vali koodiredaktor või IDE (näiteks Visual Studio Code, WebStorm või pilvepõhine IDE). Nimeta kolm funktsiooni või laiendust, mis aitavad sul koodi efektiivsemalt kirjutada, siluda või hooldada. Igaühe kohta anna lühike selgitus, kuidas see su töövoogu aitab. +**Käsk:** Vali koodiredaktor või IDE (näiteks Visual Studio Code, WebStorm või pilvepõhine IDE). Tõesta kolme omaduse või laiendusega, mis aitavad sul kodeerida, siluda või koodi hooldada efektiivsemalt. Igaühe juures anna lühike selgitus, kuidas see sinu tööd parandab. --- ## 🚀 Väljakutse -**Olgu, detektiiv, valmis oma esimeseks juhtumiks?** +**Olgu, detektiiv, kas oled valmis oma esimeseks juhtumiks?** + +Nüüd, kui sul on see äge alus olemas, on mul seiklus, mis aitab sul näha, kui uskumatu mitmekesine ja põnev programmeerimise maailm tegelikult on. Ja kuula – see ei ole veel koodi kirjutamise kohta, nii et mitte midagi stressi! Mõtle end programmeerimiskeelte detektiivina oma esimesel põneval juhtumil! + +**Sinu missioon, kui sa selle vastu võtad:** +1. **Saavuta keeleuurija staatus:** Vali kolm programmeerimiskeelt täiesti erinevatest universumitest – äkki üks veebilehtede loomiseks, üks mobiilirakenduste tegemiseks ja üks teadlaste andmete töötlemiseks. Leia näited samast lihtsast ülesandest, mis on kirjutatud neis keeltes. Luban, et sa jääd uskumatusse, kui erinevalt nad võivad välja näha, kuigi teevad täpselt sama asja! + +2. **Uuri nende päritolulugusid:** Mis teeb iga keele eriliseks? Siin on üks lahe fakt – iga programmeerimiskeel loodi, sest keegi mõtles, „Sa tead, peab olema parem viis selle konkreetse probleemi lahendamiseks.“ Kas suudad välja uurida, mis need probleemid olid? Mõned lood on tõeliselt huvitavad! -Nüüd, kui sul on see vinge alus olemas, on mul seiklus, mis aitab sul näha, kui uskumatult mitmekesine ja põnev programmeerimise maailm tegelikult on. Ja kuula – see ei ole veel koodi kirjutamine, nii et ära tunne survet! Mõtle end programmeerimiskeele detektiiviks oma esimesel põneval juhtumil! +3. **Tutvu kogukondadega:** Vaata, kui sõbralikud ja põnevad on iga keele kogukonnad. Mõnel on miljoneid arendajaid teadmisi jagamas ja teineteist aidamas, teised on väiksemad, aga väga tihedalt seotud ja toetavad. Sul saab olema tore näha, millised isiksused need kogukonnad on! -**Sinu missioon, kui valid selle vastu võtta:** -1. **Saa keelereisijaks:** Vali kolm programmeerimiskeelt täiesti erinevatest universumitest – võib-olla üks veebisaitide ehitamiseks, üks mobiilirakenduste loomiseks ja üks andmetöötluseks teadlastele. Leia näited ühest ja samast lihtsast ülesandest iga keele jaoks. Luban, et oled täiesti šokeeritud, kui erinevalt nad võivad sama asja teha! -2. **Avasta nende päritolulood:** Mis teeb iga keele eriliseks? Lahe fakt: iga programmeerimiskeel loodi, sest keegi mõtles: "Teate mis? Selle konkreetse probleemi lahendamiseks peab olema parem viis." Kas suudad välja uurida, millised probleemid need olid? Mõned lood on tõeliselt põnevad! -3. **Tutvu kogukondadega:** Vaata, kui sõbralikud ja kirglikud on iga keele kogukonnad. Mõnel on miljoneid arendajaid, kes teadmisi jagavad ja üksteist aitavad, teised on väiksemad, kuid väga kokkuhoidvad ja toetavad. Sa armud nende kogukondade eri iseloomudesse! -4. **Järgi sisetunnet:** Milline keel tundub praegu kõige ligipääsetavam? Ära muretse "täiusliku" valiku pärast – kuula lihtsalt oma instinkte! Siin pole vale vastust, ja alati saab hiljem teisi keeli uurida. +4. **Jälgi oma sisetunnet:** Milline keel tundub sulle praegu kõige ligipääsetavam? Ära stressa „täiusliku“ valiku pärast – lihtsalt kuula oma instinkte! Siin pole valesti vastuseid ja sul on alati võimalus hiljem teisi uurida. -**Boonusdetektiivitöö:** Uuri, millised suuremad veebisaidid või äpid on iga keelega ehitatud. Ma garanteerin, et oled üllatunud, kui saad teada, mis käitab Instagrami, Netflixi või seda mobiilimängu, mida sa ei suuda käest panna! +**Boonus detektiivitöö:** Uuri, kas suudad leida, millised suuremad veebisaidid või rakendused on iga keelega tehtud. Ma garanteerin, et sind šokeerib, mis annab Instagrami, Netflixi või selle mobiilimängu, mida sa ei suuda käest panna, jõu! -> 💡 **Pea meeles:** Sa ei ürita täna ühekski neist keeltest ekspertiks saada. Sa lihtsalt võtad tuttavaks naabruskonnaga, enne kui otsustad, kuhu tahad asutada oma pesa. Võta aega, naudi seda ja lase uudishimul end juhtida! +> 💡 **Pea meeles:** Sa ei püüa täna saada ühekski nendest keeltest eksperdiks. Sa lihtsalt tutvud naabruskonnaga enne, kui otsustad, kus oma baasi rajad. Võta aega, naudi ja lase uudishimul end juhatada! -## Tähistame, mida oled avastanud! +## Tähistame su avastusi! -Issand jumal, sa oled täna neelanud nii palju hämmastavat teavet! Ootan tõeliselt põnevusega, et näha, kui palju sellest imelise rännaku materjalist sinusse on jäänud. Ja pea meeles – see ei ole test, kus kõik peab olema täiuslik. See on pigem tähistamine kogu toreda õpitu üle selles huvitavas maailmas, kuhu sa nüüd sukeldud! +Issand jumal, sa oled täna omandanud nii palju hämmastavat teavet! Ma olen siiralt põnevil, et näha, kui suur osa sellest lahedast teekonnast on sinuni jõudnud. Ja pea meeles – see pole test, kus pead kõik täiuslikult ära tegema. See on pigem tähistamine kõigist lahedatest asjadest, mida oled selle põneva maailma kohta õppinud, kuhu sa just suundud! -[Lahenda õppetunni järeltest](https://ff-quizzes.netlify.app/web/) -## Ülevaade & Iseõppimine +[Teeme järelkontrolli viktoriini](https://ff-quizzes.netlify.app/web/) -**Võta aega, et uurida ja lõbutse sellega!** +## Kordamine ja iseseisev õppimine -Sa oled täna palju õppinud ning see on midagi, mille üle olla uhke! Nüüd tuleb lõbus osa – avastada teemasid, mis sinu uudishimu sütitasid. Pane tähele, see ei ole kodutöö – see on seiklus! +**Võta aega, uurides ja nautides!** +Sa oled täna palju ära teinud, ja selle üle võib uhke olla! Nüüd saab lõbus osa alguse – uurida teemasid, mis sinu uudishimu sütitavad. Pea meeles, see ei ole kodutöö – see on seiklus! -**Sukeldu sügavamale asjadesse, mis sind kõnetavad:** +**Sukeldu sügavamale selles, mis sind köidab:** -**Tee praktilist tutvust programmeerimiskeeltega:** -- Külasta ametlikke veebisaite 2-3 keeltele, mis sinu tähelepanu pälvisid. Igal keelel on oma iseloom ja lugu! -- Proovi mõnda veebipõhist koodi mänguvälja, nagu [CodePen](https://codepen.io/), [JSFiddle](https://jsfiddle.net/) või [Replit](https://replit.com/). Ära karda katsetada – sa ei saa midagi purustada! -- Loe, kuidas su lemmikprogrammikeel sündis. Ausalt, mõned tegelikud tekkeloostud on äärmiselt põnevad ja aitavad sul mõista, miks keeled töötavad nii nagu nad töötavad. +**Tööta käed küljes programmeerimiskeeltega:** +- Külasta ametlikke lehti 2–3 keele kohta, mis sinu tähelepanu püüdsid. Igal keelel on oma iseloom ja lugu! +- Proovi mõnda veebipõhist kodeerimisalad nagu [CodePen](https://codepen.io/), [JSFiddle](https://jsfiddle.net/) või [Replit](https://replit.com/). Ära karda katsetada – sa ei saa midagi ära rikkuda! +- Loe, kuidas sinu lemmik keel tekkis. Tõsiselt, mõned neist päritolulugudest on väga põnevad ja aitavad sul mõista, miks keeled töötavad nii nagu töötavad. -**Tutu oma uute tööriistadega:** -- Laadi alla Visual Studio Code, kui sul seda veel pole – see on tasuta ja sa saad seda armastama hakata! -- Veeda paar minutit laienduste turul ringi sirvides. See on nagu rakenduste pood sinu koodiredaktorile! -- Ava brauseri arendustööriistad ja klõpsa ringi. Ära muretse, kui kõigest aru ei saa – lihtsalt tutvu, mis seal olemas on. +**Tutu uute tööriistadega:** +- Laadi alla Visual Studio Code, kui sa seda veel pole teinud – see on tasuta ja sulle meeldib see kindlasti! +- Veeda paar minutit Extensions'i turuosa uurides. See on nagu rakenduste pood sinu koodiredaktorile! +- Ava oma brauseri Developer Tools ja klõpsa ringi. Ära muretse, et kõike vahetult kohe aru saad – lihtsalt harjuta, mis seal on. **Liitu kogukonnaga:** -- Jälgi mõnda arendajate kogukonda [Dev.to](https://dev.to/), [Stack Overflow](https://stackoverflow.com/) või [GitHub](https://github.com/) - programmeerijate kogukond on erakordselt sõbralik uustulnukate suhtes! -- Vaata YouTubes mõningaid algajatele mõeldud programmeerimisteemalisi videoid. Seal on nii palju toredaid loojad, kes mäletavad, mis tunne on alustajana. -- Mõtle kohalike kohtumiste või veebikogukondadega liitumisele. Usu mind, arendajad armastavad uustulnukatele abiks olla! +- Jälgi mõnda arendajate kogukonda nagu [Dev.to](https://dev.to/), [Stack Overflow](https://stackoverflow.com/) või [GitHub](https://github.com/). Programmeerijate kogukond on seal algajatele väga avatud! +- Vaata mõnda algajatele suunatud kodeerimise videot YouTube’is. Seal on nii palju suurepäraseid loojad, kes mäletavad hästi, mida tähendab alguses olla. +- Mõtle kohalikesse kohtumistes või veebikogukondadesse liitumisele. Usu mind, arendajad armastavad algajaid aidata! -> 🎯 **Kuula, mida ma tahan, et sa meeles peaksid**: Sinult ei oodata, et sa üleöö programmeerimisseisundisse satuksid! Praegu oled sa lihtsalt seda hämmastavat uut maailma tundma õppimas, millesse sa hakkad kuuluma. Võta oma aeg, naudi teekonda ja pea meeles – iga üks arendajatest, keda sa imetled, on olnud täpselt seal, kus sa praegu oled, tundes elevust ja ehk ka veidi ülekoormatust. See on täiesti normaalne ning tähendab, et sa teed õiget asja! +> 🎯 **Kuula, siin on mida tahan, et sa meeles peaksid**: Sinu käest ei oodata, et sa saaksid üleöö koodimaagiks! Praegu sa lihtsalt õpid tundma seda imelist uut maailma, mille osaks hakkad saama. Võta aega, naudi teekonda ja pea meeles – iga arendaja, keda sa imetled, istus kunagi täpselt seal, kus sina nüüd oled, tundes elevust ja võib-olla natuke hirmu või ärevust. See on täiesti normaalne ja see näitab, et sa teed asju õigesti! ## Ülesanne [Reading the Docs](assignment.md) -> 💡 **Väike tõuge su ülesande jaoks**: Ma väga tahaksin, et sa uuriksid mõningaid tööriistu, millest me pole veel rääkinud! Väldi toimetajaid, brausereid ja käsureatööriistu, millest me juba rääkisime – seal on suur uskumatult kõikehõlmav arendusvahendite universum, mis ootab avastamist. Otsi neid, mida aktiivselt hooldatakse ja millel on elavalt toetavad kogukonnad (neil on tavaliselt parimad õpetused ja kõige toetavamad inimesed, kui sa paratamatult kinni jääd ja sõbralikku abi vajad). +> 💡 **Väike tõuk sellest ülesandest**: Ma tõesti tahaksin näha, kuidas sa uurid mõningaid tööriistu, millest me pole veel rääkinud! Väldi redaktoreid, brausereid ja käsurea tööriistu, millest me juba rääkinud oleme – seal on terve uskumatu arengutööriistade universum, mis ootab avastamist. Otsi neid, mida aktiivselt hooldatakse ja kelle ümber on elujõuline ja abivalmis kogukond (need kipuvad omama parimaid juhendeid ja kõige toetavamaid inimesi, kui sa juhuslikult kinni jääd ja vajad sõbralikku abi). --- -## 🚀 Sinu programmeerimise teekonna ajajoon +## 🚀 Sinu programmeerimise teekonna ajakava -### ⚡ **Mida saad teha järgmise 5 minuti jooksul** -- [ ] Pane järjehoidjatesse 2-3 programmeerimiskeele veebisaiti, mis sinu tähelepanu pälvisid -- [ ] Laadi alla Visual Studio Code, kui sul seda veel pole -- [ ] Ava oma brauseri DevTools (F12) ja klõpsa ringi mistahes veebilehel +### ⚡ **Mida saad teha järgmise 5 minutiga** +- [ ] Lisa järjehoidjatesse 2–3 programmeerimiskeele veebisaiti, mis sind köitsid +- [ ] Laadi alla Visual Studio Code, kui sa pole seda veel teinud +- [ ] Ava oma brauseri DevTools (F12) ja klõpsa ringi mõnel veebilehel - [ ] Liitu ühe programmeerijate kogukonnaga (Dev.to, Reddit r/webdev või Stack Overflow) -### ⏰ **Mida saad täita selle tunni jooksul** -- [ ] Täida õppetunni järel test ja mõtiskle oma vastuste üle -- [ ] Seadista VS Code koos GitHub Copiloti laiendiga -- [ ] Proovi "Hello World" näidet kahes erinevas programmeerimiskeeles veebis -- [ ] Vaata YouTube'ist videot "Üks päev arendaja elus" -- [ ] Alusta oma programmeerimiskeele detektiivitööd (väljakutse raames) +### ⏰ **Mida saad saavutada selle tunni jooksul** +- [ ] Tee läbi tunni järeltest ja mõtiskle vastuste üle +- [ ] Sea VS Code üles koos GitHub Copilot laiendusega +- [ ] Proovi "Hello World" näidet 2 erinevas programmeerimiskeeles veebis +- [ ] Vaata YouTube’is videot "Päev arendaja elus" +- [ ] Alusta oma programmeerimiskeele uurimistööd (väljakutse raames) ### 📅 **Sinu nädalapikkune seiklus** -- [ ] Täida ülesanne ja avasta 3 uut arendusvahendit -- [ ] Jälgi 5 arendajat või programmeerimiskontot sotsiaalmeedias -- [ ] Proovi ehitada midagi väikest CodePenis või Replitis (isegi lihtsalt "Hello, [Sinu nimi]!") -- [ ] Loe ühe arendaja blogipostitust kellegi kodeerimise teekonnast -- [ ] Liitu virtuaalse kohtumisega või vaata programmeerimisteemalist loengut -- [ ] Alusta oma valitud keele õppimist veebipõhiste õpetustega - -### 🗓️ **Sinu kuupikkune muutus** -- [ ] Ehita oma esimene väike projekt (ka lihtne veebileht loeb!) -- [ ] Panusta avatud lähtekoodiga projekti (alusta dokumentide parandamisest) -- [ ] Juhenda kedagi, kes alles alustab programmeerimisega -- [ ] Loo oma arendajaportfoolio veebileht -- [ ] Võta ühendust kohalike arendajate kogukondade või õppegruppidega -- [ ] Alusta järgmise õpieesmärgi planeerimist - -### 🎯 **Lõpumõtiskluse kontroll** - -**Enne edasi liikumist võta hetk, et tähistada:** -- Mis on üks asi programmeerimises, mis sind täna rõõmustas? -- Millist tööriista või kontseptsiooni tahad kõigepealt avastada? -- Kuidas sa tunned selle programmeerimisteekonna alustamise kohta? -- Millist küsimust tahaksid praegu arendajalt küsida? +- [ ] Tee ülesanne ära ja uuri 3 uut arendustööriista +- [ ] Jälgi 5 arendajat või programmeerimise kontot sotsiaalmeedias +- [ ] Proovi midagi väikest ehitada CodePen’is või Replit’is (isegi lihtsalt „Tere, [Sinu nimi]!”) +- [ ] Loe ühte arendaja blogipostitust kellegi programmeerimisteekonnast +- [ ] Liitu virtuaalse kohtumisega või vaata programmeerimisloengut +- [ ] Alusta oma valitud keele õppimist veebipõhiste juhenditega + +### 🗓️ **Sinu kuupikkune muutumine** +- [ ] Tee oma esimene väike projekt valmis (isegi lihtne veebileht kõlbab!) +- [ ] Panusta avatud lähtekoodiga projekti (alusta dokumentatsiooniparandustega) +- [ ] Ole mentorkeeleks kellelegi, kes alles alustab oma programmeerimisrännaku algust +- [ ] Loo oma arendaja portfoolio veebileht +- [ ] Ühendu kohalike arendajate kogukondade või õpperühmadega +- [ ] Alusta järgmise õpimooduli kavandamist + +### 🎯 **Lõpumõtisklus** + +**Enne edasi minemist veeda hetk tähistamiseks:** +- Mis on üks asi programmeerimises, mis täna sind elevile ajas? +- Millist tööriista või mõistet tahaksid kõigepealt uurida? +- Kuidas sa end tunned selle programmeerimise teekonna alustamisel? +- Mis on üks küsimus, mida tahaksid praegu arendajalt küsida? ```mermaid journey - title Sinu Enesekindluse Rajamise Teekond + title Sinu Enesekindluse Tõstmise Teekond section Täna - Uudishimulik: 3: Sa - Ülekoormatud: 4: Sa - Elevil: 5: Sa - section Käesolev Nädal - Avastamine: 4: Sa - Õppimine: 5: Sa - Ühendamine: 4: Sa + Uudishimulik: 3: You + Ülekoormatud: 4: You + Põnevil: 5: You + section See Nädal + Avastamas: 4: You + Õppimas: 5: You + Ühendamas: 4: You section Järgmine Kuu - Ehitamine: 5: Sa - Enesekindel: 5: Sa - Aitamine Teisi: 5: Sa + Ehitamas: 5: You + Enesekindel: 5: You + Teisi Aitamas: 5: You ``` -> 🌟 **Pea meeles**: Iga ekspert on kunagi olnud algaja. Iga vanem arendaja on tundnud end täpselt nii nagu sina praegu – elevil, võib-olla veidi ülekoormatuna ja kindlasti uudishimulikuna, mis on võimalik. Sa oled imelises seltskonnas ning see teekond saab olema erakordne. Tere tulemast programmeerimise imelisse maailma! 🎉 +> 🌟 **Pea meeles**: Iga ekspert on olnud kord algaja. Iga kogenud arendaja on tundnud end just nii nagu sina praegu – elevil, võib-olla veidi hätta sattununa ja kindlasti uudishimulikuna võimaluste suhtes. Sa oled imelises seltskonnas ja see teekond saab olema imeline. Tere tulemast programmeerimise imedemaale! 🎉 --- **Vastutusest loobumine**: -See dokument on tõlgitud AI tõlketeenuse [Co-op Translator](https://github.com/Azure/co-op-translator) abil. Kuigi me püüame tagada täpsust, palun arvestage, et automaatsed tõlked võivad sisaldada vigu või ebatäpsusi. Originaaldokument oma algkeeles tuleks pidada autoriteetseks allikaks. Olulise teabe puhul soovitatakse kasutada professionaalset inimtõlget. Me ei vastuta selle tõlke kasutamisest tingitud arusaamatuste või valesti mõistmiste eest. +See dokument on tõlgitud tehisintellekti tõlketeenuse [Co-op Translator](https://github.com/Azure/co-op-translator) abil. Kuigi püüame täpsust, tuleb arvestada, et automaatsed tõlked võivad sisaldada vigu või ebatäpsusi. Originaaldokument oma emakeeles tuleks pidada autoriteetseks allikaks. Olulise teabe puhul soovitatakse kasutada professionaalset inimtõlget. Me ei vastuta selle tõlke kasutamisest tingitud arusaamatuste või valesti mõistmiste eest. \ No newline at end of file diff --git a/translations/et/AGENTS.md b/translations/et/AGENTS.md index 923f6bf36..1ff9516a5 100644 --- a/translations/et/AGENTS.md +++ b/translations/et/AGENTS.md @@ -2,27 +2,27 @@ ## Projekti ülevaade -See on hariduslik õppekava hoidla algajatele veebiarenduse põhialuste õpetamiseks. Õppekava on Microsoft Cloud Advocatesi poolt koostatud põhjalik 12-nädalane kursus, mis sisaldab 24 praktilist õpetust JavaScripti, CSSi ja HTMLi kohta. +See on hariduslik õppekava hoidla veebiarenduse põhialuste õpetamiseks algajatele. Õppekava on põhjalik 12-nädalane kursus, mille on välja töötanud Microsoft Cloud Advocates, pakkudes 24 praktilist tundi, mis hõlmavad JavaScripti, CSS-i ja HTML-i. ### Põhikomponendid -- **Hariduslik sisu**: 24 struktureeritud õpetust, mis on organiseeritud projekti-põhistesse moodulitesse -- **Praktilised projektid**: Terrarium, Klahvivajutuste mäng, Brauserilaiend, Kosmose mäng, Pangarakendus, Koodiredaktor ja tehisintellekti vestlusassistent -- **Interaktiivsed viktoriinid**: 48 viktoriini, igaühes 3 küsimust (enne ja pärast õpetust) -- **Mitmekeelne tugi**: Automaatne tõlge 50+ keelde GitHub Actionsi abil -- **Tehnoloogiad**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (tehisintellekti projektide jaoks) +- **Hariduslik sisu**: 24 struktureeritud tundi, mis on organiseeritud projektipõhistesse moodulitessse +- **Praktilised projektid**: terrarium, tippmäng, brauserilaiendus, kosmose-mäng, pangarakendus, koodiredaktor ja tehisintellekti vestlusassistent +- **Interaktiivsed viktoriinid**: 48 viktoriini, igaühes 3 küsimust (enne ja pärast tundi) +- **Mitmekeelne tugi**: automatiseeritud tõlked üle 50 keelde GitHub Actions abil +- **Tehnoloogiad**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (tehisintellekti projektide jaoks) ### Arhitektuur -- Hariduslik hoidla õpetuste põhise struktuuriga -- Igas õppetõe kaustas on README, koodinäited ja lahendused -- Sõltumatud projektid eraldi kaustades (quiz-app, erinevad õppetöö projektid) -- Tõlkesüsteem kasutades GitHub Actionsi (co-op-translator) -- Dokumentatsioon esitatakse Docsify kaudu ja on saadaval PDF-na +- Hariduslik hoidla õppetundide-põhise struktuuriga +- Iga õppetunni kaust sisaldab README-d, koodinäiteid ja lahendusi +- Sõltumatud projektid eraldiseisvates kataloogides (quiz-app, erinevad õppetundide projektid) +- Tõlkesüsteem kasutades GitHub Actions’i (co-op-translator) +- Dokumentatsioon on kättesaadav Docsify kaudu ja PDF-formaadis -## Seadistamiskäsud +## Paigaldamiskäsud -See hoidla on peamiselt mõeldud haridusliku sisu tarbimiseks. Spetsiifiliste projektidega töötamiseks: +See hoidla on peamiselt mõeldud haridusliku sisu tarbimiseks. Konkreetselt projektidega töötamiseks: ### Peahoidla seadistamine @@ -37,7 +37,7 @@ cd Web-Dev-For-Beginners cd quiz-app npm install npm run dev # Käivita arendusserver -npm run build # Koosta tootmiseks +npm run build # Ehita tootmiseks npm run lint # Käivita ESLint ``` @@ -48,18 +48,18 @@ cd 7-bank-project/api npm install npm start # Käivita API server npm run lint # Käivita ESLint -npm run format # See läbi Prettieriga +npm run format # Vorminda Prettieriga ``` -### Brauserilaiendite projektid +### Brauserilaienduse projektid ```bash cd 5-browser-extension/solution npm install -# Järgi brauserispetsiifilisi laienduste laadimise juhiseid +# Järgige brauseri-põhiseid laienduse laadimise juhiseid ``` -### Kosmose mängu projektid +### Kosmose mänguprojektid ```bash cd 6-space-game/solution @@ -67,42 +67,42 @@ npm install # Ava index.html brauseris või kasuta Live Serverit ``` -### Vestlusprojekti (Python taust) seadistamine +### Vestluse projekt (Python backend) ```bash cd 9-chat-project/solution/backend/python pip install openai -# Sea GITHUB_TOKEN keskkonnamuutuja +# Määra GITHUB_TOKEN keskkonnamuutuja python api.py ``` -## Arendusvoog +## Arendusprotsess ### Sisu panustajatele -1. **Tee hoidla fork** oma GitHubi kontole -2. **Klooni oma fork kohalikku keskkonda** -3. **Loo uus haru** oma muudatuste jaoks -4. Muuda õpetuse sisu või koodinäiteid -5. Testi koodimuudatusi vastavates projektikaustades -6. Esita pull request vastavalt panustamise juhistele +1. **Hargne hoidla** oma GitHubi kontole +2. **Klooni oma haru** lokaalselt +3. **Loo uus haru** oma muudatuste jaoks +4. Tee muudatusi õppetundide sisus või koodinäidetes +5. Testi kõiki koodimuudatusi vastavates projektikataloogides +6. Esita pull request'id vastavalt panustamise juhistele ### Õppijatele -1. Tee fork või klooni hoidla -2. Liigu õppetöö kaustade vahel järjestikku -3. Loe iga õppetöö README-faile -4. Täida enne õppetööd viktoriinid aadressil https://ff-quizzes.netlify.app/web/ -5. Töötle läbi koodinäited õppetöö kaustades -6. Täida ülesanded ja väljakutsed -7. Tee pärast õppetööd viktoriinid +1. Hargne või klooni hoidla +2. Liigu õppetundide kataloogides järjestikku +3. Loe iga õppetunni README faile +4. Tee ette-viktoriinid aadressil https://ff-quizzes.netlify.app/web/ +5. Töötle läbi koodinäited õppetundide kaustades +6. Täida ülesanded ja väljakutsed +7. Tee järel-viktoriinid ### Reaalajas arendus -- **Dokumentatsioon**: Käivita `docsify serve` juurkataloogis (port 3000) -- **Viktoriini rakendus**: Käivita `npm run dev` quiz-app kaustas -- **Projektid**: Kasuta VS Code Live Serveri laiendust HTML projektide jaoks -- **API projektid**: Käivita `npm start` vastavates API kaustades +- **Dokumentatsioon**: käivita `docsify serve` juurkataloogis (port 3000) +- **Viktoriini rakendus**: käivita `npm run dev` quiz-app kataloogis +- **Projektid**: kasuta VS Code Live Server laiendust HTML projektide jaoks +- **API projektid**: käivita `npm start` vastavates API kataloogides ## Testimise juhised @@ -119,164 +119,164 @@ npm run build # Kontrolli, kas ehitus õnnestub ```bash cd 7-bank-project/api npm run lint # Kontrolli koodistiili probleeme -node server.js # Kontrolli, kas server käivitub ilma vigadeta +node server.js # Kontrolli, et server käivituks ilma vigadeta ``` -### Üldine testimisviis +### Üldine testimise lähenemine -- Tegemist on haridusliku hoidla, millel puudub täielik automatiseeritud testide kogum -- Käsitsi testimine keskendub: - - Koodinäited töötavad ilma vigadeta - - Dokumentatsiooni lingid töötavad korrektselt - - Projektide build’id valmivad edukalt - - Näited järgivad häid tavasid +- See on hariduslik hoidla ilma ulatuslike automatiseeritud testideta +- Käsitsi testimine keskendub: + - Koodinäited jooksevad ilma vigadeta + - Dokumendis olevad lingid toimivad korrektselt + - Projektide ehitused õnnestuvad + - Näited järgivad parimaid tavasid -### Enne esitust tehtavad kontrollid +### Enne esitamist kontrollid -- Käivita `npm run lint` kaustades, kus on package.json -- Kontrolli markdown linkide kehtivust -- Testi koodinäiteid brauseris või Node.js-is -- Kontrolli, et tõlked säilitavad õiged struktuurid +- Käivita `npm run lint` kataloogides, kus on package.json +- Kontrolli, et markdown lingid on kehtivad +- Testi koodinäiteid brauseris või Node.js keskkonnas +- Veendu, et tõlked säilitavad õige struktuuri -## Koodistiili juhised +## Koodi stiili juhised ### JavaScript -- Kasuta kaasaegset ES6+ süntaksit -- Järgi projektides pakutud standardseid ESLinti konfiguratsioone -- Kasuta tähenduslikke muutujate ja funktsioonide nimesid hariduslikul eesmärgil -- Lisa kommentaare, mis selgitavad kontseptsioone õppijatele -- Vorminda Prettieriga, kui see on konfigureeritud +- Kasuta kaasaegset ES6+ süntaksit +- Järgi projektides pakutud ESLint konfiguratsioone +- Kasuta tähenduslikke muutujate ja funktsioonide nimesid haridusliku selguse tagamiseks +- Lisa kommentaare mõistete selgitamiseks õppijatele +- Vorminda Prettieriga seal, kus on seadistatud ### HTML/CSS -- Semantiline HTML5 elementide kasutus -- Reageeriv disainipõhimõtted -- Selged klassinime reeglid -- Kommentaarid, mis selgitavad CSS tehnikat õppijatele +- Semantiline HTML5 elemendid +- Reageeriv disaini põhimõtted +- Selged klassinimede konventsioonid +- Kommentaarid, mis selgitavad CSS-tehnikaid õppijatele ### Python -- Järgi PEP 8 stiilijuhiseid -- Selged, õppe-mõeldud koodinäited -- Tüübiviited, kus need aitavad õppimisel +- PEP 8 stiilijuhised +- Selged, hariduslikud koodinäited +- Tüüpi vihjed sealsamas, kus need aitavad õppimisel ### Markdown dokumentatsioon -- Selge pealkirjade hierarhia -- Koodiplokid keele määranguga -- Lingid täiendavatele ressurssidele -- Ekraanipildid ja pildid `images/` kaustades -- Piltide alternatiivtekst ligipääsetavuse jaoks +- Selge pealkirjade hierarhia +- Koodiblokid keelega märgistatud +- Lingid lisamaterjalide juurde +- Ekraanipildid ja pildid `images/` kataloogides +- Piltide alt-tekst ligipääsetavuseks ### Failide organiseerimine -- Õpetused nummerdatud järjestikku (1-getting-started-lessons, 2-js-basics jne) -- Igal projektil on `solution/` ning sageli ka `start/` või `your-work/` kaustad -- Pildid salvestatud konkreetsete õppetööde `images/` kaustades -- Tõlked asuvad `translations/{language-code}/` struktuuris +- Õppetunnid nummerdatud järjestikku (1-getting-started-lessons, 2-js-basics jne) +- Igal projektil on `solution/` ja tihti ka `start/` või `your-work/` kataloogid +- Pildid talletatud konkreetse õppetunni `images/` kaustas +- Tõlked `translations/{language-code}/` struktuuris -## Ehitus ja juurutamine +## Buildimine ja juurutamine -### Viktoriini rakenduse juurutus (Azure Static Web Apps) +### Viktoriini rakenduse juurutamine (Azure Static Web Apps) -Viktoriini rakendus on konfigureeritud Azure Static Web Apps juurutuseks: +Quiz-app on seadistatud Azure Static Web Apps-ile juurutamiseks: ```bash cd quiz-app -npm run build # Loob dist/ kausta -# Teeb juurutuse GitHub Actionsi töövoo kaudu, kui surutakse main harusse +npm run build # Loob kausta dist/ +# Rakendab GitHub Actionsi töövoo kaudu pushi korral põhisagarasse ``` -Azure Static Web Apps konfigureerimine: -- **Rakenduse asukoht**: `/quiz-app` -- **Väljundkaust**: `dist` -- **Töövoog**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` +Azure Static Web Apps konfiguratsioon: +- **Rakenduse asukoht**: `/quiz-app` +- **Väljundkaust**: `dist` +- **Töövoog**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` -### Dokumentatsiooni PDF loomine +### Dokumentatsiooni PDF genereerimine ```bash npm install # Installi docsify-to-pdf -npm run convert # Genereeri PDF dokumentidest +npm run convert # Genereeri PDF docsist ``` ### Docsify dokumentatsioon ```bash -npm install -g docsify-cli # Paigalda Docsify globaalsetena -docsify serve # Serveri localhost:3000 peal +npm install -g docsify-cli # Paigalda Docsify ülemaailmselt +docsify serve # Serveeri lokaalselt aadressil localhost:3000 ``` -### Projekti-spetsiifilised ehitused +### Projektipõhised ehitused -Igal projekti kaustal võib olla oma ehitusprotsess: -- Vue projektid: `npm run build` loob tootmis-paketid -- Staatilised projektid: ehitusastet ei ole, serveeritakse faile otse +Igal projekti kataloogil võib olla oma ehitusprotsess: +- Vue projektid: `npm run build` loob tootmiseks valmis paketid +- Staatilised projektid: ehitusastet ei ole, serveeritakse failid otse -## Pull request’i juhised +## Pull Request'i juhised ### Pealkirja formaat -Kasuta selgeid ja kirjeldavaid pealkirju, mis näitavad muudatuste valdkonda: -- `[Quiz-app] Lisa uus viktoriin õppetöö X jaoks` -- `[Lesson-3] Paranda kirjaviga terrarium projekti puhul` -- `[Translation] Lisa hispaania tõlge õppetöö 5 jaoks` -- `[Docs] Uuenda seadistamise juhiseid` +Kasuta selgeid ja kirjeldavaid pealkirju, mis näitavad muudatuse ala: +- `[Quiz-app] Lisa uus viktoriin õppetunni X jaoks` +- `[Lesson-3] Paranda trükiviga terrarium projekti juures` +- `[Translation] Lisa hispaania keelne tõlge õppetunnile 5` +- `[Docs] Uuenda paigaldusjuhiseid` ### Nõutavad kontrollid -Enne PR-i esitust: +Enne PR-i esitamist: -1. **Koodi kvaliteet**: - - Käivita `npm run lint` mõjutatud projektikaustades - - Paranda kõik lint vead ja hoiatused +1. **Koodi kvaliteet**: + - Käivita `npm run lint` mõjutatud projektikataloogides + - Paranda kõik lintimise vead ja hoiatused -2. **Ehituse kontroll**: - - Käivita `npm run build`, kui rakendub - - Veendu, et ehitusel puuduvad vead +2. **Buildi kontroll**: + - Käivita `npm run build`, kui see on aktuaalne + - Veendu, et build ei viska vigu -3. **Linkide kontroll**: - - Testi kõik markdown lingid - - Kontrolli piltide osutusi +3. **Lingide valideerimine**: + - Testi kõiki markdown linke + - Kontrolli pildiviiteid -4. **Sisu ülevaatamine**: - - Õigekeelsuse ja grammatika kontroll - - Veendu, et koodinäited on õiged ja hariduslikud - - Kontrolli tõlgete vastavust esialgsele tähendusele +4. **Sisu ülevaatus**: + - Paranda õigekirja ja grammatika vead + - Veendu, et koodinäited on õiged ja hariduslikud + - Kontrolli, et tõlked säilitavad algse tähenduse ### Panustamise nõuded -- Nõustu Microsoft CLA-ga (automaattest esimese PR ajal) -- Järgi [Microsofti avatud lähtekoodi käitumiskoodeksit](https://opensource.microsoft.com/codeofconduct/) -- Vaata üksikasjalikke juhiseid failist [CONTRIBUTING.md](./CONTRIBUTING.md) -- Viita probleeminumbritele PR kirjelduse puhul, kui kehtib +- Nõustu Microsoft CLA-ga (automaatne kontroll esimesel PR-il) +- Järgi [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) +- Vaata [CONTRIBUTING.md](./CONTRIBUTING.md) üksikasjalike juhiste jaoks +- Viita issue numbritele PR kirjelduse juures, kui sobib ### Ülevaatusprotsess -- PR-e vaatavad läbi haldajad ja kogukond -- Eristub hariduslik selgus -- Koodinäited peaksid järgima parimaid tavasid -- Tõlked vaadatakse üle täpsuse ja kultuurilise sobivuse jaoks +- PR-id üle vaatavad hooldajad ja kogukond +- Hariduslik selgus on esimene prioriteet +- Koodinäited peaksid järgima parimaid tavasid +- Tõlked kontrollitakse täpsuse ja kultuurilise sobivuse osas ## Tõlkesüsteem -### Automaatne tõlge +### Automatiseeritud tõlge -- Kasutab GitHub Actionsi koos co-op-translator töövooga -- Tõlgib automaatselt 50+ keelde -- Allikafailid paiknevad peamistes kaustades -- Tõlgitud failid on `translations/{language-code}/` kaustades +- Kasutab GitHub Actions’i koos co-op-translator töövooga +- Tõlgib automaatselt üle 50 keelde +- Allikfailid paiknevad peakaustades +- Tõlgitud failid on `translations/{language-code}/` kataloogides -### Käsitsi tõlke täienduste lisamine +### Käsitsi tõlke parenduste lisamine -1. Leia fail kaustast `translations/{language-code}/` -2. Tee parandused säilitades struktuuri -3. Veendu, et koodinäited jäävad toimima -4. Testi kõiki lokaliseeritud viktoriinisisusid +1. Leia fail kataloogist `translations/{language-code}/` +2. Tee parendused, säilitades struktuuri +3. Veendu, et koodinäited jäävad töökorras +4. Testi kõiki lokaliseeritud viktoriine ### Tõlke metaandmed -Tõlgitud failidel on metaandmete päis: +Tõlgitud failid sisaldavad metaandmetega päist: ```markdown -**Vastutusest loobumine**: -See dokument on tõlgitud kasutades tehisintellektil põhinevat tõlkesüsteemi [Co-op Translator](https://github.com/Azure/co-op-translator). Kuigi püüame tagada täpsust, palun arvestage, et automaatsed tõlked võivad sisaldada vigu või ebatäpsusi. Originaaldokument selle emakeeles tuleks pidada autoriteetseks allikaks. Olulise teabe puhul soovitame kasutada professionaalset inimtõlget. Me ei vastuta selle tõlke kasutamisest tulenevate arusaamatuste või valesti mõistmiste eest. +**Tähelepanek**: +See dokument on tõlgitud kasutades tehisintellekti tõlketeenust [Co-op Translator](https://github.com/Azure/co-op-translator). Kuigi püüame tagada täpsust, palun arvestage, et automaatsed tõlked võivad sisaldada vigu või ebatäpsusi. Originaaldokument selle emakeeles tuleks pidada usaldusväärseks allikaks. Olulise teabe puhul soovitatakse professionaalset inimtõlget. Me ei vastuta selle tõlke kasutamisest tulenevate arusaamatuste ega valesti mõistmiste eest. \ No newline at end of file diff --git a/translations/et/README.md b/translations/et/README.md index 4b5db39a6..c952f3599 100644 --- a/translations/et/README.md +++ b/translations/et/README.md @@ -10,201 +10,213 @@ [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -# Veebiarendus algajatele – Õppekava +# Veebiarendus algajatele - õppekava -Õpi veebiarenduse põhialuseid meie 12-nädalase põhjaliku kursusega, mida viivad läbi Microsoft Cloud Advocates. Kõik 24 õppetundi süvenevad JavaScripti, CSS-i ja HTML-i praktiliste projektide kaudu, näiteks terrariumid, brauserilaiendid ja kosmose mängud. Osale viktoriinides, aruteludes ja praktilistes ülesannetes. Paranda oma oskusi ja optimeeri teadmiste meeldejätmist meie tõhusa projektipõhise pedagoogikaga. Alusta oma programmeerimisteekonda juba täna! +Õppige veebiarenduse aluseid meie 12-nädalase põhjaliku kursusega, mida viivad läbi Microsoft Cloud Advocates. Iga 24 õppetundi süveneb JavaScripti, CSS-i ja HTML-i tundmaõppimisse praktiliste projektide kaudu, nagu terrariumid, brauserilaiendused ja kosmosemängud. Osalege viktoriinides, aruteludes ja praktilistes ülesannetes. Parandage oma oskusi ja optimeerige teadmiste omandamist meie tõhusa projektipõhise pedagoogika abil. Alustage oma programmeerimisteekonda juba täna! -Liitu Azure AI Foundry Discordi kogukonnaga +Liituge Azure AI Foundry Discordi kogukonnaga [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) Järgige neid samme, et alustada nende ressursside kasutamist: -1. **Jaga hoidlaga**: Klõpsake [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) +1. **Tehke fork**: Klõpsake [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) 2. **Kloonige hoidla**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -3. [**Liitu Azure AI Foundry Discordiga ning kohtuge ekspertide ja teiste arendajatega**](https://discord.com/invite/ByRwuEEgH4) +3. [**Liituge Azure AI Foundry Discordiga ja kohtuge ekspertide ning kaasarendajatega**](https://discord.com/invite/ByRwuEEgH4) -### 🌐 Mitmekeelne tugi +### 🌐 Mitmekeelse toe võimalus -#### Toetatud GitHub Actioni kaudu (automatiseeritud ja alati ajakohane) +#### Tugineb GitHub Actionile (automatiseeritud ja alati ajakohane) [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](./README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) -> **Eelistad kohalikku kloonimist?** - -> See hoidla sisaldab üle 50 keele tõlget, mis suurendab oluliselt allalaadimismahtu. Tõlgeteta kloonimiseks kasuta harva allalaaditava sisuga kloonimist (sparse checkout): +> **Eelistate kohalikku kloonimist?** +> +> See hoidla sisaldab üle 50 keele tõlget, mis suurendab allalaadimismahu oluliselt. Tõlgeteta kloonimiseks kasutage sparsel checkouti: +> +> **Bash / macOS / Linux:** > ```bash > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > cd Web-Dev-For-Beginners > git sparse-checkout set --no-cone '/*' '!translations' '!translated_images' > ``` -> See annab sulle kõik vajaliku kursuse läbimiseks palju kiiremalt. +> +> **CMD (Windows):** +> ```cmd +> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git +> cd Web-Dev-For-Beginners +> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" +> ``` +> +> See annab teile kõik vajaliku kursuse läbimiseks palju kiirema allalaadimisega. -**Kui soovid toetada täiendavaid tõlkekeeli, on nende loetelu [siin](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** +**Kui soovite lisada uusi toetatud tõlkekeeli, on need loetletud [siin](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) -#### 🧑‍🎓 _Oled tudeng?_ +#### 🧑‍🎓 _Oled õpilane?_ -Külasta [**Tudengikeskuse lehte**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kus leiad algajale suunatud ressursid, tudengipakid ja isegi võimalused saada tasuta sertifikaadikupong. See on leht, mille soovid järjehoidjaks panna ja aeg-ajalt külastada, sest sisu uuendatakse igakuiselt. +Külasta [**Öpilaskeskuse lehte**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), kus leiad algajatele mõeldud ressursse, õpilaspakette ja isegi võimalusi saada tasuta sertifikaadikuponge. See on leht, mida soovid järjehoidjatesse lisada ja aeg-ajalt vaadata, sest sisu uuendatakse iga kuu. -### 📣 Teade – Uued väljakutsed GitHub Copilot Agent režiimis, mida lõpuni viia! +### 📣 Teade - uued GitHub Copilot Agendi režiimi väljakutsed täitmiseks! -Lisandus uus väljakutse, otsi enamikest peatükkidest "GitHub Copilot Agent Challenge 🚀". See on uus väljakutse, mida saad täita GitHub Copilot ja Agent režiimi abil. Kui sa pole varem Agent režiimi kasutanud, siis see suudab mitte ainult teksti genereerida, vaid ka faile luua ja muuta, käivitada käske ja palju muud. +Uus väljakutse lisatud, otsi enamikes peatükkides "GitHub Copilot Agent Challenge 🚀". See on uus väljakutse teile, mida täita GitHub Copiloti ja agendi režiimi abil. Kui te ei ole varem agendi režiimi kasutanud, on see võimeline genereerima mitte ainult teksti, vaid ka looma ja redigeerima faile, käivitama käske ja muud. -### 📣 Teade – _Uus generatiivse tehisintellekti abil ehitatav projekt_ +### 📣 Teade - _uus projekt, mille saab luua Generatiivse AI abil_ -Lisandus uus AI assistendi projekt, vaata lähemalt [projektist](./9-chat-project/README.md) +Uus AI assistendi projekt on just lisatud, vaata projekti [siit](./9-chat-project/README.md) -### 📣 Teade – _Uus Generative AI õppekava JavaScriptile_ +### 📣 Teade - _Uus õppekava_ Generatiivse AI kohta JavaScriptile on just välja antud -Ära jäta vahele meie uut Generatiivse AI õppekava! +Ära jää ilma meie uuest Generatiivse AI õppekavast! -Alusta aadressil [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)! +Külasta [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) alustamiseks! ![Background](../../translated_images/et/background.148a8d43afde5730.webp) -- Õppetunnid käsitlevad kõike alates põhitõdedest kuni RAG-ni. -- Suhtle ajalooliste tegelastega GenAI ja meie kaasrakenduse abil. -- Lõbus ja kaasahaarav jutustus, kus rändad ajas! +- Õppetunnid hõlmavad kõike alates algteadmistest kuni RAG-ini. +- Suhtle ajalooliste tegelastega GenAI ja meie kaaslase rakenduse abil. +- Lõbus ja kaasahaarav jutustus, kus sa rändad ajas! ![character](../../translated_images/et/character.5c0dd8e067ffd693.webp) -Iga õppetund sisaldab sooritamiseks ülesannet, teadmiste kontrolli ja väljakutset, mis aitavad õpitavates valdkondades nagu: -- Päringute koostamine ja päringute inseneritehnika -- Teksti ja pildirakenduste genereerimine +Iga õppetund sisaldab täidetavat ülesannet, teadmiste kontrolli ja väljakutset, mis juhib õppimist teemadel nagu: +- Käsutamine ja käsu koostamine +- Teksti- ja pildirakenduste genereerimine - Otsingurakendused -Alusta aadressil [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)! +Külasta [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) alustamiseks! ## 🌱 Alustamine -> **Õpetajad**, me oleme lisanud mõned soovitused [siin](for-teachers.md), kuidas seda õppekava kasutada. Hindame väga teie tagasisidet [meie arutelufoorumis](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! +> **Õpetajad**, oleme lisanud [mõningaid soovitusi](for-teachers.md), kuidas seda õppekava kasutada. Ootame teie tagasisidet [meie arutelufoorumis](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! -**[Õppijad](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, alustage iga õppetundi eeloengu viktoriiniga, järgige loengumaterjali lugemist, sooritage erinevad tegevused ja kontrollige arusaamist järelõppe viktoriiniga. +**[Õppijad](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, iga õppetunni puhul alustage eel-loengu viktoriiniga ja jätkake õppetükiga, täites erinevaid tegevusi ja kontrollides arusaamist järel-loengu viktoriiniga. -Õppimise kogemuse parandamiseks looge ühendus oma eakaaslastega, et koos projektidega töötada! Arutelud on teretulnud meie [arutelufoorumis](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kus meie moderaatorite meeskond on valmis teie küsimustele vastama. +Õppimiskogemuse parandamiseks ühenduge oma eakaaslastega, et koos projekte teha! Arutelud on julgustatud meie [arutelufoorumis](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kus meie moderaatorimeeskond vastab teie küsimustele. -Veelgi rohkem õppimiseks soovitame tungivalt uurida [Microsoft Learni](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) lisastudiumimaterjale. +Haridusteekonna süvendamiseks soovitame tungivalt uurida [Microsoft Learni](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) täiendavaid õppematerjale. ### 📋 Keskkonna seadistamine -Sellel õppekaval on valmis arenduskeskkond! Kursuse alustamisel võid valida selle käivitamise [Codespace’is](https://github.com/features/codespaces/) (_brauseripõhine, pole vaja midagi paigaldada_), või kohalikult oma arvutis tekstitöötlusprogrammi nagu [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) abil. +Sellel õppekaval on arenduskeskkond kohe kasutamiseks valmis! Alustades võite valida, kas kasutada õppekava [Codespaces](https://github.com/features/codespaces/) keskkonnas (_brauseripõhine, installimist mitte nõudev keskkond_) või oma arvutis lokaalselt tekstiredaktorit, näiteks [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). #### Loo oma hoidla -Selleks, et oleks lihtsam oma tööd salvestada, soovitatakse luua selle hoidla koopia. Seda saad teha, klõpsates lehe ülaosas nuppu **Use this template**. See loob uue hoidla sinu GitHubi kontole koos õppekava koopiaga. +Selleks, et oma tööd hõlpsasti salvestada, soovitame luua oma koopia sellest hoidlast. Seda saab teha, klõpsates lehe ülaosas nuppu **Use this template**. See loob uue hoidla teie GitHubi kontole koos õppekava koopiaga. -Järgi neid samme: -1. **Jaga hoidlaga**: Klõpsa selle lehe paremas ülanurgas nuppu "Fork". +Järgige neid samme: +1. **Tehke fork**: Klõpsake selle lehe paremas ülanurgas nuppu "Fork". 2. **Kloonige hoidla**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -#### Õppekava käivitamine Codespaces keskkonnas +#### Õppekava käitamine Codespaces keskkonnas -Selles hoidla koopias, mille lõid, klõpsa nuppu **Code** ja vali **Open with Codespaces**. See loob sulle uue Codespace’i töötamiseks. +Oma loodud hoidla koopias klõpsake nuppu **Code** ja valige **Open with Codespaces**. See loob teile uue Codespace'i, kus tööd teha. ![Codespace](../../translated_images/et/createcodespace.0238bbf4d7a8d955.webp) -#### Õppekava käivitamine kohalikult arvutis +#### Õppekava käitamine lokaalselt oma arvutis -Selle õppekava kohalikuks käivitamiseks vajad tekstitöötlusprogrammi, brauserit ja käsurea tööriista. Meie esimene õppetund, [Sissejuhatus programmeerimiskeeltesse ja tööriistadesse](../../1-getting-started-lessons/1-intro-to-programming-languages), juhatab sind läbi erinevate võimaluste ning aitab valida sobivad tööriistad. +Õppekava lokaalseks käivitamiseks vajate tekstiredaktorit, veebilehitsejat ja käsurea tööriista. Meie esimene õppetund, [Sissejuhatus programmeerimiskeeltesse ja tööriistadesse](../../1-getting-started-lessons/1-intro-to-programming-languages), juhendab teid erinevate võimaluste valikul iga tööriista jaoks. -Soovitame kasutada [Visual Studio Code’i](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) tekstiredaktorina, millel on ka sisseehitatud [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code’i saad alla laadida [siit](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). - - -1. Kloonige oma hoidla oma arvutisse. Seda saad teha, klõpsates nuppu **Code** ja kopeerides URL: +Soovitame kasutada [Visual Studio Code'i](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) redaktorina, millel on sisseehitatud [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code'i saate alla laadida [siit](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +1. Kopeeri oma hoidla arvutisse. Seda saad teha, klõpsates nuppu **Code** ning kopeerides URL-i: [CodeSpace](./images/createcodespace.png) -Seejärel ava [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) [Visual Studio Code'i](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) sees ja käivita järgmine käsk, asendades `` äsja kopeeritud URL-iga: + + Seejärel ava [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) sees ning käivita järgmine käsk, asendades `` just äsja kopeeritud URL-iga: ```bash git clone ``` - -2. Ava kaust Visual Studio Code'is. Seda saad teha, klõpsates **File** > **Open Folder** ja valides äsja kloonitud kausta. -> Soovitatud Visual Studio Code laiendused: +2. Ava Visual Studio Code’is kaust. Seda saad teha, klõpsates **File** > **Open Folder** ning valides kausta, mille just kloonisid. + + +> Soovitatud Visual Studio Code'i laiendused: > -> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) – HTML-lehtede eelvaate kuvamiseks Visual Studio Code'is -> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) – aitab sul koodi kiiremini kirjutada - -## 📂 Iga õppetund sisaldab: - -- valikuline visand -- valikuline lisavidin -- eelõppe soojendus-quiz -- kirjalik õppetund -- projektipõhiste õppetundide korral samm-sammult juhised projekti ehitamiseks -- teadmiste kontroll -- väljakutse -- lisalugemine -- ülesanne -- [järgnev quiz](https://ff-quizzes.netlify.app/web/) - -> **Märkused quizide kohta**: Kõik quizid asuvad Quiz-app kaustas, kokku 48 quiz'i, igas kolm küsimust. Need on kättesaadavad [siin](https://ff-quizzes.netlify.app/web/). Quiz-rakendust saab käivitada lokaalselt või paigaldada Azure'i; järgi juhiseid `quiz-app` kaustas. - -## 🗃️ Õppetunnid - -| | Projekti nimi | Õppekäsitlused | Õpieesmärgid | Seotud õppetund | Autor | -| :-: | :------------------------------------------------------: | :------------------------------------------------------------------: | ---------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | -| 01 | Alustamine | Programmeerimise ja tööriistade tutvustus | Õpi programmeerimiskeelte alustalasid ja tarkvara, mis aitab arendajatel tööd teha | [Sihtprogrammide ja tööriistade sissejuhatus](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | -| 02 | Alustamine | GitHub'i alused, meeskonnatöö | Õpi kasutama GitHubi projektis ja koostööd koodibaasil | [GitHub'i alused](./1-getting-started-lessons/2-github-basics/README.md) | Floor | -| 03 | Alustamine | Ligipääsetavus | Õpi veebipõhise ligipääsetavuse aluseid | [Ligipääsetavuse alused](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | -| 04 | JS algtõed | JavaScripti andmetüübid | JavaScripti andmetüüpide alused | [Andmetüübid](./2-js-basics/1-data-types/README.md) | Jasmine | -| 05 | JS algtõed | Funktsioonid ja meetodid | Õpi rakenduse loogika juhtimise funktsioonide ja meetodite kohta | [Funktsioonid ja meetodid](./2-js-basics/2-functions-methods/README.md) | Jasmine ja Christopher | -| 06 | JS algtõed | Otsuste tegemine JS abil | Õpi, kuidas koodis luua tingimusi otsustusmeetodite abil | [Otsuste tegemine](./2-js-basics/3-making-decisions/README.md) | Jasmine | -| 07 | JS algtõed | Massiivid ja tsüklid | Töötle andmeid massiivide ja tsüklite abil JavaScriptis | [Massiivid ja tsüklid](./2-js-basics/4-arrays-loops/README.md) | Jasmine | -| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML praktikas | Ehitada HTML, et luua veebiterrarium, keskendudes paigutuse loomisele | [Sissejuhatus HTML-i](./3-terrarium/1-intro-to-html/README.md) | Jen | -| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS praktikas | Ehita CSS veebiterrariumi stiiliks, keskendudes CSS põhialustele sh lehe reageerivusele | [Sissejuhatus CSS-i](./3-terrarium/2-intro-to-css/README.md) | Jen | -| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScripti sulgemised, DOM manipulatsioon | Ehita JavaScript, mis teeb terrariumi lohistamiskogemuseks, keskendudes sulgemistele ja DOM manipulatsioonile | [JavaScript sulgemised, DOM manipulatsioon](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | -| 11 | [Typing Game](./4-typing-game/solution/README.md) | Tippimismängu ehitamine | Õpi kasutama klaviatuurisündmusi oma JavaScripti rakenduse loogika juhtimiseks | [Sündmustepõhine programmeerimine](./4-typing-game/typing-game/README.md) | Christopher | -| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Brauseritega töötamine | Õpi, kuidas brauserid toimivad, nende ajalugu ja kuidas esimesed elemendid brauserilaienduse jaoks üles seada | [BROWSERID](./5-browser-extension/1-about-browsers/README.md) | Jen | -| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Vormide loomine, API kasutamine ja muutujate salvestamine kohalikku salve | Ehita oma brauserilaienduse JavaScripti osad API kutsumiseks ja kohalikku salvesse muutujate salvestamiseks | [API-d, vormid ja kohalik salvestus](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | -| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Brauseril taustaprotsessid, veebitöötluse optimeerimine | Kasuta brauseri taustaprotsesse laiendi ikooni haldamiseks; õpi veebitöötluse ja optimeerimisvõtteid | [Taustatöö ja jõudlus](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | -| 15 | [Space Game](./6-space-game/solution/README.md) | Täiustatud mänguarendus JavaScriptiga | Õpi pärandamist nii klasside kui kompositsiooni kaudu ning Pub/Sub mudelit, et valmistuda mängu ehitamiseks | [Täpsem mänguarendus](./6-space-game/1-introduction/README.md) | Chris | -| 16 | [Space Game](./6-space-game/solution/README.md) | Joonistamine Canvasel | Õpi Canvas API kasutamist elementide joonistamiseks ekraanile | [Joonistamine Canvasel](./6-space-game/2-drawing-to-canvas/README.md) | Chris | -| 17 | [Space Game](./6-space-game/solution/README.md) | Elementide liigutamine ekraanil | Avastage, kuidas objektid saavad liikuma kardiniaalsete koordinaatide ja Canvas API abil | [Elementide liigutamine](./6-space-game/3-moving-elements-around/README.md) | Chris | -| 18 | [Space Game](./6-space-game/solution/README.md) | Kokkupõrgete tuvastamine | Pane objektid põrkama ja teineteisega reageerima klahvivajutuste abil, lisa jahutuse funktsioon mängu jõudluse tagamiseks | [Kokkupõrgete tuvastamine](./6-space-game/4-collision-detection/README.md) | Chris | -| 19 | [Space Game](./6-space-game/solution/README.md) | Tulemustabeli hoidmine | Tee matemaatilisi arvutusi mängu oleku ja jõudluse põhjal | [Tulemustabeli hoidmine](./6-space-game/5-keeping-score/README.md) | Chris | -| 20 | [Space Game](./6-space-game/solution/README.md) | Mängu lõpetamine ja taaskäivitamine | Õpi mängu lõpetamise ja taaskäivitamise protsessidest, sh ressursside vabastamine ja muutujate lähtestamine | [Lõpetingimus](./6-space-game/6-end-condition/README.md) | Chris | -| 21 | [Banking App](./7-bank-project/solution/README.md) | Veebirakenduse HTML mallid ja marsruutimine | Õpi, kuidas luua mitme leheküljega veebilehe arhitektuur, kasutades marsruutimist ja HTML malle | [HTML mallid ja marsruudid](./7-bank-project/1-template-route/README.md) | Yohan | -| 22 | [Banking App](./7-bank-project/solution/README.md) | Sisselogimis- ja registreerimisvorm | Õpi vormide loomist ja valideerimise haldamist | [Vormid](./7-bank-project/2-forms/README.md) | Yohan | -| 23 | [Banking App](./7-bank-project/solution/README.md) | Andmete pärimine ja kasutamine | Kuidas andmed sinu rakendusse sisenevad ja sealt väljuvad, kuidas neid pärida, salvestada ja lõpetada | [Andmed](./7-bank-project/3-data/README.md) | Yohan | -| 24 | [Banking App](./7-bank-project/solution/README.md) | Staatuse halduse kontseptsioonid | Õpi, kuidas rakenduses hallata ja programmiliselt kontrollida olekut | [Oleku haldus](./7-bank-project/4-state-management/README.md) | Yohan | -| 25 | [Browser/VScode Code](../../8-code-editor) | VScode kasutamine | Õpi kasutama koodi redaktorit | [VScode koodi redaktori kasutamine](./8-code-editor/1-using-a-code-editor/README.md) | Chris | -| 26 | [AI Assistants](./9-chat-project/README.md) | Tehisintellekti kasutamine | Õpi looma oma AI assistenti | [AI assistendi projekt](./9-chat-project/README.md) | Chris | +> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - HTML-lehtede eelvaade Visual Studio Code’is +> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - aitab kirjutada koodi kiiremini + +## 📂 Iga õppetükk sisaldab: + +- valikulist visandit +- valikulist täiendavat videot +- soojendusharjutust enne tundi +- kirjalikku õppetükki +- projektipõhiste õppetükkide puhul samm-sammulisi juhendeid, kuidas projekti ehitada +- teadmiste kontrolli küsimustikke +- väljakutset +- täiendavat lugemist +- ülesannet +- [pärastundi viktoriini](https://ff-quizzes.netlify.app/web/) + +> **Märkus viktoriinide kohta**: Kõik viktoriinid asuvad Quiz-app kaustas, kokku 48 viktoriini, milles igas on kolm küsimust. Need on kättesaadavad [siin](https://ff-quizzes.netlify.app/web/). Viktoriini rakendus saab käivitada lokaalselt või paigaldada Azure’i; järgige juhiseid `quiz-app` kaustas. + +## 🗃️ Õppetükid + +| | Projekti nimi | Õpitavad kontseptsioonid | Õpieesmärgid | Seotud õppetükk | Autor | +| :-: | :-------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | +| 01 | Alustamine | Sissejuhatus programmeerimisse ja tööriistadesse | Õpi programmeerimiskeelte põhialuseid ja tarkvara, mis aitab professionaalsel arendajal tööd teha | [Sissejuhatus programmeerimiskeeltesse ja tööriistadesse](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | Alustamine | GitHub põhialused, sh meeskonnatöö | Kuidas kasutada GitHubi projektis ja kuidas meeskonnana koodil koos töötada | [Sissejuhatus GitHubi](./1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | Alustamine | Juurdepääsetavus | Õpi veebipõhise juurdepääsetavuse aluseid | [Juurdepääsetavuse alused](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | JS põhitõed | JavaScripti andmetüübid | JavaScripti andmetüüpide põhialused | [Andmetüübid](./2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS põhitõed | Funktsioonid ja meetodid | Õpi funktsioonidest ja meetoditest rakenduse loogika juhtimisel | [Funktsioonid ja meetodid](./2-js-basics/2-functions-methods/README.md) | Jasmine ja Christopher | +| 06 | JS põhitõed | Otsuste tegemine JS-ga | Õpi, kuidas luua tingimusi oma koodis otsustuste tegemise meetodite abil | [Otsuste tegemine](./2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS põhitõed | Massiivid ja tsüklid | Töötle andmeid JavaScripti massiivide ja tsüklite abil | [Massiivid ja tsüklid](./2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML praktikas | Ehita HTML, et luua veebipõhine terrarium, keskendudes paigutuse loomisele | [Sissejuhatus HTML-i](./3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS praktikas | Ehita CSS veebiterrariumi kujundamiseks, keskendudes CSS põhialustele ja lehe reageerivusele | [Sissejuhatus CSS-i](./3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScripti sulgemised, DOM-i manipuleerimine | Ehita JavaScript, mis muudab terrariumi lohistatavaks kasutajaliideseks, keskendudes sulgemistele ja DOM-i manipuleerimisele | [JavaScript sulgemised ja DOM-i manipuleerimine](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [Tippimismäng](./4-typing-game/solution/README.md) | Tippimismängu loomine | Õpi kasutama klaviatuuri sündmusi, et juhtida oma JavaScripti rakenduse loogikat | [Sündmuspõhine programmeerimine](./4-typing-game/typing-game/README.md) | Christopher | +| 12 | [Roheline brauserilaiend](./5-browser-extension/solution/README.md) | Brauseritega töötamine | Õpi, kuidas brauserid töötavad, nende ajalugu ja kuidas luua brauserilaiendi esimesed elemendid | [Brauserite kohta](./5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [Roheline brauserilaiend](./5-browser-extension/solution/README.md) | Vormide loomine, API kutsumine ja muutujate salvestamine lokaalsesse mällu | Ehita brauserilaiendi JavaScripti osad API kutsumiseks, kasutades lokaalsesse mällu salvestatud muutujaid | [API-d, vormid ja lokaalne mälu](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [Roheline brauserilaiend](./5-browser-extension/solution/README.md) | Taustaprotsessid brauseris, veebitööjõudlus | Kasuta brauseri taustaprotsesse laiendi ikooni juhtimiseks; õpi veebitööjõudlusest ja mõningatest optimeerimistest | [Taustaprotsessid ja tööjõudlus](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [Kosmosemäng](./6-space-game/solution/README.md) | Täiustatud mänguarendus JavaScriptiga | Õpi pärandamise kohta klasside ja koostise kaudu ning Pub/Sub mustrit, ettevalmistuseks mängu loomiseks | [Täiustatud mänguarenduse sissejuhatus](./6-space-game/1-introduction/README.md) | Chris | +| 16 | [Kosmosemäng](./6-space-game/solution/README.md) | Joonistamine lõuendile | Õpi Canvas API kasutamist ekraanile elementide joonistamiseks | [Joonistamine lõuendile](./6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [Kosmosemäng](./6-space-game/solution/README.md) | Elementide liigutamine ekraanil | Avastage, kuidas elementidele anda liikumist kasutades kaarteesia koordinaate ja Canvas API-d | [Elementide liigutamine](./6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [Kosmosemäng](./6-space-game/solution/README.md) | Kokkupõrke tuvastamine | Tee elementide kokkupõrked ja reageerimine kasutades klahvivajutusi ning lisa jahutusfunktsioon, mis tagab mängu sujuvuse | [Kokkupõrke tuvastamine](./6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [Kosmosemäng](./6-space-game/solution/README.md) | Skoriga arvestamine | Tee matemaatilisi arvutusi mängu staatuse ja jõudluse alusel | [Skoori pidamine](./6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [Kosmosemäng](./6-space-game/solution/README.md) | Mängu lõpetamine ja taaskäivitamine | Õpi mängu lõpetamise ja taaskäivitamise kohta, sh ressursside puhastamine ja muutuja väärtuste lähtestamine | [Lõputingimus](./6-space-game/6-end-condition/README.md) | Chris | +| 21 | [Pangarakendus](./7-bank-project/solution/README.md) | HTML mallid ja marsruudid veebirakenduses | Õpi, kuidas luua mitmeleheküljelise veebilehe arhitektuuri tugistruktuur marsruutimise ja HTML mallide abil | [HTML mallid ja marsruudid](./7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [Pangarakendus](./7-bank-project/solution/README.md) | Logimise ja registreerimise vormi loomine | Õpi vormide loomist ja valideerimise teostamist | [Vormid](./7-bank-project/2-forms/README.md) | Yohan | +| 23 | [Pangarakendus](./7-bank-project/solution/README.md) | Andmete pärimise ja kasutamise meetodid | Kuidas andmed voolavad sinu rakendusse ja sealt välja, kuidas neid pärida, salvestada ja eemaldada | [Andmed](./7-bank-project/3-data/README.md) | Yohan | +| 24 | [Pangarakendus](./7-bank-project/solution/README.md) | Seisundihalduse kontseptsioonid | Õpi, kuidas sinu rakendus säilitab seisundit ja kuidas seda programmeeritult hallata | [Seisundihaldus](./7-bank-project/4-state-management/README.md) | Yohan | +| 25 | [Brauser/VScode Kood](../../8-code-editor) | Töötamine VScode'iga | Õpi, kuidas kasutada koodiredaktorit| [Kasuta VScode koodiredaktorit](./8-code-editor/1-using-a-code-editor/README.md) | Chris | +| 26 | [Tehisintellekti assistendid](./9-chat-project/README.md) | Töötamine tehisintellektiga | Õpi, kuidas ehitada oma tehisintellekti assistent | [Tehisintellekti assistendi projekt](./9-chat-project/README.md) | Chris | ## 🏫 Pedagoogika -Meie õppekava on loodud kahe peamise pedagoogilise printsiibi alusel: -* projektipõhine õpe -* sagedased testid +Meie õppekava on kavandatud kahe peamise pedagoogilise põhimõtte järgi: +* projektipõhine õpe +* sagedased viktoriinid + +Programm õpetab JavaScripti, HTML-i ja CSS-i põhialuseid ning uusimaid tööriistu ja tehnikaid, mida kasutavad tänapäeva veebiarendajad. Õpilastel on võimalus praktiliselt kogeda, ehitades tippimismängu, virtuaalse terrariumi, keskkonnasõbraliku brauserilaiendi, kosmose-invader stiilis mängu ja pangarakenduse ettevõtetele. Perioodi lõpuks omandavad õpilased tugeva arusaama veebiarendusest. -Programm õpetab JavaScripti, HTML-i ja CSS-i põhialuseid ning tänapäevaste veebiarendajate kasutatavaid uusimaid tööriistu ja meetodeid. Õpilased saavad praktilise kogemuse, luues tippimismängu, virtuaalse terrariumi, keskkonnasõbraliku brauserilaienduse, kosmosesissetungiva stiilis mängu ja pangarakenduse ettevõtetele. Sarja lõpus on õpilastel kindel arusaam veebiarendusest. +> 🎓 Võid esimesed paar õppetükki sellest õppekavast läbida ka [Õppeteekina](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) Microsoft Learn platvormil! -> 🎓 Võid võtta selle õppekava esimesed õppetunnid Microsoft Learn’i [Õppeteekina](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon)! +Sisule vastavate projektide abil tehakse õppimisprotsess kaasahaaravamaks ning mõistete meeldejätmine paraneb. Kirjutasime ka mitu algõpetust JavaScripti põhialuste kohta, tutvustamaks mõisteid koos videoga "[Algajate sari: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", mille mõned autorid panustasid sellesse õppekavasse. -Sisuga, mis on kooskõlas projektidega, muutub õppeprotsess õpilastele kaasahaaravamaks ja kontseptsioonide meeldejätmine paremini toimivaks. Samuti kirjutasime mitu JavaScripti baasõppetundi, et tutvustada kontseptsioone, kombineerituna videoga "[Algajate sari: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" videotundide kogumikust, mille autorid sellest õppekavast osa võtsid. +Lisaks seab klassieelse lihtsalt stressivaba viktoriiniga õpilase eesmärgi konkreetse teema õppimiseks, ning teine viktoriin klassijärgsel ajal tagab teadmiste edasi kinnistamise. See õppekava on loodud olema paindlik ja lõbus ning seda saab läbida tervikuna või osaliselt. Projektid alustavad väikestest ja muutuvad 12-nädalase tsükli jooksul järjest keerukamaks. -Lisaks seab madala panusega quiz enne tundi õpilase fookuse teema õppimisele, ja teine quiz tunni järel aitab veelgi teadmisi kinnistada. See õppekava on mõeldud paindlikuks ja lõbusaks ning seda saab võtta tervikuna või osade kaupa. Projektid algavad väikselt ja muutuvad 12-nädalase tsükli lõpuks järjest keerukamaks. +Kuigi oleme teadlikult hoidunud JavaScripti raamistikest, et keskenduda esmalt vajalikele oskustele veebiarendajana enne raamistikku omaksvõttu, võiks järgmine samm selle õppekava lõpetamisel olla Node.js õppimine teise videosarja kaudu: "[Algajate sari: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". -Kuigi oleme teadlikult vältinud JavaScripti raamistikute tutvustamist, et keskenduda esmalt veebiarendajana vajalikele põhioskustele enne raamistikku omaksvõttu, oleks järgmine samm selle õppekava lõpetamisel õppida Node.js kohta teise videotundide sarja kaudu: "[Algajate sari: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". +> Vaata meie [käitumisreegleid](CODE_OF_CONDUCT.md) ja [panustamise juhiseid](CONTRIBUTING.md). Oleme avatud konstruktiivsele tagasisidele! -> Visiit meie [käitumisjuhisele](CODE_OF_CONDUCT.md) ja [panustamise](CONTRIBUTING.md) suunistele. Ootame sinu konstruktiivset tagasisidet! -## 🧭 Offline ligipääs +## 🧭 Võimalus töötada offline -Seda dokumentatsiooni saab kasutada võrguühenduseta, kasutades [Docsify](https://docsify.js.org/#/). Pane see repo fork ja paigalda oma arvutisse [Docsify](https://docsify.js.org/#/quickstart). Selles repo juurkaustas käivita `docsify serve`. Veebileht on kättesaadav pordi 3000 kaudu sinu kohaliku arvutis: `localhost:3000`. +Seda dokumentatsiooni saad kasutada offline režiimis, kasutades [Docsify](https://docsify.js.org/#/). Hargne see hoidla, [paigalda Docsify](https://docsify.js.org/#/quickstart) oma arvutisse ja seejärel käivita hoidla juurkataloogis käsk `docsify serve`. Veebileht on kättesaadav aadressil `localhost:3000` pordil 3000. ## 📘 PDF +Kõigi õppetundide PDF-versiooni leiate siit [here](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). + -Kõik õppetunnid koos PDF-ina on saadaval [siin](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). +## 🎒 Teised kursused -## 🎒 Muud kursused -Meie meeskond toodab ka teisi kursusi! Vaadake lähemalt: +Meie meeskond toodab ka teisi kursusi! Vaadake: ### LangChain @@ -213,7 +225,7 @@ Meie meeskond toodab ka teisi kursusi! Vaadake lähemalt: [![LangChain for Beginners](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin) --- -### Azure / Edge / MCP / Agents +### Azure / Edge / MCP / Agendid [![AZD for Beginners](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst) [![Edge AI for Beginners](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst) [![MCP for Beginners](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst) @@ -221,7 +233,7 @@ Meie meeskond toodab ka teisi kursusi! Vaadake lähemalt: --- -### Generative AI Series +### Generatiivse tehisintellekti seeria [![Generative AI for Beginners](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Generative AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst) [![Generative AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst) @@ -229,7 +241,7 @@ Meie meeskond toodab ka teisi kursusi! Vaadake lähemalt: --- -### Core Learning +### Põhiline õppimine [![ML for Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![Data Science for Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![AI for Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) @@ -240,7 +252,7 @@ Meie meeskond toodab ka teisi kursusi! Vaadake lähemalt: --- -### Copilot Series +### Copiloti seeria [![Copilot for AI Paired Programming](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) [![Copilot for C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) [![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) @@ -248,21 +260,21 @@ Meie meeskond toodab ka teisi kursusi! Vaadake lähemalt: ## Abi saamine -Kui takerdud või sul on küsimusi tehisintellekti rakenduste loomise kohta, liitu teiste õppijate ja kogenud arendajatega MCP aruteludes. See on toetav kogukond, kus küsimused on teretulnud ja teadmisi jagatakse vabalt. +Kui teil tekib takistusi või küsimusi AI-rakenduste loomisel, liituge teiste õppijate ja kogenud arendajatega aruteludes MCP kohta. See on toetav kogukond, kus küsimused on teretulnud ja teadmisi jagatakse vabalt. [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -Kui sul on toote tagasisidet või tekib ehitamise käigus vigu, külastage: +Kui teil on toodete kohta tagasisidet või ehitamise ajal ilmnevad vead, külastage: [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) ## Litsents -See hoidla on litsentseeritud MIT litsentsi alusel. Lisateabe saamiseks vaata [LICENSE](../../LICENSE) faili. +See hoidla on litsentseeritud MIT litsentsi all. Lisateabe saamiseks vaadake faili [LICENSE](../../LICENSE). --- -**Loaandmene**: -See dokument on tõlgitud tehisintellekti tõlketeenuse [Co-op Translator](https://github.com/Azure/co-op-translator) abil. Kuigi püüame tagada tõlke täpsust, palun arvestage, et automatiseeritud tõlked võivad sisaldada vigu või ebatäpsusi. Originaaldokument oma algkeeles tuleks pidada usaldusväärseks allikaks. Olulise info puhul soovitatakse kasutada professionaalse inimese tõlget. Me ei vastuta võimalike arusaamatuste ega valesti mõistmiste eest, mis võivad tekkida selle tõlke kasutamisest. +**Vastutusest loobumine**: +See dokument on tõlgitud kasutades tehisintellekti tõlketeenust [Co-op Translator](https://github.com/Azure/co-op-translator). Kuigi püüame tagada täpsust, palun pidage meeles, et automaatsed tõlked võivad sisaldada vigu või ebatäpsusi. Originaaldokument selle algkeeles tuleks pidada autoriteetseks allikaks. Kriitilise informatsiooni puhul soovitatakse kasutada professionaalset inimtõlget. Me ei vastuta ühegi arusaamatuse ega valesti mõistmise eest, mis võib tuleneda sellest tõlkest. \ No newline at end of file diff --git a/translations/pcm/.co-op-translator.json b/translations/pcm/.co-op-translator.json index 567fc2b98..c3cb706ef 100644 --- a/translations/pcm/.co-op-translator.json +++ b/translations/pcm/.co-op-translator.json @@ -1,7 +1,7 @@ { "1-getting-started-lessons/1-intro-to-programming-languages/README.md": { - "original_hash": "d45ddcc54eb9232a76d08328b09d792e", - "translation_date": "2026-01-08T20:01:06+00:00", + "original_hash": "bec5e35642176d9e483552bfc82996d8", + "translation_date": "2026-03-06T15:37:07+00:00", "source_file": "1-getting-started-lessons/1-intro-to-programming-languages/README.md", "language_code": "pcm" }, @@ -493,7 +493,7 @@ }, "AGENTS.md": { "original_hash": "a362efd06d64d4134a0cfe8515a86d34", - "translation_date": "2026-02-06T19:11:09+00:00", + "translation_date": "2026-03-06T15:40:35+00:00", "source_file": "AGENTS.md", "language_code": "pcm" }, @@ -516,8 +516,8 @@ "language_code": "pcm" }, "README.md": { - "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc", - "translation_date": "2026-02-06T19:06:35+00:00", + "original_hash": "a2c9eed480687319517c08a6319e5536", + "translation_date": "2026-03-06T15:33:54+00:00", "source_file": "README.md", "language_code": "pcm" }, diff --git a/translations/pcm/1-getting-started-lessons/1-intro-to-programming-languages/README.md b/translations/pcm/1-getting-started-lessons/1-intro-to-programming-languages/README.md index 583d31624..48fd3d9a5 100644 --- a/translations/pcm/1-getting-started-lessons/1-intro-to-programming-languages/README.md +++ b/translations/pcm/1-getting-started-lessons/1-intro-to-programming-languages/README.md @@ -1,12 +1,12 @@ # Introduction to Programming Languages and Modern Developer Tools -Hey deh, future developer! 👋 Make I yan you wetin dey always give me goosebumps every single day? You dey ready to sabi say programming no be only about computers – e be like say you get actual superpowers to bring your wildest ideas come life! +Hey deh, oga developer wey go be! 👋 Make I yan you sometin wey dey always give me goosebumps everyday? You dey go discover say programming no be just about computers – na like you get real superpowers to make your wildest ideas come alive! -You sabi dat moment wen you dey use your favorite app and e just dey work perfectly? Wen you tap one button and something magical happen wey go make you talk "wow, how dem take DO am?" Well, na person just like you – fit be wey dey sit for dem favorite coffee shop for 2 AM with their third espresso – na im write the code wey create that magic. And make I yan you wetin go scatter your brain: by the end of this lesson, you no go only understand how dem take do am, you go dey excited to try am yourself! +You sabi dat moment wen you dey use your favourite app and everytin just dey work perfectly? Wen you tap button and sometin magical happen wey make you yan "wow, how dem take DO am?" Well, pesin wey be like you – fit dey their favourite coffee shop for 2 AM with their third espresso – na im write di code wey make dat magic happen. And dis one go scatter your brain: by di end of dis lesson, you no go only sabi how dem do am, but you go dey itching to try am by yourself! -Look, I understand am if programming fit dey scare you now. When I first start, I really believe say you need to be some kind math genius or say you don dey code since you be small pikin. But wetin change my mind completely be say: programming na just like learning how to talk for new language. You go start with "hello" and "thank you," then you go move go ordering coffee, and before you know am, you dey talk serious tori! But for this case, na computer you dey talk to, and honestly? Dem be the most patient padi wey you fit get – dem no dey judge your mistake and dem dey ready to try again anytime! +Look, I totally understand if programming dey scary now. Wen I first start, I truth truth believe say you need to be some kind math genius or don dey code since you be pikin. But dis one change my mind: programming na like how you dey learn to yarn for new language. You start with "hello" and "thank you," then you fit order coffee, and before you know am, you dey yarn serious deep philosophical talk! But for here, you dey yarn with computers, and truth be say? Dem be the most patient people wey you get – dem no dey judge your mistake and dem dey always happy to try again! -Today, we go explore the correct tools wey dey make modern web development no be only possible, but e also dey very addictive. I dey talk about the same editors, browsers, and workflows wey developers for Netflix, Spotify, and your favorite indie app studio dey use every single day. And here na the part wey go make you dance with joy: most of these professional-grade, industry-standard tools na totally free! +Today, we go explore the beta tools wey make modern web development no just possible, but e dey addictive serious. I dey talk about the exact editors, browsers, and workflows wey developers for Netflix, Spotify, and your favourite indie app studio dey use everyday. And here be di part wey go make you do happy dance: most of dis professional-grade, industry-standard tools na free! ![Intro Programming](../../../../translated_images/pcm/webdev101-programming.d6e3f98e61ac4bff.webp) > Sketchnote by [Tomomi Imura](https://twitter.com/girlie_mac) @@ -27,58 +27,58 @@ journey Tool Exploration: 5: You Community Connection: 5: You ``` -## Make We See Wetin You Sabi Before! +## Make We See Wetin You Don Sabi! -Before we jump enter di fun matter dem, I dey curious – wetin you don sabi about dis programming world? And make you hear me, if you dey look these questions dey think "I no understand anything about any of dis," no wahala at all, e perfect! That one mean say you dey exactly the correct place. Make you think of dis quiz like exercise before workout – we dey just warm up brain muscles! +Before we jump enter di fun tin dem, I dey curious – wetin you don sabi about dis programming world? And listen, if you dey look these question dem dey think "I no get any clue at all about any of dis," dat no be problem, e perfect! E mean say you dey exactly the right place. Treat this quiz like warm up before workout – na to ginger those brain muscles! -[Take the pre-lesson quiz](https://forms.office.com/r/dru4TE0U9n?origin=lprLink) +[Take the pre-lesson quiz](https://ff-quizzes.netlify.app/web/) -## The Adventure We Dey Go Together +## The Adventure Wey We Dey Go Enter Together -Okay, I dey really happy for wetin we go explore today! Seriously, I wish say I fit see your face wen some of these things go click for your head. Here na the amazing journey we go take together: +Okay, I full ground with excitement for wetin we go explore today! Seriously, I wish I fit see your face wen some of these concepts click. Here na the beta journey we dey go together: -- **Wetin programming really be (and why e be the coolest thing ever!)** – We go learn how code na the invisible magic wey dey power everything for your side, from that alarm wey sabi say na Monday morning be this, to the algorithm wey beta arrange your Netflix recommendations -- **Programming languages and their different personalities** – Imagine say you dey waka enter party and everybody get different superpowers and ways to solve problem. That na how programming language world dey be, and you go enjoy to meet dem! -- **The basic building blocks wey make digital magic happen** – Think am like the best creative LEGO set. Once you sabi how these parts join together, you go realize say you fit build anything way your imagination talk -- **Professional tools wey go make you feel like person wey get wizard wand** – I no dey exaggerate here – these tools go really make you feel say you get superpowers, and the best part? Na the same ones pros dey use! +- **Wetn programming really be (and why e be the coolest tins ever!)** – We go discover how code be the invisible magic wey power everytin around you, from that alarm wey sabi say na Monday morning, to the algorithm wey dey select correct Netflix recommendations for you +- **Programming languages and their amazing personalities** – Imagine say you enter party wey every pesin get different superpowers and ways to solve problem. Dat na how programming language world be, and you go enjoy to meet dem! +- **The fundamental building blocks wey make digital magic happen** – Think of dem like ultimate creative LEGO set. Once you sabi how dem pieces take join, you go realize say you fit build anything wey your imagination fit dream up +- **Professional tools wey go make you feel like say dem give you wizard wand** – I no dey exaggerate here – these tools go really make you feel like say you get superpowers, and di beta part? Na the same ones pros dey use! -> 💡 **Here na the mata**: No even try memorize everything today! Now now, I just want make you see the excitement about wetin fit happen. The small small details go sure naturally as we dey practice together – na so real learning dey happen! +> 💡 **Listen here**: No try memorise everytin today! Right now, I just want make you feel that excitement spark about wetin fit happen. The details go stick naturally as we dey practice – na so real learning dey happen! -> You fit do this lesson for [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon)! +> You fit do this lesson for [Microsoft Learn](https://learn.microsoft.com/en-us/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon)! ## So Wetin Exactly *Be* Programming? -Alright, make we tackle the big question: wetin be programming, really? +Alright, make we handle di million-dollar question: wetin be programming, really? -I go tell you story wey totally change how I dey see this matter. Last week, I dey try explain to my mama how to use our new smart TV remote. I catch myself dey talk like "Press the red button, but no be the big red button, na the small red button for left... no, your other left... okay, hold am for two seconds, no be one, no be three..." E sound familiar? 😅 +I go tell you story wey change how I take think. Last week, I try tell my mama how to use our new smart TV remote. I catch myself yan like "Press di red button, but no di big red button, na di small red button for left... no, your oda left... okay, now hold am for two seconds, no be one, no be three..." You don ever hear dat kain tin? 😅 -That na programming! Na art of giving very detailed, step by step instructions to something wey powerful but need make you talk am well well. Except say no be to your mama you dey explain (wey fit ask "which red button?!"), na computer you dey talk to (wey just dey do exactly wetin you talk, even if wetin you talk no be wetin you mean). +Dat na programming! Na art of giving extra-detailed instructions, step-by-step to somtin wey powerful but dem need say everytin suppose clear like dat. But instead of tell your mama (wey fit ask "which red button?!"), you dey explain to computer (wey go do exactly wetin you talk, even if na small mistake you make). -Make I talk wetin scatter my mind when I first learn this: computers be actually pretty simple for inside. Dem only sabi two things – 1 and 0, wey be basically "yes" and "no" or "on" and "off." Na im e be! But the magic come be say – we no need talk 1 and 0 like say we dey The Matrix. Na so programming languages enter the matter. Dem be like say you get the best translator wey dey take your normal human brain talk and turn am to computer language. +The thing wey shock me when I first learn dis: computers na simple tins for inside. Dem only sabi two tins – 1 and 0, wey be like “yes” and “no” or “on” and “off.” Na dat one! But e get the magic part – we no need talk 1 and 0 like we dey for The Matrix. Na so **programming languages** dey help. Dem be like best translator wey fit take your normal human talk, convert am to computer language. -And the thing wey still dey give me goosebumps every morning when I wake up be say: everything digital for your life start from person wey just like you, fit dey with pajamas, sip coffee, dey type code for laptop. That Instagram filter wey make you fine? Somebody code am. The recommendation wey bring your new favorite song? Developer build that algorithm. The app wey help you divide dinner bills with your padi dem? Ehn, person talk say "this one dey bother, I fit fix am" and then... dem fix am! +And dis one still dey give me chills every morning wen I wake up: literally *everytin* digital for your life start with pesin wey be like you, fit dey pajamas with cup of coffee, dey type code for laptop. That Instagram filter wey make you fine? Somebody code am. The recommendation wey show you new favourite song? Developer build dat algorithm. The app wey help you share dinner bill? Yes o, person think "dis one dey annoying, I fit fix am" and dem do am! -When you learn programming, you no dey just gain new skill – you join one amazing community of people wey dey solve problem. Dem dey spend dia days dey think, "Wetin if I fit build something wey go make person day better small?" Honestly, e get anything wey sweet pass that? +When you learn programming, you no dey just pick new skill – you dey join amazing community of problem-solvers wey dey think, "Wetin if I build sometin to make somebody day better small?" Honestly, nothing beta pass dat. -✅ **Fun Fact Hunt**: Here na some beta tins to check when you get free time – who you think na the world’s first computer programmer? I go give you hint: e no fit be who you expect! The story behind this person na fascinating one and e show say programming don always be about creative problem-solving and thinking outside the box. +✅ **Fun Fact Hunt**: Make you find time look this one – who you think be world first computer programmer? I go give you hint: e fit no be who you dey expect! The story behind dis pesin na jara gidigba, e show say programming don always be about creative problem-solving and thinking outside the box. ### 🧠 **Check-in Time: How You Dey Feel?** -**Take small time to think:** -- E make sense to you now say "giving instructions to computers" mean? -- You fit think of one daily work wey you fit automate with programming? -- Wetin questions dey your mind about this whole programming matter? +**Take little time reflect:** +- The idea say "you dey give instructions to computers" make sense to you so? +- Fit think daily task wey you go like automate with programming? +- Wetin questions dey your mind about dis whole programming thing? -> **Remember**: E normal if some of the ideas dey confuse you now. Learning programming na like learning new language – e take time make your brain build the pathways. You dey do well! +> **Remember**: E normal make some tin dem dey fuzzy for now. Learning programming na like learning new language – e go take your brain time to build those neural pathway dem. You dey do well! -## Programming Languages Be Like Different Flavors Of Magic +## Programming Languages Na Different Flavors of Magic -Okay, this one go sound funny, but stay with me – programming languages dey like different types of music. Think am: you get jazz wey smooth and free style, rock wey powerful and straight forward, classical wey sophisticated and arranged well, plus hip-hop wey creative and expressive. Each style get dia own vibe, dia own fans wey full passion, and each one perfect for different mood and occasion. +Okay, dis one go sound strange small, but abeg follow me – programming languages dem resemble different kinds music. Think about am: you get jazz wey smooth and spontaneous, rock wey powerful and straightforward, classical wey elegant and arranged, and hip-hop wey creative and expressive. Every style get im own vibe, community of fans wey like am, and every one beta for different mood and occasion. -Programming languages dey work same way! You no go use the same language to build fun mobile game wey you go use to process plenty climate data, just like you no go play death metal for yoga class (well, most yoga classes sef! 😄). +Programming languages dey work same way! You no go use the same language build mobile game wey go be fun as you go use take crunch heavy climate data, same way you no go play death metal for yoga class (well, most yoga classes o! 😄). -But wetin dey scatter my mind every time I think about am be say: these languages be like say you get the patientst, smartest interpreter for di world wey sidon gidigba beside you. You fit express your ideas naturally as human, and dem go do all the waka to turn am into 1s and 0s wey computer sabi talk. E be like say you get padi wey fluent for both "human creativity" and "computer logic" – and dem no dey tire, no dey need coffee break, and dem no ever dey judge you if you ask same question two times! +But this one dey always blow my mind: these languages be like the most patient, smartest interpreter for world dey beside you. You fit express your idea in way wey go feel natural to your human brain, and dem go do all the complex work to change am to 1s and 0s wey computers sabi. E be like friend wey sabi both “human creativity” and “computer logic” well well – and dem no ever tire, dem no need coffee break, and dem no go shout you if you ask same question twice! ### Popular Programming Languages and Their Uses @@ -123,31 +123,31 @@ mindmap ``` | Language | Best For | Why It's Popular | |----------|----------|------------------| -| **JavaScript** | Web development, user interfaces | E dey run for browsers and e dey power interactive websites | -| **Python** | Data science, automation, AI | Easy to read and sabi, powerful libraries | -| **Java** | Enterprise applications, Android apps | E no depend on platform, e strong for big big systems | -| **C#** | Windows applications, game development | E get strong Microsoft ecosystem support | -| **Go** | Cloud services, backend systems | Fast, simple, e design for modern computing | +| **JavaScript** | Web development, user interfaces | Makes browsers run and builds interactive website dem | +| **Python** | Data science, automation, AI | Easy to read and learn, power libraries | +| **Java** | Enterprise applications, Android apps | Works anywhere, strong for big systems | +| **C#** | Windows applications, game development | Strong Microsoft support | +| **Go** | Cloud services, backend systems | Fast, simple, made for modern computing | ### High-Level vs. Low-Level Languages -Okay, this one na the concept wey scatter my brain when I first start learning, so I go tell you analogy wey make am clear for me – I hope e help you also! +Okay, dis one be the concept wey confuse me well when I first start learning, so I go share analogy wey finally make am clear for me – I hope e still help you! -Imagine say you dey visit country wey you no sabi language, and you really need find nearest toilet (everybodi don waka this road, abi? 😅): +Imagine say you dey visit country wey you no sabi language, and you basically need find bathroom quick quick (everybody don haf been there, abi? 😅): -- **Low-level programming** na like say you sabi the local dialect well well, so you fit yan the old woman wey dey sell fruit corner this corner wit cultural things, local slang, and inside jokes wey only person wey grow there go understand. E sweet and very efficient... if you fluent! But e go just stress you if na only restroom you dey find. +- **Low-level programming** be like you sabi local language well, so you fit yarn with old woman wey dey sell fruit for corner, with inside jokes, local slang wey only person wey grow inside country go understand. Na beta level and dey quick if you sabi well! But e heavy if na only bathroom you dey find. -- **High-level programming** na like say you get beta local padi wey understand you well. You fit talk "I really need to find restroom" for plain English, and e go translate everything and carry you go the toilet in way wey your non-local brain go understand. +- **High-level programming** be like that your local friend wey just dey understand you well well. You fit talk "I need find bathroom" for plain English, and dem go translate everything and give you direction wey your non-local brain go understand. For programming: -- **Low-level languages** (like Assembly or C) dey allow you talk detailed talk with computer actual hardware, but you must reason like machine, which be... ehn, make we just say e big mental adjustment! -- **High-level languages** (like JavaScript, Python, or C#) dey let you think like human while dem dey do all the machine talk for back scenes. Plus, dem get communities full of people wey remember when dem be new and dey really ready to help! +- **Low-level languages** (like Assembly or C) let you yarn detailed talk with computer hardware, but you gats think like machine, which be big change for brain! +- **High-level languages** (like JavaScript, Python, or C#) let you think like human as dem handle machine talk for background. Plus, dem get huge communities wey remember say dem bi newb and dem dey willing to help! -Guess which one I go tell you make you start with? 😉 High-level languages na like training wheels wey you no even want remove because dem just dey make am better to learn! +Guess which ones I go recommend you start with? 😉 High-level languages na like training wheels wey you no go ever want remove because dem make everything beta! ```mermaid flowchart TB - A["👤 Human Thought:
'I wan calculate Fibonacci numbers'"] --> B{Choose Language Level} + A["👤 Human Tink:
'I wan calculate Fibonacci number dem'"] --> B{Choose Language Level} B -->|High-Level| C["🌟 JavaScript/Python
Easy to read and write"] B -->|Low-Level| D["⚙️ Assembly/C
Direct hardware control"] @@ -164,18 +164,18 @@ flowchart TB style D fill:#fff3e0 style H fill:#e8f5e8 ``` -### Make I Show You Why High-Level Languages Dey More Friendly +### Make I Show You Why High-Level Languages Dey Friendlier -Alright, I go show you something wey go show why I fall in love with high-level languages, but first – make you promise me one thing. When you see that first code example, no fear! E suppose look like say e heavy. Na exactly wetin I dey yan be that! +Alright, I go show you something where e clear why I fall in love with high-level languages, but first – make you promise me one tin. When you see the first code example, no panic! E suppose look scary. Na exactly wetin I dey try show! -We go look the same task wey write for two complete different styles. Both go create wetin dem dey call Fibonacci sequence – na beautiful mathematical pattern wey every number na the sum of the two number before am: 0, 1, 1, 2, 3, 5, 8, 13... (Fun fact: you go find this pattern everywhere for nature – like sunflower seed spirals, pine cone shapes, even galaxy way dem form!) +We go look same task wey dem write for two different styles. Both na to create Fibonacci sequence – na beta mathematical pattern wey every number na sum of two previous: 0, 1, 1, 2, 3, 5, 8, 13... (Fun fact: you fit find this pattern everywhere for nature – sunflower seed spirals, pinecone patterns, even galaxy shape!) -Ready to see di difference? Make we go! +Ready to see difference? Make we go! **High-level language (JavaScript) – Human-friendly:** ```javascript -// Step 1: Basic Fibonacci setup na so we go start Fibonacci setup +// Step 1: Simple Fibonacci arrangement const fibonacciCount = 10; let current = 0; let next = 1; @@ -183,32 +183,32 @@ let next = 1; console.log('Fibonacci sequence:'); ``` -**Dis code dey do this:** -- **Declare** constant wey go talk how many Fibonacci number we go generate -- **Initialize** two variables to track current and next number for sequence +**Wetin this code dey do:** +- **Declare** constant to show how many Fibonacci numbers we wan generate +- **Initialize** two variables to dey track current and next numbers inside sequence - **Set up** starting values (0 and 1) wey define Fibonacci pattern -- **Show** one header message to identify our output +- **Display** header message to show our output ```javascript -// Step 2: Make di sequence wit loop +// Step 2: Make di sequence wit one loop for (let i = 0; i < fibonacciCount; i++) { console.log(`Position ${i + 1}: ${current}`); - // Calculate di next number for di sequence + // Find di next number for di sequence const sum = current + next; current = next; next = sum; } ``` -**Make we break down wetin dey happen here:** -- **Loop** through every position for our sequence using `for` loop -- **Show** each number with im position using template literal formatting +**Break down wetin dey happen here:** +- **Loop** through every position for our sequence with `for` loop +- **Display** every number plus im position with template literal format - **Calculate** next Fibonacci number by adding current and next values -- **Update** our tracking variables to move to next number +- **Update** our tracking variables to move to next round ```javascript -// Step 3: How we dey do am wit new style +// Step 3: Modern functional way to do am const generateFibonacci = (count) => { const sequence = [0, 1]; @@ -219,16 +219,16 @@ const generateFibonacci = (count) => { return sequence; }; -// How you go take use am example +// How to take use am example const fibSequence = generateFibonacci(10); console.log(fibSequence); ``` -**For this one, we:** -- **Create** reusable function using modern arrow function syntax -- **Build** array to store complete sequence instead of showing one by one -- **Use** array indexing to calculate each new number from previous ones -- **Return** complete sequence to use anyhow for other parts of program +**Inside dis one, we don:** +- **Create** reusable function with modern arrow syntax +- **Build** array to keep full sequence instead of showing one by one +- **Use** array indexing to calculate new number from previous ones +- **Return** full sequence for flexible use for other parts of program **Low-level language (ARM Assembly) – Computer-friendly:** @@ -257,128 +257,127 @@ back add r0,r1 end ``` -Notice how JavaScript version read like English instructions, but Assembly version get secret commands wey control computer processor directly. Both do the exact same work, but the high-level language easy for humans to understand, write, and maintain. +Notice say JavaScript version read like English instruction, while Assembly version use secret commands to control processor directly. Both dey do same work, but high-level language easy for humans to understand, write, and maintain. -**Key difference wey you go notice:** -- **Readability**: JavaScript dey use names like `fibonacciCount` wey clear, but Assembly dey use codes like `r0`, `r1` +**Main differences wey you go notice:** +- **Readability**: JavaScript dey use descriptive names like `fibonacciCount` while Assembly dey use cryptic labels like `r0`, `r1` - **Comments**: High-level languages dey encourage explanatory comments wey dey make code self-documenting -- **Structure**: JavaScript logical flow dey match how humans dey think about problems step-by-step -- **Maintenance**: Updating the JavaScript version for different requirements easy and clear - -✅ **About the Fibonacci sequence**: Dis absolutely beautiful number pattern (where each number equals di sum of di two before am: 0, 1, 1, 2, 3, 5, 8...) dey show up literally *everywhere* for nature! You go find am for sunflower spirals, pinecone patterns, di way nautilus shells dey curve, and even for how tree branches grow. E dey pretty mind-blowing how math and code fit help us understand and recreate di patterns wey nature dey use to create beauty! +- **Structure**: JavaScript logical flow dey match how human being dey think about problems step-by-step +- **Maintenance**: Updating the JavaScript version for different requirements na straightforward and clear +✅ **About the Fibonacci sequence**: Dis absolutely beautiful number pattern (wey each number be di sum of di two wey dey before am: 0, 1, 1, 2, 3, 5, 8...) dey show up literally *everywhere* for nature! You go find am for sunflower spirals, pinecone patterns, how nautilus shells curve, and even how tree branches dey grow. E sure me die how math and code fit help us understand and recreate di patterns wey nature dey use take create beauty! ## The Building Blocks That Make the Magic Happen -Alright, now wey you don see how programming languages dey act, make we break down di fundamental pieces wey dey make up literally every program wey dem don write. Think of these as di essential ingredients for your favorite recipe – once you sabi wetin each one dey do, you go fit read and write code for almost any language! +Alright, now wey you don see how programming languages dey work, make we break down di fundamental pieces wey dey make literally every program wey dem don write. Think of dem as di essential ingredients for your favorite recipe – once you understand wetin each one dey do, you go fit read and write code for almost any language! -Dis na like learning di grammar of programming. Remember for school when you learn about nouns, verbs, and how to put sentences together? Programming get him own version of grammar, and honestly, e dey way more logical and forgiving pass English grammar! 😄 +Dis one be like learning di grammar of programming. You remember back when you for school wey you learn about nouns, verbs, and how to put sentences together? Programming get e own version of grammar, and honestly, e dey way more logical and forgiving than English grammar ever be! 😄 ### Statements: The Step-by-Step Instructions -Make we start with **statements** – dem be like individual sentences wey you dey yarn with your computer. Each statement dey tell di computer to do one specific thing, just like giving directions: "Turn left here," "Stop for di red light," "Park for that spot." +Make we start with **statements** – dem be like individual sentences for conversation with your computer. Each statement dey tell computer to do one specific tin, like to give directions: "Turn left here," "Stop at the red light," "Park for dat spot." -Wetin I like about statements na how dem dey readable most times. Check dis out: +Wetin I like about statements be how dem dey readable mostly. Check dis out: ```javascript -// Simple talk wey dey do one kain work only +// Basic talk wey dey do one kine action only const userName = "Alex"; console.log("Hello, world!"); const sum = 5 + 3; ``` - -**Dis na wetin dis code dey do:** -- **Declare** one constant variable to store user name -- **Display** greeting message for di console output -- **Calculate** and store di result of one mathematical operation + +**Dis na wetin dis code dey do:** +- **Declare** constant variable to store person name +- **Display** greeting message to di console output +- **Calculate** and store di result of mathematical operation ```javascript -// Di talk dem wey dey interact wit web pages +// Statements wey dey interact wit web pages document.title = "My Awesome Website"; document.body.style.backgroundColor = "lightblue"; ``` - -**Step by step, dis na wetin dey happen:** -- **Modify** di webpage title wey dey appear for di browser tab + +**Step by step, dis na wetin dey happen:** +- **Modify** di webpage title wey dey show for browser tab - **Change** di background color of di whole page body ### Variables: Your Program's Memory System -Okay, **variables** be one of my absolute favorite concepts to teach because dem dey just like things you dey use everyday! +Okay, **variables** be one of my absolute favorite concepts to teach because dem dey so much like tins wey you dey use every single day! -Think about your phone contact list for one second. You no dey memorize everybody phone numbers – you dey save "Mom," "Best Friend," or "Pizza Place Wey Dey Deliver Till 2 AM" and your phone dey remember di actual numbers. Variables dey work like dat! Dem be like labeled containers where your program fit store info and retrieve am later with one name wey make sense. +Think about your phone contact list for small. You no dey memorize everybody phone number – you go save "Mom," "Best Friend," or "Pizza Place Wey Dey Deliver Till 2 AM" and make your phone remember the real numbers. Variables dey work exactly like dat! Dem be like labelled containers where your program fit store information and later use name wey make sense take find am. -Wetin make am really cool: variables fit change as your program dey run (na why dem call am "variable" – you see wetin dem do there?). Just like how you fit update dat pizza place contact if you find better one, variables fit dey updated as your program learn new info or as situation change! +Wetin dey really cool be say variables fit change as your program dey run (na why dem call am "variable" – you see wetin dem do?). Just like you fit update that pizza place contact when you find better place, variables fit update as your program learn new tins or as situation change! -Make I show you how simple e fit be: +Make I show you how e simple: ```javascript -// Step 1: Di creating basic variables +// Step 1: Make di basic variable dem const siteName = "Weather Dashboard"; let currentWeather = "sunny"; let temperature = 75; let isRaining = false; ``` - -**Make you understand dis concepts:** -- **Store** values wey no go change for `const` variables (like site name) -- **Use** `let` for values wey fit change during your program -- **Assign** different data types: strings (text), numbers, and booleans (true/false) + +**Understanding dis concepts:** +- **Store** unchanging values for `const` variables (like site name) +- **Use** `let` for values wey fit change for your program +- **Assign** different data types: strings (text), numbers, and booleans (true/false) - **Choose** descriptive names wey explain wetin each variable get inside ```javascript -// Step 2: Dey wok wit objects to group tings wey relate togeda +// Step 2: Di work wit object dem to group related data const weatherData = { location: "San Francisco", humidity: 65, windSpeed: 12 }; ``` - -**For di above, we:** -- **Create** one object to group related weather information -- **Organize** plenty pieces of data under one variable name -- **Use** key-value pairs to label each info clearly + +**For above, we don:** +- **Create** object to group related weather information together +- **Organize** many pieces of data under one variable name +- **Use** key-value pairs to label each piece of information clear clear ```javascript -// Step 3: Di way wey you go take use an update di variables +// Step 3: De use and update di variables console.log(`${siteName}: Today is ${currentWeather} and ${temperature}°F`); console.log(`Wind speed: ${weatherData.windSpeed} mph`); -// How to update di variables wey fit change +// Update di variables wey fit change currentWeather = "cloudy"; temperature = 68; ``` - -**Make we understand each part:** -- **Display** info with template literals using `${}` syntax -- **Access** object properties with dot notation (`weatherData.windSpeed`) -- **Update** variables wey dem declare with `let` to show changing conditions + +**Make we understand each part:** +- **Display** information using template literals with `${}` syntax +- **Access** object properties using dot notation (`weatherData.windSpeed`) +- **Update** variables wey declare with `let` as conditions change - **Combine** multiple variables to create meaningful messages ```javascript -// Step 4: Modern destructuring make di code clean well well +// Step 4: Modern destructuring make code dey clean well well const { location, humidity } = weatherData; console.log(`${location} humidity: ${humidity}%`); ``` - -**Wetin you need sabi:** -- **Extract** specific properties from objects with destructuring assignment -- **Create** new variables automatically wey get same names as object keys + +**Wetin you need sabi:** +- **Extract** specific properties from objects with destructuring assignment +- **Create** new variables automatically with same names as object keys - **Simplify** code by avoiding repetitive dot notation ### Control Flow: Teaching Your Program to Think -Okay, na here programming go dey mind-blowing! **Control flow** na teaching your program how to make smart decisions, just like how you dey do every day without even think. +Okay, dis na where programming go mind-blow you! **Control flow** na basically to teach your program how to make correct decisions, just like you dey do every day without even dey reason am. -Imagine dis: this morning you for do something like "If e dey rain, I go carry umbrella. If e cold, I go wear jacket. If I late, I go skip breakfast and grab coffee on di way." Your brain naturally dey follow dis if-then logic many times every day! +Imagine this one: dis morning you probably do like "If e dey rain, I go carry umbrella. If e cold, I go wear jacket. If I dey late, I go skip breakfast, carry coffee for road." Your brain dey naturally follow dis if-then logic plenty times every day! -Dis na wetin dey make programs dey feel intelligent and alive, no be only to follow boring, predictable script. Dem fit look situation, reason wetin dey happen, and respond well well. E be like giving your program brain wey fit adapt and make choices! +Dis na wetin make programs dey feel like dem get intelligence and life, no be like some boring predictable script. Dem fit look situation, sabi wetin dey happen, and respond well well. E be like you give your program brain wey fit adapt and make choices! -You want see how dis work nicely? Make I show you: +You want see how e sweet? Make I show you: ```javascript -// Step 1: Simple if-else ting dem +// Step 1: Simple condition ting wey dey check const userAge = 17; if (userAge >= 18) { @@ -388,12 +387,12 @@ if (userAge >= 18) { console.log(`You'll be able to vote in ${yearsToWait} year(s).`); } ``` - -**Dis na wetin dis code dey do:** -- **Check** if user age reach di voting requirement -- **Execute** different code blocks based on condition result -- **Calculate** and display how long before dem fit vote if dem still under 18 -- **Provide** specific, helpful feedback for each case + +**Dis na wetin dis code dey do:** +- **Check** if user's age reach voting age +- **Run** different code blocks based on the condition result +- **Calculate** and show how long dem go wait if dem no reach 18 +- **Give** specific, helpful feedback for each case ```javascript // Step 2: Plenty conditions wit logical operators @@ -408,26 +407,26 @@ if (userAge >= 18 && hasPermission) { console.log("Sorry, you must be at least 16 years old."); } ``` - -**Break down wetin dey happen:** -- **Combine** multiple conditions with `&&` (and) operator -- **Create** hierarchy of conditions with `else if` for many scenarios -- **Handle** all possible cases with final `else` statement -- **Provide** clear and actionable feedback for each different situation + +**Break down wetin dey happen:** +- **Join** multiple conditions with `&&` (and) operator +- **Create** hierarchy with `else if` for multiple scenarios +- **Handle** all possible cases with `else` statement +- **Give** clear, actionable feedback for each different situation ```javascript -// Step 3: Short condition wit ternary operator +// Step 3: Short conditional wit ternary operator const votingStatus = userAge >= 18 ? "Can vote" : "Cannot vote yet"; console.log(`Status: ${votingStatus}`); ``` - -**Wetin you need remember:** -- **Use** ternary operator (`? :`) for simple two-option conditions -- **Write** condition first, then `?`, then true result, then `:`, then false result -- **Apply** dis pattern when you want assign values based on conditions + +**Wetin to remember:** +- **Use** ternary operator (`? :`) for simple two-option choice +- **Write** condition first, then `?`, then true result, then `:`, then false result +- **Apply** this pattern when you want assign values based on conditions ```javascript -// Step 4: Dealing wit plenti particular kain cases +// Step 4: Dealing wit many spesific tins dem const dayOfWeek = "Tuesday"; switch (dayOfWeek) { @@ -446,52 +445,52 @@ switch (dayOfWeek) { console.log("Invalid day of the week"); } ``` + +**Dis code dey do dis:** +- **Match** variable values with multiple specific cases +- **Group** similar cases (weekdays vs. weekends) +- **Run** correct code block when match found +- **Use** `default` case to handle unexpected values +- **Use** `break` make code no run go next case -**Dis code dey do:** -- **Match** variable value against multiple specific cases -- **Group** similar cases together (weekdays vs weekends) -- **Execute** correct code block when match dey -- **Include** `default` case to handle unexpected values -- **Use** `break` statements to prevent code from running to next case - -> 💡 **Real-world analogy**: Think of control flow like di world most patient GPS wey dey gimme directions. E go talk "If traffic dey Main Street, take highway instead. If construction block highway, try scenic route." Programs dey use same conditional logic make dem respond smartly to different things and always give user di best experience. +> 💡 **Real-world analogy**: Think of control flow like make GPS wey patient well-well dey give you directions. E fit talk "If traffic dey for Main Street, use highway instead. If highway block, try scenic route." Programs dey use same kind of conditional logic take respond smartly to different cases and always give users best experience. ### 🎯 **Concept Check: Building Blocks Mastery** -**Make we see how you dey with fundamentals:** -- Fit explain difference between variable and statement with your own words? -- Think of real-world place where you fit use if-then decision (like our voting example) -- Wetin one thing about programming logic wey surprise you? +**Make we check how you dey do for fundamentals:** +- Fit explain difference between variable and statement with your own words? +- Think of real life case wey you go use if-then decision (like our voting example) +- Wetin surprise you about programming logic? -**Quick confidence booster:** +**Small confidence booster:** ```mermaid flowchart LR - A["📝 Statements
(Instructions dem)"] --> B["📦 Variables
(Storage)"] --> C["🔀 Control Flow
(Decisions)"] --> D["🎉 Working Program!"] + A["📝 Statements
(Instructions)"] --> B["📦 Variables
(Storage)"] --> C["🔀 Control Flow
(Decisions)"] --> D["🎉 Working Program!"] style A fill:#ffeb3b style B fill:#4caf50 style C fill:#2196f3 style D fill:#ff4081 -``` -✅ **Wet tin dey come next**: We go enjoy as we dive deeper into these concepts for this incredible journey! Right now, just focus on that excitement about all di amazing possibilities wey dey front of you. Di specific skills and techniques go naturally stick as we practice together – I promise say dis go sweet pass wetin you expect! +``` +✅ **Wetin go happen next**: We go enjoy as we dive deeper into these concepts as we continue this amazing journey together! For now, focus on the excitement for all the wonderful possibilities ahead. Di specific skills and techniques go naturally stick as we practice together – I promise dis go more fun than you expect! ## Tools of the Trade -Okay, na here I dey really excited wey I fit barely contain! 🚀 We go talk about the amazing tools wey go make you feel like say dem don give you di keys to digital spaceship. +Alright, dis na where I nearly dey burst with excitement! 🚀 We dey talk about di incredible tools wey go make you feel like sey dem don give you keys to digital spaceship. -You sabi how chef get knives wey balance well well wey feel like part of im hand? Or how musician get guitar wey dey sing the moment dem touch am? Well, developers get our own magical tools, and here na wetin go blow your mind – most of dem dey free! +You sabi how chef get those perfectly balanced knives wey feel like extension of their hands? Or how musician get one guitar wey sound as dem touch am? Well, developers get our own magical tools and here be wetin go blow your mind – most of dem na free free! -I dey bounce for my chair just dey think about to share this with you because dem don change how we dey build software completely. We dey talk about AI-powered coding assistants wey fit help write your code (I no dey joke!), cloud environments where you fit build complete applications from anywhere with Wi-Fi, and debugging tools so waka deep dem be like X-ray vision for your programs. +I dey almost jump for joy dey think about to share these because dem don totally change how we build software. We dey talk AI-powered coding assistants wey fit help write your code (no be joke!), cloud environments wey you fit build whole apps anywhere wey get Wi-Fi, and debugging tools so powerful, e be like say you get X-ray vision for your programs. -And this one still get me chills: these no be beginner tools wey you go soon comot. Na the exact professional-grade tools wey developers for Google, Netflix, and that indie app studio wey you like dey use now now. You go feel like real pro using them! +And dis one still dey give me shivers: these no be "beginner tools" wey you go soon stop to use. Na exact same correct professional tools wey developers for Google, Netflix, and that indie app studio you love dey use now now. You go feel like pro when you start use dem! ```mermaid graph TD A["💡 Your Idea"] --> B["⌨️ Code Editor
(VS Code)"] - B --> C["🌐 Browser DevTools
(Testing & Debugging)"] + B --> C["🌐 Browser DevTools
(Testin & Debuggin)"] C --> D["⚡ Command Line
(Automation & Tools)"] - D --> E["📚 Documentation
(Learning & Reference)"] - E --> F["🚀 Amazing Web App!"] + D --> E["📚 Documentation
(Learnin & Reference)"] + E --> F["🚀 Kain Web App Wey Dey Wow!"] B -.-> G["🤖 AI Assistant
(GitHub Copilot)"] C -.-> H["📱 Device Testing
(Responsive Design)"] @@ -504,109 +503,108 @@ graph TD style H fill:#f3e5f5 style I fill:#ffccbc style J fill:#e8eaf6 -``` +``` ### Code Editors and IDEs: Your New Digital Best Friends -Make we talk about code editors – dem go soon become your favorite places to hang out! Think of dem as your personal coding sanctuary where you go spend most of your time crafting and perfecting your digital work. +Make we talk about code editors – dem go soon be your favorite places to chill! Think of dem as personal coding sanctuary where you go spend most time dey create and improve your digital projects. -But dis one dey magical about modern editors: no be only fine text editors. Dem be like having best, most supportive coding mentor sit right beside you 24/7. Dem go catch your typo before you even sabi dem, suggest ways to make you look genius, help you understand every piece of code, and some even fit predict wetin you wan type next and offer to finish your mind! +But wetin dey magical about modern editors be say dem no be ordinary text editors. Dem be like di smartest, most supportive coding mentor wey dey sit beside you 24/7. Dem dey catch your typos before you notice, suggest improvements wey make you look like genius, dey help you understand wetin every piece of code dey do, and some fit even guess wetin you wan type and finish your thoughts for you! -I remember when I first find auto-completion – I feel like I dey live for future. You go start to type, then your editor go talk, "Hey, you dey think about dis function wey go do wetin you need?" E be like say your coding buddy sabi your mind before you talk am! +I remember the first time I see auto-completion – I literally feel like say I dey live for future. You start to type, and your editor go be like, "Hey, were you thinking about dis function wey do exactly wetin you need?" E be like have mind reader as your coding buddy! -**Wetin make these editors so incredible?** +**Wetyn make these editors special?** -Modern code editors get plenty features wey go boost your work productivity: +Modern code editors get plenty features wey dey boost your productivity: -| Feature | What E Dey Do | Why E Dey Help | -|---------|--------------|--------------| -| **Syntax Highlighting** | Dey color different parts of your code | Make code easier to read and spot mistakes | -| **Auto-completion** | Dey suggest code as you type | Speed coding and reduce typos | -| **Debugging Tools** | Dey help find and fix errors | Save you many hours of troubleshooting | +| Feature | Wetin E Dey Do | Why E Dey Help | +|---------|----------------|----------------| +| **Syntax Highlighting** | Color different parts of your code | Make code easy to read and spot errors | +| **Auto-completion** | Suggest code as you type | Make coding faster and reduce typos | +| **Debugging Tools** | Help find and fix errors | Save time for troubleshooting | | **Extensions** | Add special features | Customize your editor for any technology | -| **AI Assistants** | Suggest code and explanations | Fast learning and better productivity | +| **AI Assistants** | Suggest code and explanations | Boost learning and productivity | -> 🎥 **Video Resource**: Want see these tools for action? Check dis [Tools of the Trade video](https://youtube.com/watch?v=69WJeXGBdxg) for full overview. +> 🎥 **Video Resource**: You want see these tools for action? Check dis [Tools of the Trade video](https://youtube.com/watch?v=69WJeXGBdxg) for detailed overview. #### Recommended Editors for Web Development -**[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)** (Free) -- Most popular for web developers -- Excellent extension ecosystem -- Built-in terminal and Git integration -- **Must-have extensions**: - - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - AI-powered code suggestions - - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) - Real-time collaboration - - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - Automatic code formatting - - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) - Catch typos inside your code - -**[JetBrains WebStorm](https://www.jetbrains.com/webstorm/)** (Paid, free for students) -- Advanced debugging and testing tools -- Intelligent code completion +**[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)** (Free) +- Na popular choice for web developers +- Plenty extensions +- Built-in terminal and Git support +- **Must-have extensions**: + - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - AI powered code suggestions + - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) - Real-time collaboration + - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - Automatic code formatting + - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) - Catch typos in your code + +**[JetBrains WebStorm](https://www.jetbrains.com/webstorm/)** (Paid, free for students) +- Advanced debugging and testing tools +- Intelligent code completion - Built-in version control -**Cloud-Based IDEs** (Different pricing) -- [GitHub Codespaces](https://github.com/features/codespaces) - Full VS Code for your browser -- [Replit](https://replit.com/) - Great for learning and sharing code +**Cloud-Based IDEs** (Various pricing) +- [GitHub Codespaces](https://github.com/features/codespaces) - Full VS Code for your browser +- [Replit](https://replit.com/) - Great for learning and sharing code - [StackBlitz](https://stackblitz.com/) - Instant, full-stack web development -> 💡 **Getting Started Tip**: Start with Visual Studio Code – e free, e dey widely used for industry, and get big community wey dey create helpful tutorials and extensions. - +> 💡 **Getting Started Tip**: Start with Visual Studio Code – e free, widely used for industry, and get huge community wey dey create tutorials and extensions. ### Web Browsers: Your Secret Development Laboratory -Okay, get ready to get your mind blow! You know how you dey use browsers to scroll social media and watch videos? Well, e turn out say browsers hide incredible secret developer laboratory all dis time, just dey wait make you find am! +Okay, prepare for your mind to bubble full ground! You sabi how you dey use browsers to scroll social media and watch videos? Well, e turn say dem dey hide one correct secret developer laboratory all dis time, just waiting gidigba for you to discover! -Every time you right-click on webpage and choose "Inspect Element," na so you dey open one hidden world of developer tools wey really powerful pass some expensive software wey I use pay hundreds of dollars for before. E be like say your normal kitchen get professional chef laboratory behind secret panel! -Di fọs taim pesin show me browser DevTools, ah spent like three awas jus dey click around an dey talk "WAIT, E FIT DO DAT TOO?!" You fit edit any website for real-time, see exactly how fast everytin dey load, test how your site dey look for different devices, an even debug JavaScript like total pro. E really blow mind! +Every time you right-click on webpage and choose "Inspect Element," you dey open hidden world of developer tools wey seriously powerful pass some expensive software wey I dey pay hundreds dollars for before. E be like say your normal kitchen dey hide professional chef laboratory behind secret panel! +Di first time oly person show me browser DevTools, I spend like three wata dem hours just dey click everywhere and dey shout "WAIT, E FIT DO DAT TOO?!" You fit edit any website for real-time, see how fast everytin dey load, test how your site dey look for different kain devices, and even debug JavaScript like certified pro. E too much for brain! **Na why browsers be your secret weapon:** -When you dey create website or web application, you go need see how e dey look an behave for real life. Browsers no just show your work, dem dey give you detailed feedback about performance, accessibility, an potential wahala. +When you make website or web app, you go need see how e go look and behave for real world. Browsers no just dey show your work but e go also give detailed feedback about performance, accessibility, and any wahala wey fit dey. #### Browser Developer Tools (DevTools) -Modern browsers get full development suite: +Modern browsers get full set of development tools: | Tool Category | Wetin E Dey Do | Example Use Case | -|---------------|----------------|------------------| -| **Element Inspector** | View an edit HTML/CSS for real-time | Change style make you see quick result | -| **Console** | View error messages an test JavaScript | Debug gbege an try code | -| **Network Monitor** | Track how resources dey load | Make performance an loading sharp | +|---------------|----------------|-----------------| +| **Element Inspector** | View and edit HTML/CSS for real-time | Adjust styling make you see result sharp-sharp | +| **Console** | View error messages and test JavaScript | Debug problems and try code experiments | +| **Network Monitor** | Track how resources dey load | Make performance and loading times better | | **Accessibility Checker** | Test for inclusive design | Make sure say your site dey work for everybody | | **Device Simulator** | Preview on different screen sizes | Test responsive design without many devices | -#### Recommended Browsers for Development +#### Browsers Wey Dem Recommend for Development -- **[Chrome](https://developers.google.com/web/tools/chrome-devtools/)** - Industry-standard DevTools wit full documentation -- **[Firefox](https://developer.mozilla.org/docs/Tools)** - Beta CSS Grid an accessibility tools -- **[Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)** - Build on Chromium wit Microsoft developer resources +- **[Chrome](https://developers.google.com/web/tools/chrome-devtools/)** - Industry-standard DevTools with plenty documentation +- **[Firefox](https://developer.mozilla.org/docs/Tools)** - Better CSS Grid and accessibility tools +- **[Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)** - Based on Chromium with Microsoft developer resources -> ⚠️ **Important Testing Tip**: Always test your websites inside multiple browsers! Wetin work well for Chrome fit look different for Safari or Firefox. Professional developers dey test for all major browsers so user experience go dey consistent. +> ⚠️ **Important Testing Tip**: Always test your websites for different browsers! Wetin dey perfect for Chrome fit look different for Safari or Firefox. Pro developers test for all big browsers to make sure user experience dey consistent. -### Command Line Tools: Your Gateway to Developer Superpowers +### Command Line Tools: Na Your Gateway to Developer Superpowers -Okay, mek we dey real here about command line, because I want make you hear from person wey understand am well well. When I first see am – just dis scary black screen with blinking text – I really think, "Nope, no way! E be like witchcraft from 1980s hacker movie, and I no smart reach dat level!" 😅 +Make we yarn honest talk about command line because I want make you hear am from person wey really sabi. The first time I see am – na scary black screen wey dey blink text – I come think, "No way, e no be for me! E dey look like 1980s hacker movie, and I no too sabi this one!" 😅 -But na wetin I wish person don tell me back then an wat I dey tell you now be: command line no dey scary – e be like direct talk with your computer. E be like differenc between ordering food from fancy app wit picture an menu (wey sweet an easy) versus enter your local restaurant where chef sabi wetin you like an fit make correct food when you just say "surprise me with something great." +But wetin I wish dem tell me then, and wetin I dey tell you now be dis: command line no scary – na like you dey talk direct with your computer. E be like the difference between order food using app wey get pictures and menu (wey easy) versus waka enter your local restaurant where the chef sabi wetin you like, and fit make better food with just you say "surprise me something sweet." -Command line na where developers go feel like real wizards. You just type few magic words (okay na commands, but e dey feel magic!), press enter, an BOOM – you don create whole project structure, install strong tools from anywhere, or deploy your app to internet for millions people to see. When you get first taste of dat power, e be like chain wey no fit break! +Command line na where developers feel like total wizards. You type some magical words (okay, na commands but dem dey feel magical!), press enter, and BOOM – you fit create whole project structure, install powerful tools from anywhere, or deploy your app for internet make millions people see. Once you taste that power, e sweet well-well! -**Why command line go be your best tool:** +**Why command line go be your favorite tool:** -Even though GUI dey good for many tasks, command line dey excel for automation, precision, an speed. Plenty dev tools dey work mainly with command line interface, an learning how to use dem well fit boost your productivity no be small. +While graphical interfaces better for many work, command line sharp for automation, precision, and speed. Many development tools dey use am first, and to sabi use am well fit boost your productivity low-low. ```bash -# Step 1: Make and waka go project folder +# Step 1: Make and waka go the project folder mkdir my-awesome-website cd my-awesome-website ``` -**Dis code dey do:** -- **Create** one new directory wey dem call "my-awesome-website" for your project -- **Navigate** inside dat new directory to start work +**Wetin dis code dey do:** +- **Create** new directory wey dem call "my-awesome-website" for your project +- **Navigate** go inside the new directory to start work ```bash -# Step 2: Start di project wit package.json +# Step 2: Begin project wit package.json npm init -y # Install beta development tools @@ -617,11 +615,11 @@ npm install --save-dev @eslint/js **Step by step, dis na wetin dey happen:** - **Initialize** new Node.js project with default settings using `npm init -y` - **Install** Vite as modern build tool for fast development and production build -- **Add** Prettier for automatic code formatting an ESLint for code quality check -- **Use** `--save-dev` flag to mark these as development-only dependencies +- **Add** Prettier for automatic code formatting and ESLint for code quality check +- **Use** `--save-dev` flag to mark dem as development-only dependencies ```bash -# Step 3: Build di project structure and files +# Step 3: Make di project structure and files mkdir src assets echo 'My Site

Hello World

' > index.html @@ -630,83 +628,83 @@ npx vite ``` **For above, we don:** -- **Organize** our project by creating separate folders for source code an assets -- **Generate** basic HTML file wit correct document structure -- **Start** Vite development server for live reload an hot module replacement +- **Organize** our project by creating separate folders for source code and assets +- **Generate** basic HTML file with proper document structure +- **Start** Vite development server for live reload and hot module replacement #### Essential Command Line Tools for Web Development | Tool | Purpose | Why You Need Am | |------|---------|-----------------| -| **[Git](https://git-scm.com/)** | Version control | Track changes, collaborate an backup work | -| **[Node.js & npm](https://nodejs.org/)** | JavaScript runtime & package management | Run JavaScript outside browser, install modern dev tools | -| **[Vite](https://vitejs.dev/)** | Build tool & dev server | Fast development wit hot module replacement | -| **[ESLint](https://eslint.org/)** | Code quality | Automatically find an fix problems for your JavaScript | -| **[Prettier](https://prettier.io/)** | Code formatting | Keep code consistent an easy to read | +| **[Git](https://git-scm.com/)** | Version control | Track changes, collaborate with others, backup your work | +| **[Node.js & npm](https://nodejs.org/)** | JavaScript runtime & package management | Run JavaScript outside browsers, install modern development tools | +| **[Vite](https://vitejs.dev/)** | Build tool & dev server | Lightning-fast development with hot module replacement | +| **[ESLint](https://eslint.org/)** | Code quality | Automatically find and fix problems for your JavaScript | +| **[Prettier](https://prettier.io/)** | Code formatting | Keep your code consistently formatted and easy to read | #### Platform-Specific Options **Windows:** -- **[Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)** - Modern, feature-rich terminal +- **[Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)** - Modern, features full terminal - **[PowerShell](https://docs.microsoft.com/powershell/?WT.mc_id=academic-77807-sagibbon)** 💻 - Powerful scripting environment -- **[Command Prompt](https://docs.microsoft.com/windows-server/administration/windows-commands/?WT.mc_id=academic-77807-sagibbon)** 💻 - Traditional Windows command line +- **[Command Prompt](https://docs.microsoft.com/windows-server/administration/windows-commands/?WT.mc_id=academic-77807-sagibbon)** 💻 - Old school Windows command line **macOS:** - **[Terminal](https://support.apple.com/guide/terminal/)** 💻 - Built-in terminal app -- **[iTerm2](https://iterm2.com/)** - Enhanced terminal wit advanced features +- **[iTerm2](https://iterm2.com/)** - Better terminal with more features **Linux:** - **[Bash](https://www.gnu.org/software/bash/)** 💻 - Standard Linux shell - **[KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)** - Advanced terminal emulator -> 💻 = Pre-installed for operating system +> 💻 = Pre-installed for the operating system -> 🎯 **Learning Path**: Start wit basic commands like `cd` (change directory), `ls` or `dir` (list files), an `mkdir` (create folder). Practice wit modern workflow commands like `npm install`, `git status`, an `code .` (opens current directory in VS Code). As you dey comfortable, you go naturally learn advanced commands an automation techniques. +> 🎯 **Learning Path**: Start with simple commands like `cd` (change directory), `ls` or `dir` (list files), and `mkdir` (create folder). Practice with modern workflow commands like `npm install`, `git status`, and `code .` (open current directory for VS Code). As you sabi well, you go naturally sabi advanced commands and automation tricks. ### Documentation: Your Always-Available Learning Mentor -Okay, mek I share small secret wey go make you feel better about being beginner: even the most experienced developers spend plenty time dey read documentation. An no be because dem no sabi wetin dem dey do – e mean say dem dey wise! +Okay, make I share small secret wey go make you feel better as beginner: even the pro developers spend big time dey read documentation. Na no be because dem no sabi, na because e mean say dem dey wise! -Think documentation like you get access to world most patient, knowledgeable teacher wey dey available 24/7. You jam gbege for 2 AM? Documentation dey give you warm virtual hug an exactly di answer wey you need. You want learn about beta new thing wey everybody dey talk? Documentation get your back wit step-by-step example. You dey try sabi why something dey work like dat? You don guess am – documentation ready to explain am so e go clear finally! +Think documentation like say na world most patient, sabi teachers wey dey available 24/7. You catch problem for 2 AM? Documentation go give you warm virtual hug plus answer wey you need. You wan learn about new feature wey everybody dey talk? Documentation get your back with step-by-step example. You dey try understand why something dey work like that? You don guess am – documentation dey ready to explain am so e go make sense! -Here na wetin change my mind: web development world dey move sharp sharp, an nobody (I mean nobody!) fit remember everything. I don watch senior devs with 15+ years experience dey look basic syntax, and you know? E no shame – na smart thing be dat! E no mean say memory perfect; na to sabi where to find correct answer fast an understand how to apply am. +Wetin change my mind: web development world dey move fast gan, and nobody (I mean nobody!) dey keep everything for memory. I don see senior developers wey get 15+ years of experience dey look up basic syntax, and you know wetin? E no shame – e be smart move! E no be about perfect memory but to sabi where to find correct answer fast and sabi how to apply am. -**Na here di real magic dey:** +**Na here real magic dey happen:** -Professional developers spend big part of their time dey read documentation – no be because dem no sabi, but because web development landscape dey change fast so dem need dey learn continuously. Great documentation go help you understand not just *how* to use somtin, but *why* an *when* to use am. +Pro developers spend plenty time dey read documentation – no be because dem no sabi, but because web development dey change quick and to dey up to date you must dey learn well well. Better documentation go help you understand not just *how* to use something, but *why* and *when* to use am. #### Essential Documentation Resources **[Mozilla Developer Network (MDN)](https://developer.mozilla.org/docs/Web)** -- Gold standard for web technology documentation -- Comprehensive guides for HTML, CSS an JavaScript -- Browser compatibility info inside -- Get practical examples an interactive demos +- The gold standard for web technology documentation +- Complete guides for HTML, CSS, and JavaScript +- Include browser compatibility info +- Get practical examples and interactive demos **[Web.dev](https://web.dev)** (by Google) - Modern web development best practices -- Performance optimization guides -- Accessibility an inclusive design principles -- Case studies from real projects +- Guides for performance optimization +- Accessibility and inclusive design principles +- Real-world project case studies **[Microsoft Developer Documentation](https://docs.microsoft.com/microsoft-edge/#microsoft-edge-for-developers)** - Edge browser development resources - Progressive Web App guides -- Cross-platform dev insights +- Cross-platform development insights **[Frontend Masters Learning Paths](https://frontendmasters.com/learn/)** -- Structured learning curricula +- Structured learning curriculum - Video courses from industry experts - Hands-on coding exercises -> 📚 **Study Strategy**: No try memorize documentation – better learn how to navigate am well. Bookmark references you use dey-time to time an practice to find info fast with search. +> 📚 **Study Strategy**: No try to memorize documentation – instead, learn how to use am well. Bookmark your frequently-used references and sabi how to search quick quick for info. -### 🔧 **Tool Mastery Check: Wetin Dey Resonate With You?** +### 🔧 **Tool Mastery Check: Wetin De Resonate With You?** -**Take small time to think:** -- Which tool you dey excited to try first? (No wrong answer!) -- Command line still dey scare you or you get curiosity about am? -- You go fit use browser DevTools to peek behind curtain for your favorite websites? +**Take small time think:** +- Which tool you dey most eager try first? (No wrong answer here!) +- Command line still dey fear you, or you dey curious? +- You fit imagine using browser DevTools to look behind your favorite websites curtain? ```mermaid pie title "How Developer Dey Spend Time Wit Tools" @@ -716,68 +714,68 @@ pie title "How Developer Dey Spend Time Wit Tools" "Reading Docs" : 15 "Debugging" : 5 ``` -> **Fun insight**: Majority developers spend about 40% of their time for their code editor, but observe how much time dey go for testing, learning, an problem-solving. Programming no be only to write code – na to create experience! +> **Fun insight**: Most developers spend about 40% of their time for their code editor, but dem go spend plenty time dey test, learn, and solve problems. Programming no be just writing code – na about crafting experiences! -✅ **Food for thought**: Think about dis – how tools for building websites (development) dey different from tools for designing how dem go look (design)? E be like differenc between architect wey design beautiful house an contractor wey build am. Both important, but need different tools! Dis kind thinking go help you see bigger picture of how websites dem come alive. +✅ **Food for thought**: This one interesting to reason – how you think say tools for building websites (development) fit differ from tools for designing how e go look (design)? E be like the difference between architect wey design fine house and contractor wey actually build am. Both important, but dem need different toolboxes! This kind thinking go help you see big picture of how websites dey come alive. ## GitHub Copilot Agent Challenge 🚀 -Use Agent mode complete dis challenge: +Use Agent mode to complete dis challenge: -**Description:** Explore features of modern code editor or IDE an show how e fit improve your workflow as web developer. +**Description:** Explore features of modern code editor or IDE and show how e fit improve your workflow as web developer. -**Prompt:** Choose code editor or IDE (like Visual Studio Code, WebStorm, or cloud-based IDE). List three features or extensions wey help you write, debug, or maintain code fast. For each, give short explanation how e benefit your workflow. +**Prompt:** Choose code editor or IDE (like Visual Studio Code, WebStorm, or cloud-based IDE). List three features or extensions wey dey help you write, debug, or maintain code better. For each, give short explanation how e benefit your workflow. --- ## 🚀 Challenge -**Alright detective, you ready for your first case?** +**Alright, detective, you ready for your first case?** -Now wey you get this solid foundation, I get adventure wey go help you see how diverse an fascinating programming world be. And listen – no be to write code yet, so no pressure! Think of yourself as programming language detective on your first exciting case! +Now wey you get this solid foundation, I get adventure wey go help you see how diverse and interesting programming world really be. And listen – no be to write code yet, so no pressure! Think of yourself as programming language detective for your first interesting case! -**Your mission, if you accept am:** -1. **Become language explorer**: Pick three programming languages wey from different worlds – maybe one for building websites, one for mobile apps, an one for crunching scientific data. Find example of same simple task written for every language. I promise you go shock how different dem go look but e still do same tins! +**Your mission, if you want accept am:** +1. **Become language explorer**: Pick three programming languages from completely different world – maybe one wey build websites, one wey create mobile apps, and one wey dey crunch data for scientists. Find examples of same simple task for each language. I promise you go shock to see how different dem fit be but still dey do same tin! -2. **Discover dem origin story**: Wetin make each language special? One cool fact – every programming language come because pesin believe “I think sey beta way dey solve dis kind problem.” Fit you know wetin those problems be? Some story dey really interesting! +2. **Uncover their origin stories**: Wetin make each language special? Here na cool fact – every programming language create because person think, "I think say better way dey to solve this problem." Fit try find wetin those problems be! Some stories beta well-well! -3. **Meet the communities**: Check how friendly an passionate each language community be. Some get millions dev dey share knowledge an help each other, others small but tight an supportive. You go enjoy see dem different personalities! +3. **Meet the communities**: Check how friendly and passionate each language community be. Some get millions developers wey dey share knowledge and help each other, some small but tight and supportive. You go enjoy to see their different personalities! -4. **Follow your gut feeling**: Which language you feel more comfortable wit? No stress to pick perfect one – just listen to your heart! No wrong answer here, you fit explore more later. +4. **Follow your gut feeling**: Which language you feel say e dey easy for you now? No need stress to choose perfect one – just follow your instinct! No wrong answer here, and you fit explore others later too. -**Bonus detective work**: Try find out which big websites or apps dem build with each language. I garranty sey you go shock to sabi wetin power Instagram, Netflix, or that mobile game wey you no fit stop to play! +**Bonus detective work**: Try find out which big websites or apps dem build with each language. I sure say you go shock to find out what dey power Instagram, Netflix, or that mobile game you no fit stop to play! -> 💡 **Remember**: You no dey try become expert for any language today. You just dey sabi neighborhood before you choose where you want build. Take your time, enjoy am, an follow your curiosity! +> 💡 **Remember**: You no try become expert today. You just dey waka around the neighborhood before you decide where you want settle. Take your time, enjoy am, and make curiosity guide you! -## Make We Celebrate Wetin You Don Learn! +## Make We Celebrate Wetin You Don Discover! -Holy moly, you don absorb plenty correct info today! I happy to see how much of this journey don stick for your head. And remember – no be test wey you must get everything correct. Na celebration of all the beta tins you don learn about dis beautiful world you dey prepare to enter! +Holy moly, you don learn plenti amazing tins today! I dey happy to see how much of this journey don stick for your mind. And remember – no be test where you need get everything perfect. Na celebration of all the cool tins wey you don learn about this interesting world wey you dey enter! [Take the post-lesson quiz](https://ff-quizzes.netlify.app/web/) -## Review & Self Study -**Take your time to explore and have fun with it!** +## Review & Self Study -You don cover beta tins today, and dat one na beta tins to dey proud of! Now na di fun part – to explore di tins wey catch your mind. Make you remember, dis no be homework – na adventure! +**Take your time explore and enjoy am!** +You don cover plenti ground today, an dat na sometin to dey proud of! Now na di fun part – to explore di topics wey spark your curiosity. Make you remember, dis no be homework – na adventure! -**Dive deeper into what excites you:** +**Deep dive into wetin dey excite you:** -**Make you try di programming languages:** -- Visit di official websites of 2-3 languages wey catch your eye. Each get im own character and story! -- Try some online coding playgrounds like [CodePen](https://codepen.io/), [JSFiddle](https://jsfiddle.net/), or [Replit](https://replit.com/). No fear to try – you no fit spoil anything! -- Read how your favorite language take start. True true, some origin stories beta well well and e go help you understand why languages dey work like dat. +**Try hands-on with programming languages:** +- Visit di official websites of 2-3 languages wey catch your eye. Each one get im own personality and story! +- Try some online coding playgrounds like [CodePen](https://codepen.io/), [JSFiddle](https://jsfiddle.net/), or [Replit](https://replit.com/). No fear to experiment – you no fit spoil anytin! +- Read about how your favourite language start. Seriously, some of dis origin stories dey fascinating and e go help you understand why languages dey work the way dem dey. -**Make you sabi di new tools:** -- Download Visual Studio Code if you never download – e free and you go like am! -- Spend small time to waka inside di Extensions marketplace. E bi like app store for your code editor! -- Open your browser Developer Tools and just dey click around. No worry to sabi everything – just dey familiar with wetin dey. +**Make yourself comfortable with your new tools:** +- Download Visual Studio Code if you never do am – e free and you go like am! +- Spend few minutes dey browse di Extensions marketplace. E be like app store for your code editor! +- Open your browser Developer Tools and just click everywhere. No worry to understand everything – just make you familiar with wetin dey dia. **Join di community:** -- Follow some developer communities for [Dev.to](https://dev.to/), [Stack Overflow](https://stackoverflow.com/), or [GitHub](https://github.com/). Di programming community dey very friendly to new people! -- Watch beginner coding videos for YouTube. Plenty beta creators wey sabi how e be to just start. -- Think about to join local meetups or online communities. Believe me, developers love to help new pipo! +- Follow some developer communities on [Dev.to](https://dev.to/), [Stack Overflow](https://stackoverflow.com/), or [GitHub](https://github.com/). Di programming community dey very welcoming to newcomers! +- Watch some beginner-friendly coding videos for YouTube. Plenty great creators dey dia wey remember how e be to just dey start. +- Think about to join local meetups or online communities. Trust me, developers love to help beginners! -> 🎯 **Listen, na wetin I want you to remember be dis**: No expect to become coding wizard overnight! Now, you just dey know dis amazing new world wey you about enter. Take your time, enjoy di journey, and remember – every developer wey you sabi dey admire, dem bin dey your same place before, excited and maybe small confuse. E normal, and e mean say you dey do well! +> 🎯 **Listen, wetin I want make you remember be dis**: Nobody expect you go become coding wizard overnight! Right now, you just dey get to know dis amazing new world wey you about join. Take your time, enjoy di journey, and remember – every single developer wey you admire bin dey where you dey now, dey feel excited and maybe small confuse. Dat na normal, an e mean say you dey do am well! @@ -785,7 +783,7 @@ You don cover beta tins today, and dat one na beta tins to dey proud of! Now na [Reading the Docs](assignment.md) -> 💡 **Small push for your assignment**: I go like see you explore some tools we never talk before! No look editors, browsers, and command line tools wey we don yam – plenty beta development tools dey wey you fit discover. Find ones wey dey actively maintained and get strong, helpful communities (dem get best tutorials and most supportive pipo when you jam problem and need help). +> 💡 **Small push for your assignment**: I go really like to see you explore tools we never talk about before! No go use editors, browsers, and command line tools we don yarn about – dis one get whole world of amazing development tools wey dey wait make you discover dem. Find ones wey still dey maintained well and get plenty active, helpful communities (dem get best tutorials and di most supportive people wen you get stuck and need friendly hand). --- @@ -793,40 +791,40 @@ You don cover beta tins today, and dat one na beta tins to dey proud of! Now na ### ⚡ **Wetin you fit do for next 5 minutes** - [ ] Bookmark 2-3 programming language websites wey catch your eye -- [ ] Download Visual Studio Code if you never download -- [ ] Open your browser DevTools (F12) and just click around any website +- [ ] Download Visual Studio Code if you never do am yet +- [ ] Open your browser DevTools (F12) and click everywhere for any website - [ ] Join one programming community (Dev.to, Reddit r/webdev, or Stack Overflow) -### ⏰ **Wetin you fit complete this hour** -- [ ] Finish di post-lesson quiz and think about your answers -- [ ] Set up VS Code with di GitHub Copilot extension +### ⏰ **Wetin you fit achieve dis hour** +- [ ] Complete di post-lesson quiz and reflect on your answers +- [ ] Set up VS Code wit di GitHub Copilot extension - [ ] Try "Hello World" example for 2 different programming languages online - [ ] Watch "Day in the Life of a Developer" video for YouTube - [ ] Start your programming language detective work (from di challenge) ### 📅 **Your week-long adventure** -- [ ] Finish di assignment and explore 3 new development tools -- [ ] Follow 5 developers or programming accounts for social media -- [ ] Try build small tin for CodePen or Replit (even just "Hello, [Your Name]!") -- [ ] Read one developer blog post about coding journey -- [ ] Join virtual meetup or watch one programming talk -- [ ] Start learning your chosen language with online tutorials +- [ ] Complete di assignment and explore 3 new development tools +- [ ] Follow 5 developers or programming accounts on social media +- [ ] Try build sometin small for CodePen or Replit (even just "Hello, [Your Name]!") +- [ ] Read one developer blog post about person coding journey +- [ ] Join virtual meetup or watch programming talk +- [ ] Start learning your chosen language wit online tutorials ### 🗓️ **Your month-long transformation** -- [ ] Build your first small project (even simple webpage counts!) -- [ ] Contribute to open-source project (start with documentation fixes) -- [ ] Mentor person wey just start their programming journey +- [ ] Build your first small project (even simple webpage count!) +- [ ] Contribute to open-source project (start wit documentation fixes) +- [ ] Mentor person wey just dey start their programming journey - [ ] Create your developer portfolio website -- [ ] Connect with local developer communities or study groups -- [ ] Start to plan your next learning milestone +- [ ] Connect wit local developer communities or study groups +- [ ] Start planning your next learning milestone ### 🎯 **Final reflection check-in** -**Before you move on, celebrate small:** -- Wetin be one thing about programming wey excited you today? -- Which tool or concept you want explore first? -- How you feel about starting dis programming journey? -- Wetin be one question you go like ask developer now? +**Before you move on, take moment to celebrate:** +- Wetin be one tin about programming wey excite you today? +- Which tool or concept you wan explore first? +- How you feel about to start dis programming journey? +- Wetin be one question wey you like ask developer right now? ```mermaid journey @@ -843,12 +841,12 @@ journey Building: 5: You Confident: 5: You Helping Others: 5: You -``` -> 🌟 **Remember**: Every expert bin be beginner once. Every senior developer bin feel just like you dey feel now – excited, maybe small confuse, and sure about wetin fit happen. You dey beta company, and dis journey go sweet well well. Welcome to di wonderful world of programming! 🎉 +``` +> 🌟 **Remember**: Every expert bin once be beginner. Every senior developer bin feel just like you feel now – excited, maybe small overwhelmed, and definitely curious about wetin fit happen. You dey correct company, and dis journey go be amazing. Welcome to di wonderful world of programming! 🎉 --- **Disclaimer**: -Dis document don get AI translation from [Co-op Translator](https://github.com/Azure/co-op-translator). Even though we try make e correct, abeg sabi say automated translation fit get mistake or no proper. Di original document for dia language na di correct one to trust. If na serious information, better make professional human person translate am. We no gree take responsibility if person no understand well or if person miss the meaning because of dis translation. +Dis document don translate wit AI translation service wey dem call [Co-op Translator](https://github.com/Azure/co-op-translator). Even tho we dey try make am correct, abeg sabi say automated translation fit get mistakes or no too correct. Di original document wey e dey for im own language na im be di correct source. If na important info, e good make professional human translation do am. We no go take responsibility if pesin no understand well or misinterpret anytin wey come from dis translation. \ No newline at end of file diff --git a/translations/pcm/AGENTS.md b/translations/pcm/AGENTS.md index 7000a81ea..b8f9a9e81 100644 --- a/translations/pcm/AGENTS.md +++ b/translations/pcm/AGENTS.md @@ -2,27 +2,27 @@ ## Project Overview -Dis na educational curriculum repository wey dey teach web development basics to beginners. Di curriculum na comprehensive 12-week course wey Microsoft Cloud Advocates develop, e get 24 hand-on lessons wey cover JavaScript, CSS, and HTML. +Dis na educational curriculum repository wey dem use teach web development fundamentals to pipul wey never sabi before. Di curriculum na beta 12-week course wey Microsoft Cloud Advocates develop, e get 24 hands-on lessons wey dey cover JavaScript, CSS, and HTML. ### Key Components -- **Educational Content**: 24 structured lessons wey dem arrange inside project-based modules +- **Educational Content**: 24 structured lessons wey dem organize inside project-based modules - **Practical Projects**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor, and AI Chat Assistant -- **Interactive Quizzes**: 48 quizzes wit 3 questions each (before and after lesson assessments) -- **Multi-language Support**: Automated translations for 50+ languages through GitHub Actions +- **Interactive Quizzes**: 48 quizzes wey get 3 questions each (before and after lesson assessments) +- **Multi-language Support**: Automatic translations for 50+ languages using GitHub Actions - **Technologies**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (for AI projects) ### Architecture -- Educational repository wit lesson-based structure +- Educational repository get lesson-based structure - Every lesson folder get README, code examples, and solutions -- Standalone projects dey separate directories (quiz-app, various lesson projects) -- Translation system dey use GitHub Actions (co-op-translator) -- Documentation dey served via Docsify and e available as PDF +- Standalone projects dey for separate directories (quiz-app, different lesson projects) +- Translation system wey use GitHub Actions (co-op-translator) +- Documentation dey serve via Docsify and e dey available as PDF ## Setup Commands -Dis repository na mainly for educational content use. For work wit specific projects: +Dis repository na mainly for educational content consumption. If you wan work with particular projects: ### Main Repository Setup @@ -36,7 +36,7 @@ cd Web-Dev-For-Beginners ```bash cd quiz-app npm install -npm run dev # Start di development server +npm run dev # Start de development server npm run build # Build for production npm run lint # Run ESLint ``` @@ -48,7 +48,7 @@ cd 7-bank-project/api npm install npm start # Start di API server npm run lint # Run ESLint -npm run format # Format wit Prettier +npm run format # Arrange wit Prettier ``` ### Browser Extension Projects @@ -72,7 +72,7 @@ npm install ```bash cd 9-chat-project/solution/backend/python pip install openai -# Set GITHUB_TOKEN environment variable +# Set GITHUB_TOKEN environment variable na im python api.py ``` @@ -82,27 +82,27 @@ python api.py 1. **Fork di repository** go your GitHub account 2. **Clone your fork** for your local machine -3. **Create new branch** for your changes -4. Make changes for lesson content or code examples -5. Test any code changes for relevant project directories -6. Submit pull requests follow contribution guidelines +3. **Create new branch** for the changes wey you wan do +4. Make changes to lesson content or code examples +5. Test any code changes inside the project directories wey concern am +6. Submit pull requests based on contribution guidelines ### For Learners 1. Fork or clone di repository -2. Go lesson directories one by one -3. Read README files for every lesson -4. Complete pre-lesson quizzes for https://ff-quizzes.netlify.app/web/ -5. Work through code examples for lesson folders +2. Go through lesson directories one by one +3. Read README files for each lesson +4. Do pre-lesson quizzes for https://ff-quizzes.netlify.app/web/ +5. Work through code examples inside lesson folders 6. Complete assignments and challenges 7. Take post-lesson quizzes ### Live Development - **Documentation**: Run `docsify serve` for root (port 3000) -- **Quiz App**: Run `npm run dev` for quiz-app directory +- **Quiz App**: Run `npm run dev` inside quiz-app directory - **Projects**: Use VS Code Live Server extension for HTML projects -- **API Projects**: Run `npm start` for respective API directories +- **API Projects**: Run `npm start` inside the API directories wey concern am ## Testing Instructions @@ -118,74 +118,74 @@ npm run build # Make sure say build go succeed ```bash cd 7-bank-project/api -npm run lint # Check for code style mata -node server.js # Make sure say server start without wahala +npm run lint # Check for code style wahala +node server.js # Make sure server start without gbege ``` ### General Testing Approach -- Dis na educational repository wey no get full automated tests -- Manual testing focus on: - - Code examples run without errors - - Links for documentation dey work correct - - Project builds finish well - - Examples follow best practices +- Na educational repository dis, e no get full automated tests +- Manual testing dey focus on: + - Code examples dey run without error + - Links for documentation dey work well + - Projects dey build successful + - Examples follow beta practices ### Pre-submission Checks -- Run `npm run lint` for directories wey get package.json -- Make sure markdown links valid +- Run `npm run lint` inside directories wey get package.json +- Make sure markdown links dey valid - Test code examples for browser or Node.js -- Check sey translations keep the proper structure +- Make sure translations keep proper structure ## Code Style Guidelines ### JavaScript - Use modern ES6+ syntax -- Follow standard ESLint configs wey dey projects -- Use meaningful variable and function names for educational clarity -- Add comments wey explain concepts for learners -- Format using Prettier if e dey configured +- Follow standard ESLint configurations wey dey projects +- Use correct variable and function names so that e clear for education +- Add comments to explain concepts for learners +- Use Prettier for formatting where e configure ### HTML/CSS -- Semantic HTML5 elements +- Use semantic HTML5 elements - Responsive design principles - Clear class naming conventions -- Comments wey explain CSS techniques for learners +- Comments to explain CSS techniques for learners ### Python -- PEP 8 style guidelines -- Clear, educational code examples -- Type hints where e fit help learning +- Follow PEP 8 style guidelines +- Clear and educational code examples +- Use type hints when e go help learning ### Markdown Documentation - Clear heading hierarchy -- Code blocks wey get language specification +- Code blocks with language specification - Links to extra resources -- Screenshots and images inside `images/` folders +- Screenshots and images dey for `images/` directories - Alt text for images for accessibility ### File Organization -- Lessons number one by one (1-getting-started-lessons, 2-js-basics, and so on) -- Every project get `solution/` and most times `start/` or `your-work/` folders -- Images dey inside lesson-specific `images/` folders -- Translations dey `translations/{language-code}/` folder arrangement +- Lessons dey numbered in order (1-getting-started-lessons, 2-js-basics, etc.) +- Every project get `solution/` and sometimes `start/` or `your-work/` directories +- Images dey for lesson-specific `images/` folders +- Translations dey inside `translations/{language-code}/` folder structure ## Build and Deployment ### Quiz App Deployment (Azure Static Web Apps) -Di quiz-app configured for Azure Static Web Apps deployment: +Di quiz-app e configure for Azure Static Web Apps deployment: ```bash cd quiz-app npm run build # Dey create dist/ folder -# Dey deploy wit GitHub Actions workflow wen dem push for main +# Dey deploy with GitHub Actions workflow when you push to main ``` Azure Static Web Apps configuration: @@ -203,23 +203,23 @@ npm run convert # Make PDF from docs ### Docsify Documentation ```bash -npm install -g docsify-cli # Install Docsify for everywhere for di system +npm install -g docsify-cli # Install Docsify everywhere for your system docsify serve # Run am for localhost:3000 ``` ### Project-specific Builds Every project directory fit get im own build process: -- Vue projects: `npm run build` dey create production bundles -- Static projects: No build step, dem just serve files directly +- Vue projects: run `npm run build` to create production bundles +- Static projects: no build step, just serve files directly ## Pull Request Guidelines ### Title Format -Use clear, descriptive titles wey show the change area: +Use clear, descriptive titles wey show the area wey you change: - `[Quiz-app] Add new quiz for lesson X` -- `[Lesson-3] Fix typo for terrarium project` +- `[Lesson-3] Fix typo in terrarium project` - `[Translation] Add Spanish translation for lesson 5` - `[Docs] Update setup instructions` @@ -228,49 +228,49 @@ Use clear, descriptive titles wey show the change area: Before you submit PR: 1. **Code Quality**: - - Run `npm run lint` for projects wey di change affect - - Fix all lint errors and warnings + - Run `npm run lint` in affected project directories + - Fix all linting errors and warnings 2. **Build Verification**: - - Run `npm run build` if e dey necessary + - Run `npm run build` if e dey needed - Make sure no build errors 3. **Link Validation**: - Test all markdown links - - Confirm image references dey work + - Verify image references dey work 4. **Content Review**: - - Proofread grammar and spelling - - Make sure code examples correct and educational - - Confirm translations keep original meaning + - Check for spelling and grammar + - Make sure code examples dey correct and educational + - Verify translations dey keep original meaning ### Contribution Requirements -- Agree to Microsoft CLA (di check na automatic for first PR) -- Follow [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) -- See [CONTRIBUTING.md](./CONTRIBUTING.md) for full guidelines -- Mention issue numbers for PR description if e apply +- Agree to Microsoft CLA (automatic check for first PR) +- Follow the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) +- Check [CONTRIBUTING.md](./CONTRIBUTING.md) for guidelines +- Reference issue numbers inside PR description if e dey ### Review Process -- PR dem dey reviewed by maintainers and community -- Educational clarity na top priority -- Code examples suppose follow correct best practices -- Translations dey reviewed for accuracy and cultural fit +- PRs go dey reviewed by maintainers and community +- Educational clarity na priority +- Code examples suppose follow current best practices +- Translations go dey reviewed for accuracy and cultural fit ## Translation System ### Automated Translation -- Uses GitHub Actions wit co-op-translator workflow -- Translates automatically to 50+ languages +- Use GitHub Actions with co-op-translator workflow +- Translates to 50+ languages automatically - Source files dey main directories -- Translated files dey `translations/{language-code}/` directories +- Translated files dey inside `translations/{language-code}/` folders ### Adding Manual Translation Improvements -1. Find di file for `translations/{language-code}/` -2. Make improvements but keep structure +1. Find file inside `translations/{language-code}/` +2. Make improvements but no disturb structure 3. Make sure code examples still dey work 4. Test any localized quiz content @@ -294,63 +294,63 @@ CO_OP_TRANSLATOR_METADATA: ### Common Issues **Quiz app no dey start**: -- Check Node.js version (v14+ na recommended) +- Check Node.js version (v14+ recommended) - Delete `node_modules` and `package-lock.json`, run `npm install` again -- Check for port conflicts (default: Vite dey use port 5173) +- Check if port dey in use (Vite default dey port 5173) -**API server no go start**: -- Confirm Node.js version dey okay (node >=10) -- Check if port don already dey used -- Make sure all dependencies install with `npm install` +**API server no fit start**: +- Make sure Node.js version pass minimum (node >=10) +- Check if port already dey used +- Make sure all dependencies install finish with `npm install` -**Browser extension no go load**: -- Make sure manifest.json get correct format +**Browser extension no dey load**: +- Check manifest.json well make e correct - Check browser console for errors - Follow browser-specific extension installation instructions **Python chat project wahala**: - Make sure OpenAI package install: `pip install openai` -- Confirm sey GITHUB_TOKEN environment variable dey set +- Check say GITHUB_TOKEN environment variable dey set - Check GitHub Models access permissions **Docsify no dey serve docs**: - Install docsify-cli globally: `npm install -g docsify-cli` -- Run from repository root directory -- Check sey `docs/_sidebar.md` dey +- Run am from repository root directory +- Check that `docs/_sidebar.md` dey there ### Development Environment Tips -- Use VS Code wit Live Server extension for HTML projects +- Use VS Code with Live Server extension for HTML projects - Install ESLint and Prettier extensions for consistent formatting - Use browser DevTools for debugging JavaScript - For Vue projects, install Vue DevTools browser extension ### Performance Considerations -- Plenty translated files (50+ languages) go make full clones big -- Use shallow clone if you dey only work on content: `git clone --depth 1` -- Exclude translations from searches when you dey work on English content -- Build processes fit be slow for first run (npm install, Vite build) +- Plenty translated files (50+ languages) mean full clones dey big +- Use shallow clone if na only content you dey work on: `git clone --depth 1` +- Exclude translations from searches when you dey do English content +- Build processes fit slow for first run (npm install, Vite build) ## Security Considerations ### Environment Variables -- API keys no suppose ever commit to repository -- Use `.env` files (dem don already put am for `.gitignore`) -- Document the required environment variables in project READMEs +- API keys no suppose ever commit go repository +- Use `.env` files (dem dey already inside `.gitignore`) +- Document the environment variables wey project README dem require ### Python Projects - Use virtual environments: `python -m venv venv` -- Keep dependencies updated -- GitHub tokens suppose get only minimum permissions +- Keep dependencies up to date +- GitHub tokens suppose get only minimal needed permissions ### GitHub Models Access -- Personal Access Tokens (PAT) na requirement for GitHub Models -- Store tokens as environment variables -- Never commit tokens or credentials +- Personal Access Tokens (PAT) dey required for GitHub Models +- Tokens suppose store as environment variables +- No ever commit tokens or credentials ## Additional Notes @@ -358,15 +358,15 @@ CO_OP_TRANSLATOR_METADATA: - Complete beginners to web development - Students and self-learners -- Teachers wey dey use di curriculum for classrooms -- Content dey designed for accessibility and gradual skill building +- Teachers wey dey use curriculum for classroom +- Content designed for accessibility and gradual skill building ### Educational Philosophy -- Project-based learning approach +- Project-based learning way - Frequent knowledge checks (quizzes) - Hands-on coding exercises -- Real-world example applications +- Real-world application examples - Focus on fundamentals before frameworks ### Repository Maintenance @@ -374,35 +374,35 @@ CO_OP_TRANSLATOR_METADATA: - Active community of learners and contributors - Regular updates to dependencies and content - Issues and discussions dey monitored by maintainers -- Translation updates automated with GitHub Actions +- Translation updates dey automated via GitHub Actions ### Related Resources - [Microsoft Learn modules](https://docs.microsoft.com/learn/) - [Student Hub resources](https://docs.microsoft.com/learn/student-hub/) -- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) recommended for learners -- Additional courses: Generative AI, Data Science, ML, IoT curricula dey available +- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) wey people recommend for learners +- Other courses: Generative AI, Data Science, ML, IoT curricula dey available ### Working with Specific Projects -For detailed instructions on individual projects, check README files for: +For detailed instructions on individual projects, check README files inside: - `quiz-app/README.md` - Vue 3 quiz application -- `7-bank-project/README.md` - Banking application wit authentication +- `7-bank-project/README.md` - Banking application with authentication - `5-browser-extension/README.md` - Browser extension development - `6-space-game/README.md` - Canvas-based game development - `9-chat-project/README.md` - AI chat assistant project ### Monorepo Structure -Even though no be traditional monorepo, dis repository get many independent projects: -- Every lesson na self-contained +Although dis no be traditional monorepo, dis repository get plenty independent projects: +- Every lesson dey self-contained - Projects no dey share dependencies -- You fit work on individual projects without affecting others -- Clone di whole repo if you want full curriculum experience +- You fit work on projects separately without affecting others +- Clone full repo if you want the complete curriculum experience --- **Disclaimer**: -Dis document don translate wit AI translation service [Co-op Translator](https://github.com/Azure/co-op-translator). Even though we dey try make am correct, abeg sabi say automated translations fit get mistakes or no be 100% accurate. Di original document wey e be for im own language na di correct one. For important info, e better make human professional translate am. We no go take any blame if person no understand well or if dem misunderstand tins wey come from dis translation. +Dis document don translate by AI translation service [Co-op Translator](https://github.com/Azure/co-op-translator). Even though we dey try make am correct, abeg sabi say automated translations fit get mistakes or wrong parts. Di original document wey dey im correct language na im be di real correct source. For important matter, make you use professional human translation. We no go take any blame if person no understand well or interpret am wrong because of dis translation. \ No newline at end of file diff --git a/translations/pcm/README.md b/translations/pcm/README.md index a0f3f375b..ecffe844b 100644 --- a/translations/pcm/README.md +++ b/translations/pcm/README.md @@ -1,37 +1,47 @@ # Web Development for Beginners - A Curriculum -Learn di fundamentals of web development wit our 12-week complete course by Microsoft Cloud Advocates. Each of di 24 lessons go deep into JavaScript, CSS, and HTML through hands-on projects like terrariums, browser extensions, and space games. Engage wit quizzes, discussions, and practical assignments. Improve your skills and make sure sey you sabi well wit our good project-based way to learn. Start your coding journey today! +Learn di fundamentals of web development wit our 12-week complete course by Microsoft Cloud Advocates. Each of di 24 lessons dey dive into JavaScript, CSS, an HTML through hands-on projects like terrariums, browser extensions, an space games. Engage wit quizzes, discussions, an practical assignments. Enhance your skills an optimize your knowledge retention wit our effective project-based way wey we teach. Start your coding journey today! Join di Azure AI Foundry Discord Community -Follow these steps to start to use these resources: +Follow these steps to get started using these resources: 1. **Fork di Repository**: Click [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) 2. **Clone di Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -3. [**Join Di Azure AI Foundry Discord and meet experts and fellow developers**](https://discord.com/invite/ByRwuEEgH4) +3. [**Join The Azure AI Foundry Discord an meet experts an fellow developers**](https://discord.com/invite/ByRwuEEgH4) ### 🌐 Multi-Language Support #### Supported via GitHub Action (Automated & Always Up-to-Date) > **Prefer to Clone Locally?** - -> Dis repository get 50+ language translations wey go make di download size big. To clone without translations, use sparse checkout: +> +> Dis repository get 50+ language translations wey dey increase di download size well well. To clone without translations, use sparse checkout: +> +> **Bash / macOS / Linux:** > ```bash > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > cd Web-Dev-For-Beginners > git sparse-checkout set --no-cone '/*' '!translations' '!translated_images' > ``` -> Dis go give you everything you need to finish di course faster. +> +> **CMD (Windows):** +> ```cmd +> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git +> cd Web-Dev-For-Beginners +> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" +> ``` +> +> Dis go give you everything you need to complete di course wit better faster download. -**If you want make we add more translation languages, dem dey listed [here](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** +**If you wan get more language translations wey support dey listed [here](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** #### 🧑‍🎓 _You be student?_ -Visit [**Student Hub page**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) wey get beginner resources, Student packs and even ways to get free certificate voucher. This na the page wey you go want bookmark and check every time because we dey change content every month. +Visit [**Student Hub page**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) wey you go find beginner resources, Student packs an even ways to get free certificate voucher. Dis na di page you for bookmark an dey check sometimes as we dey switch content monthly. ### 📣 Announcement - New GitHub Copilot Agent mode challenges to complete! -New Challenge don add, look for "GitHub Copilot Agent Challenge 🚀" for most chapters. Na new challenge for you to complete using GitHub Copilot and Agent mode. If you never use Agent mode before e fit no only generate text but also fit create and edit files, run commands and more. +New Challenge add, look for "GitHub Copilot Agent Challenge 🚀" inside plenty chapters. Na new challenge you fit complete using GitHub Copilot an Agent mode. If you never use Agent mode before, e fit not only generate text but fit also create an edit files, run commands an more. ### 📣 Announcement - _New Project to build using Generative AI_ @@ -43,18 +53,13 @@ No miss our new Generative AI curriculum! Visit [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) to start! -![Background](../../translated_images/pcm/background.148a8d43afde5730.webp) - -- Lessons wey cover everything from basics to RAG. -- Talk to historical characters using GenAI and our companion app. -- Fun and interesting story, you go dey time travel! - -![character](../../translated_images/pcm/character.5c0dd8e067ffd693.webp) +- Lessons wey cover everything from basics go RAG. +- Interact wit historical characters usin GenAI an our companion app. +- Fun an engaging story, you go dey time travel! - -Every lesson get assignment to finish, knowledge check and challenge to guide you for learning topics like: -- Prompting and prompt engineering -- Text and image app generation +Each lesson get assignment to complete, knowledge check an challenge to guide you for learning topics like: +- Prompting an prompt engineering +- Text an image app generation - Search apps Visit [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) to start! @@ -63,130 +68,126 @@ Visit [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) to start! ## 🌱 Getting Started -> **Teachers**, we get [some suggestions](for-teachers.md) on how to take use this curriculum. We go like make you give feedback [for our discussion forum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! +> **Teachers**, wey don [put some suggestions](for-teachers.md) on how to use dis curriculum. We go like hear your feedback [for our discussion forum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! -**[Learners](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, for each lesson, start wit pre-lecture quiz and follow am to read di lecture material, finish di activities and check your understanding wit post-lecture quiz. +**[Learners](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, for every lesson, start wit pre-lecture quiz an follow through by reading di lecture material, complete di different activities an check your understanding wit di post-lecture quiz. -To make your learning better, join wit your peers to work on projects together! Discussions dey encouraged for our [discussion forum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) where our moderators go dey available to answer your questions. +To better your learning experience, connect wit your peers make una work on di projects together! Discussions dem dey encouraged for our [discussion forum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) where our moderators go dey ready to answer your questions. -To continue your education, we dey recommend say you check [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) for more study materials. +To go further your education, we highly recommend say you explore [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) for extra study materials. ### 📋 Setting up your environment -Dis curriculum get development environment ready! As you start, you fit choose run di curriculum for [Codespace](https://github.com/features/codespaces/) (_na browser-based, no need install environment_), or locally for your computer using text editor like [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +Dis curriculum get development environment ready! As you start you fit choose to run di curriculum in a [Codespace](https://github.com/features/codespaces/) (_na browser-based, no installation environment_), or locally for your computer using text editor like [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). #### Create your repository -To make am easy for you to save your work, e good make you create your own copy of dis repository. You fit do am by clicking di **Use this template** button at di top of di page. E go create new repository for your GitHub account with copy of di curriculum. +Make you fit save your work well well, e good make you create your own copy of this repository. You fit do am by clicking **Use this template** button wey dey top of di page. E go create new repository inside your GitHub account wit copy of di curriculum. Follow these steps: -1. **Fork the Repository**: Click on di "Fork" button for top-right corner of dis page. -2. **Clone the Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` - -#### Running di curriculum in a Codespace +1. **Fork di Repository**: Click di "Fork" button wey dey top-right corner of this page. +2. **Clone di Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -For your copy of dis repository wey you create, click di **Code** button and select **Open with Codespaces**. E go create new Codespace for you to work. +#### Running di curriculum inside Codespace -![Codespace](../../translated_images/pcm/createcodespace.0238bbf4d7a8d955.webp) +For your copy of dis repository wey you create, click di **Code** button then select **Open with Codespaces**. E go create new Codespace for you work. #### Running di curriculum locally on your computer -To run dis curriculum locally for your computer, you go need text editor, browser and command line tool. Our first lesson, [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages), go show you options for each of these tools to pick wey fit you best. +To run dis curriculum locally for your computer, you need text editor, browser an command line tool. Our first lesson, [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages), go show you different options for all these tools make you choose wetin best for you. -Our advice na to use [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) as your editor, wey get inside [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). You fit download Visual Studio Code [here](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). - -1. Clone your repository to your computer. You fit do am by clicking di **Code** button and copy di URL: +We recommend say you use [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) as your editor, wey get built-in [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). You fit download Visual Studio Code [here](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +1. Copy yor repository go yor computer. You fit do dis by klik di **Code** button den copy di URL: [CodeSpace](./images/createcodespace.png) -Then, open [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) inside [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) and run dis command, replace `` with di URL wey you just copy: + + Den, open [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) for [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) den run dis command, change `` wit di URL wey you just copy: ```bash git clone ``` -2. Open di folder for Visual Studio Code. You fit do dis by click **File** > **Open Folder** and choose di folder wey you just clone. +2. Open di folder inside Visual Studio Code. You fit do dis by clicking **File** > **Open Folder** den select di folder wey you just clone. - -> Recommended Visual Studio Code extensions: +> Recommended Visual Studio Code extensions: > -> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - for preview HTML pages inside Visual Studio Code +> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - to preview HTML pages inside Visual Studio Code > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - to help you write code quick quick ## 📂 Each lesson get: -- optional sketchnote -- optional supplemental video -- pre-lesson warmup quiz -- written lesson -- for project-based lessons, step-by-step guides on how to build di project +- sketchnote if you want +- extra video if you want +- quiz to prepare for lesson +- di lesson wey dem write +- for project-based lessons, guide step by step how to build di project - knowledge checks - challenge -- supplemental reading +- extra reading - assignment - [post-lesson quiz](https://ff-quizzes.netlify.app/web/) -> **One note about quizzes**: All quizzes dey inside Quiz-app folder, total na 48 quizzes with three questions each. Dem dey available [here](https://ff-quizzes.netlify.app/web/), di quiz app fit run locally or you fit deploy am for Azure; follow di instruction inside `quiz-app` folder. +> **Note about quizzes**: All di quizzes dey inside Quiz-app folder, 48 quizzes total and every one get three questions. You fit find dem [here](https://ff-quizzes.netlify.app/web/) quiz app fit run for your own machine or you fit deploy am for Azure; follow instruction for di `quiz-app` folder. ## 🗃️ Lessons | | Project Name | Concepts Taught | Learning Objectives | Linked Lesson | Author | | :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | -| 01 | Getting Started | Introduction to Programming and Tools of the Trade | Learn di basic foundation wey most programming languages get and about software wey dey help professional developers do dia work | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | -| 02 | Getting Started | Basics of GitHub, including how to work with team | How to use GitHub for your project, how to collaborate with others on code base | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 01 | Getting Started | Introduction to Programming and Tools of the Trade | Learn di basic foundation behind most programming languages and software wey dey help pro developers do their work | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | Getting Started | Basics of GitHub, dey include work with team | How to use GitHub for your project, how to collaborate wit others for code base | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | | 03 | Getting Started | Accessibility | Learn di basics of web accessibility | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | -| 04 | JS Basics | JavaScript Data Types | Basics of JavaScript data types | [Data Types](./2-js-basics/1-data-types/README.md) | Jasmine | -| 05 | JS Basics | Functions and Methods | Learn about functions and methods to manage how application logic dey flow | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | -| 06 | JS Basics | Making Decisions with JS | Learn how to create condition inside your code using decision-making methods | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | Jasmine | -| 07 | JS Basics | Arrays and Loops | Work with data using arrays and loops in JavaScript | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine | -| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML in Practice | Build di HTML to create online terrarium, dey focus on building layout | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | -| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS in Practice | Build di CSS to style di online terrarium, focus on basics of CSS including making di page responsive | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | -| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript Closures, DOM manipulation | Build di JavaScript to make terrarium work as drag/drop interface, focus on closures and DOM manipulation | [JavaScript Closures, DOM manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | -| 11 | [Typing Game](./4-typing-game/solution/README.md) | Build a Typing Game | Learn how to use keyboard events to run the logic of your JavaScript app | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher | -| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Working with Browsers | Learn how browsers work, dia history, and how to scaffold di first elements of a browser extension | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen | -| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Building form, dey call API and storing variables inside local storage | Build JavaScript elements of your browser extension to call API using variables wey dey store inside local storage | [APIs, Forms, and Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | -| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Background processes for browser, web performance | Use browser background processes to manage extension icon; learn about web performance and some optimization to improve am | [Background Tasks and Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | -| 15 | [Space Game](./6-space-game/solution/README.md) | More Advanced Game Development with JavaScript | Learn about Inheritance using both Classes and Composition and Pub/Sub pattern, to prepare for building game | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris | -| 16 | [Space Game](./6-space-game/solution/README.md) | Drawing to canvas | Learn about di Canvas API wey dem dey use to draw elements for screen | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | -| 17 | [Space Game](./6-space-game/solution/README.md) | Moving elements around di screen | Discover how elements fit move using Cartesian coordinates and di Canvas API | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | Chris | -| 18 | [Space Game](./6-space-game/solution/README.md) | Collision detection | Make elements collide and react to each other with keypresses and put cooldown function to make sure game performance pep | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris | -| 19 | [Space Game](./6-space-game/solution/README.md) | Keeping score | Do math calculations based on di game status and performance | [Keeping Score](./6-space-game/5-keeping-score/README.md) | Chris | -| 20 | [Space Game](./6-space-game/solution/README.md) | Ending and restarting di game | Learn about ending and restarting game, including cleaning up assets and resetting variable values | [The Ending Condition](./6-space-game/6-end-condition/README.md) | Chris | -| 21 | [Banking App](./7-bank-project/solution/README.md) | HTML Templates and Routes for Web App | Learn how to create scaffold of multipage website architecture using routing and HTML templates | [HTML Templates and Routes](./7-bank-project/1-template-route/README.md) | Yohan | -| 22 | [Banking App](./7-bank-project/solution/README.md) | Build Login and Registration Form | Learn how to build forms and handle validation routines | [Forms](./7-bank-project/2-forms/README.md) | Yohan | -| 23 | [Banking App](./7-bank-project/solution/README.md) | Methods of Fetching and Using Data | How data dey flow in and out of your app, how to fetch am, store am, and discard am | [Data](./7-bank-project/3-data/README.md) | Yohan | +| 04 | JS Basics | JavaScript Data Types | Di basics of JavaScript data types | [Data Types](./2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS Basics | Functions and Methods | Learn about functions and methods to manage an app logic flow | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | +| 06 | JS Basics | Making Decisions with JS | Learn how to create conditions for your code using decision-making methods | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS Basics | Arrays and Loops | Work wit data using arrays and loops inside JavaScript | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML in Practice | Build di HTML to create online terrarium, focus on building layout | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS in Practice | Build di CSS to style the online terrarium, focus on basics of CSS including how to make di page responsive | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript Closures, DOM manipulation | Build di JavaScript to make di terrarium work as drag/drop interface, focus on closures and DOM manipulation | [JavaScript Closures, DOM manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [Typing Game](./4-typing-game/solution/README.md) | Build a Typing Game | Learn how to use keyboard events to drive the logic of your JavaScript app | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher | +| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Working with Browsers | Learn how browsers dey work, their history, and how to scaffold first elements of browser extension | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Build form, call API and store variables for local storage | Build di JavaScript elements for your browser extension to call API using variables wey dey inside local storage | [APIs, Forms, and Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Background processes inside browser, web performance | Use browser background processes to manage extension icon; learn about web performance and optimizations | [Background Tasks and Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [Space Game](./6-space-game/solution/README.md) | More Advanced Game Development with JavaScript | Learn about Inheritance using Classes and Composition and Pub/Sub pattern, prepare for building a game | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris | +| 16 | [Space Game](./6-space-game/solution/README.md) | Drawing to canvas | Learn about Canvas API, wey dem use to draw elements for screen | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [Space Game](./6-space-game/solution/README.md) | Moving elements around screen | Find out how elements fit move using cartesian coordinates and Canvas API | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [Space Game](./6-space-game/solution/README.md) | Collision detection | Make elements collide and react to each other using keypress and provide cooldown to keep game performance | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [Space Game](./6-space-game/solution/README.md) | Keeping score | Do maths calculations based on game's status and performance | [Keeping Score](./6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [Space Game](./6-space-game/solution/README.md) | Ending and restarting game | Learn about how to end and restart game, including cleaning up assets and reseting variables | [The Ending Condition](./6-space-game/6-end-condition/README.md) | Chris | +| 21 | [Banking App](./7-bank-project/solution/README.md) | HTML Templates and Routes for Web App | Learn how to create scaffold for multipage website architecture using routing and HTML templates | [HTML Templates and Routes](./7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [Banking App](./7-bank-project/solution/README.md) | Build Login and Registration Form | Learn about building forms and how to handle validation routines | [Forms](./7-bank-project/2-forms/README.md) | Yohan | +| 23 | [Banking App](./7-bank-project/solution/README.md) | Methods of Fetching and Using Data | How data go inside and outside your app, how to fetch, store am, and clear am | [Data](./7-bank-project/3-data/README.md) | Yohan | | 24 | [Banking App](./7-bank-project/solution/README.md) | Concepts of State Management | Learn how your app dey keep state and how to manage am programmatically | [State Management](./7-bank-project/4-state-management/README.md) | Yohan | -| 25 | [Browser/VScode Code](../../8-code-editor) | Working with VScode | Learn how to Using code editor| [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | +| 25 | [Browser/VScode Code](../../8-code-editor) | Working with VScode | Learn how to use code editor | [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | | 26 | [AI Assistants](./9-chat-project/README.md) | Working with AI | Learn how to build your own AI assistant | [AI Assistant project](./9-chat-project/README.md) | Chris | ## 🏫 Pedagogy -Our curriculum design take two main pedagogy principles seriously: +Our curriculum design get two important pedagogical principles in mind: * project-based learning * frequent quizzes -Di program dey teach fundamentals of JavaScript, HTML, and CSS, plus di latest tools and techniques wey web developers dey use now. Students go fit develop hands-on experience by building typing game, virtual terrarium, eco-friendly browser extension, space-invader style game, and banking app for businesses. By the end of the course, students go get solid understanding of web development. - -> 🎓 You fit take di first few lessons in dis curriculum as [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) for Microsoft Learn! +Di program dey teach fundamentals of JavaScript, HTML, and CSS, plus di latest tools and techniques wey web developers dey use today. Students go get chance to build hands-on experience by making typing game, virtual terrarium, eco-friendly browser extension, space-invader-style game, and banking app for business dem. By end of di series, students go sabi web development well well. -By making sure content match projects, the process go make learning more interesting for students and concepts go remain for mind well well. We also write some starter lessons for JavaScript basics to introduce concepts, plus video from "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" collection of video tutorials, some authors from the videos join to help design this curriculum. +> 🎓 You fit take di first few lessons for dis curriculum as [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) for Microsoft Learn! -Plus, low-stakes quiz before class dey set student mindset for learning topic, and second quiz after class make sure say dem remember well. This curriculum na flexible and fun one wey you fit do as whole or part. Projects start small and go get more complex by 12-week cycle end. +By making sure say di content match projects, e make di process beta and more interesting for students and e go help dem remember concepts well. We self write some starter lessons for JavaScript basics to introduce concepts, plus video from "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" video collection, wey some authors contribute to this curriculum. -Even though we no bother to introduce JavaScript frameworks so that we go focus on basic skills wey web developers need before use framework, good next step after dis curriculum na to learn Node.js with another video series: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". +Plus, a low-stakes quiz before class dey set student mind to learn topic, while second quiz after class go help dem remember am pass. This curriculum design to be flexible and fun and fit be taken as whole or part. The projects start small and go dey more complex by end of 12-week cycle. -> Visit our [Code of Conduct](CODE_OF_CONDUCT.md) and [Contributing](CONTRIBUTING.md) guidelines. We welcome your constructive feedback! +Even though we no include JavaScript frameworks purposely to focus on basic skills wey web developer suppose get before using framework, next step wey fit make sense after dis curriculum na to learn about Node.js via another video collection: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". +> Check our [Code of Conduct](CODE_OF_CONDUCT.md) and [Contributing](CONTRIBUTING.md) guidelines. We dey welcome your constructive feedback! ## 🧭 Offline access -You fit run dis documentation offline by using [Docsify](https://docsify.js.org/#/). Fork this repo, [install Docsify](https://docsify.js.org/#/quickstart) for your local machine, then for root folder of dis repo, type `docsify serve`. Di website go dey serve for port 3000 for your localhost: `localhost:3000`. +You fit run dis documentation offline by using [Docsify](https://docsify.js.org/#/). Fork dis repo, [install Docsify](https://docsify.js.org/#/quickstart) for your local machine, then for root folder of this repo, type `docsify serve`. Di website go run for port 3000 on your localhost: `localhost:3000`. ## 📘 PDF - -PDF of all di lessons fit find [here](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). +A PDF of all of the lessons fit find [here](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). ## 🎒 Other Courses -Our team dey produce oda courses! Make you check am out: + +Our team dey produce other courses! Check am out: ### LangChain @@ -230,21 +231,21 @@ Our team dey produce oda courses! Make you check am out: ## Getting Help -If you jam or get any question about how to build AI apps. Come join other learners and developers wey sabi well well for talks about MCP. Na supportive community wey dey welcome questions and dem share knowledge freely. +If you jam or get any questions about how to build AI apps, join other learners and experienced developers for discussions about MCP. Na supportive community where questions dey welcome and knowledge dey shared freely. [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -If you get product feedback or you see error as you dey build, visit: +If you get product feedback or find errors while you dey build, visit: [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) ## License -Dis repository get MIT license. See the [LICENSE](../../LICENSE) file for more info. +This repository get MIT license. See the [LICENSE](../../LICENSE) file for more info. --- **Disclaimer**: -Dis document don translate wit AI translation service wey dem dey call [Co-op Translator](https://github.com/Azure/co-op-translator). Even though we dey try make am correct, abeg mek you sabi say machine translation fit get some errors or wrong tins. The og document for im original language na di correct one wey you suppose trust. If na important info, better make person wey sabi translate am well do the work. We no go take responsibility if pesin no understand or misunderstand tins because of dis translation. +Dis document e been translate wit AI translation service [Co-op Translator](https://github.com/Azure/co-op-translator). Even tho we dey try make am correct, abeg sabi say automatic translation fit get some mistakes or no too correct. Di original document wey e dey for im correct language na di correct one. For important tins, make person wey sabi translate do di work. We no go responsible if pipo no understand well or if dem misinterpret tins because of dis translation. \ No newline at end of file diff --git a/translations/ta/.co-op-translator.json b/translations/ta/.co-op-translator.json index cfafd8fb8..79ed22e85 100644 --- a/translations/ta/.co-op-translator.json +++ b/translations/ta/.co-op-translator.json @@ -1,7 +1,7 @@ { "1-getting-started-lessons/1-intro-to-programming-languages/README.md": { - "original_hash": "d45ddcc54eb9232a76d08328b09d792e", - "translation_date": "2026-01-07T13:56:32+00:00", + "original_hash": "bec5e35642176d9e483552bfc82996d8", + "translation_date": "2026-03-06T15:24:09+00:00", "source_file": "1-getting-started-lessons/1-intro-to-programming-languages/README.md", "language_code": "ta" }, @@ -493,7 +493,7 @@ }, "AGENTS.md": { "original_hash": "a362efd06d64d4134a0cfe8515a86d34", - "translation_date": "2026-02-06T19:00:23+00:00", + "translation_date": "2026-03-06T15:38:26+00:00", "source_file": "AGENTS.md", "language_code": "ta" }, @@ -516,8 +516,8 @@ "language_code": "ta" }, "README.md": { - "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc", - "translation_date": "2026-02-06T18:55:52+00:00", + "original_hash": "a2c9eed480687319517c08a6319e5536", + "translation_date": "2026-03-06T15:19:59+00:00", "source_file": "README.md", "language_code": "ta" }, diff --git a/translations/ta/1-getting-started-lessons/1-intro-to-programming-languages/README.md b/translations/ta/1-getting-started-lessons/1-intro-to-programming-languages/README.md index ca3ba1e2a..28b8b3d2d 100644 --- a/translations/ta/1-getting-started-lessons/1-intro-to-programming-languages/README.md +++ b/translations/ta/1-getting-started-lessons/1-intro-to-programming-languages/README.md @@ -1,181 +1,180 @@ -# நிரலாக்க மொழிகள் மற்றும் நவீன டெவலப்பர் கருவிகளின் அறிமுகம் - -வணக்கம், எதிர்கால டெவலப்பர்! 👋 நான் உனக்காக அன்றாடம் என்னை அதிர்ச்சிக்கு உட்படுகின்ற ஒரு விஷயத்தைச் சொல்லலாமா? நிரலாக்கம் என்பது கணினிகளுக்கே மட்டும் அல்ல – அது உங்கள் ஆச்சரியமான யோசனைகளை உயிரோட்டம் கொடுக்கும் உண்மையான அதிசய சக்திகளைப் பெறுவது! +# ծրագրավորման լեզուներ மற்றும் நவீன டெவலப்பர் கருவிகள் அறிமுகம் -நீங்கள் உங்கள் பிடித்த செயலியை பயன்படுத்தும் அந்த நிமிடத்தை நினைக்கிறீர்களா? ஒரு பொத்தானை தொட்டவுடனேயே ஏதாவது அதிசயமானது நடக்கிறது, அதனால் நீங்கள் "வாவ், அவர்கள் இதை எப்படி செய்தார்கள்?" என்று நினைக்கிறீர்கள். அந்த வெகு-அதெப்படி செய்தவர், ஒருவன் நீங்கள் போலவே இருக்கும் – பத்தி espresso மூன்றாவது கப் குடித்து 2 AM-க்கு தனது பிடித்த காபிக் கடையில் உட்கார்ந்திருக்கும் – அந்தக் குறியீட்டை எழுதுபவர். இப்போது உங்களுக்கு அதிர்ச்சியானது என்னவென்றால்: இந்த பாடத்தைக் கடைசியில் நீங்கள் அவர்கள் எப்படி அதைச் செய்தார்கள் என்று புரிந்து கொள்வதோடு, நீங்கள் அதை உங்கள் அருவில் முயற்சிக்கவேண்டும் என்ற ஆசைஉண்டாகும்! +வணக்கம், எதிர்கால டெவலப்பர்! 👋 நான் உனக்கு ஒரு விஷயம் சொல்லலாமா, அது ஒவ்வொரு நாளும் என்னை குளிர்ச்சியடைய வைத்துக் கொள்கிறது? நீ பிரோகிராமிங் கணினிகளுக்கே மட்டும் සීමிதப்படுவதில்லை என்று கண்டுபிடிக்கப் போகிறாய் – இது உன் கற்பனையான எண்ணங்களை உயிரோட்டம் கொடுக்கும் உண்மையான சூப்பர்பவர் சக்திகளைப் பெறுவதாகும்! -பிரமாதம், நீங்கள் மெழுகுவிக்கும் போது நிரலாக்கம் இப்போது நெருக்கமானதாக தோன்றினால் நான் மிகுந்த அணுகப்படுகிறேன். நான் தொடங்கும்போது, உண்மையில் நீங்கள் ஒரு கணித நிபுணராக இருக்க வேண்டும் அல்லது நீங்கள் ஐந்து வயதாக இருந்தே நிரலாக்கம் செய்திருப்பதாக கண்டேன். ஆனால் என்னை முழுமையாக மாற்றியது என்னவெனில்: நிரலாக்கம் என்பது ஒரு புதிய மொழியில் உரையாடல் கற்றுக் கொள்வதுபோலவே உள்ளது. நீங்கள் "வணக்கம்" மற்றும் "நன்றி" இலிருந்து துவங்கி, காபி ஆர்டர் செய்வதற்கும் காய்ச்சலை தொடங்குகிறீர்கள், பிறகு நீண்ட தத்துவ உரையாடல்கள் நடக்கின்றன! இங்கே நீங்கள் கணினிகளோடு உரையாடுகிறீர்கள், மற்றும் உண்மையில்? அவர்கள் மிகுந்த பொறுமையுடன் உரையாடுகிறார்கள் – உங்கள் பிழைகளைத் தீர்மானிக்க மாட்டார்கள் மற்றும் எப்போதும் மீண்டும் முயற்சிக்க உற்சாகமாக இருப்பார்கள்! +உனக்கு பிடித்த ஆப் பயன்படுத்தும் போது எல்லாமே சரியாக திகழும் அந்த தருணம் நீ அறிந்திருக்கிறாயா? ஒரு பொத்தானை தட்டினால் எதுவோ அதிசயமானது நடக்கிறது, அது “வாவ், அவர்கள் இது எப்படி செய்தார்கள்?” என்று உனக்கு மிகுந்த வியப்பு தரும் நேரம். அந்த கதை உனக்கும் போன்ற ஒருவரால் எழுதப்பட்டது – அவருடைய பிடித்த காபி கடையில் இரவு 2 மணிக்கு, மூன்றாவது எஸ்பிரெசோ உடன் இருந்தே – அந்த மாயத்தை உருவாக்கிய கோட். இங்கே உன் மனதை அதிர வைத்துக் கொண்டாடும் விஷயம் என்னவென்றால்: இந்த பாட முடிந்தவுடன், அவர்கள் எப்படி செய்தார்கள் என்பதை புரிந்துகொள்ள மட்டும் இல்லாமல், நீயும் அதை செய்ப்பதற்கு உற்சாகமாக இருப்பாய்! -இன்று, நவீன வலைத் தள மேம்பாட்டை சாத்தியமாக்கும் அதிசய கருவிகளை நாம் ஆராயப்போகிறோம். நான் பேசுகிறேன் Netflix, Spotify மற்றும் உங்கள் பிடித்த சினிமா செயலி நிறுவனத்தின் டெவலப்பர்கள் தினமும் பயன்படுத்தும் அதே எடிட்டர்கள், உலாவிகள் மற்றும் வேலை முறைகள் பற்றி. மற்றும் நீங்கள் சந்தோஷமாக டான்ஸ் செய்யப்போகும் பகுதி இது: இந்த தொழில்முறை தர மாதிரி, தொழில்நுட்ப அங்கீகாரம் பெற்ற கருவிகள் பெரும்பாலான பகுதியும் முழுமையாக இலவசம்! +புரியாய், இப்போது பிரோகிராமிங் கஷ்டமாக தோன்றினாலும் நான் முழுமையாக புரிகிறேன். நான் தொடங்கியபோது, நிச்சயம் கணிதம் வாய்ந்த ஜீனியஸ் அல்லது 5 வயதில் இருந்து கோடிங் செய்து கொண்டதான் என்று நினைத்தேன். ஆனால் என்னை மாற்றிய விஷயம் என்னவென்றால்: பிரோகிராமிங் என்பது புதிய ஒரு மொழியில் உரையாடல்களை கற்றுக்கொள்வது போன்றது. "ஹலோ" மற்றும் "நன்றி" என்பதிலிருந்து தொடங்கி, காபி ஆர்டர் செய்யும் அளவுக்கு வளர்ந்து, அதன் பிறகு ஆழமான தத்துவ உரையாடல்கள் நடக்கும்! இதுவே கூறத்தக்கது, உனக்கு கணினிகளுடன் உரையாடல்கள் நடத்துகிறாய் என்பது, அவர்கள் மிக பொறுமையான உரையாடல் தோழர்கள் – எப்போதும் உன் பிழைகளை மதிப்பிடாது, மீண்டும் முயற்சி செய்ய ஆவலுடன் இருக்கும்! + +இன்று நம்மால் நவீன வலை மேம்பாட்டை சாத்தியமாகக்காட்டும் அற்புதமான கருவிகளை ஆராயப்போகிறோம். நான் சொல்வது Netflix, Spotify மற்றும் உன் பிடித்த சுயாதீன ஆப் நிறுவனம் பயன்படுத்தும் அதே பதிப்பகங்கள், உலாவிகள் மற்றும் பணியூக்கிகள். இதோ உனக்கு மகிழ்ச்சியான செய்தி: இந்த தொழில்முறை தரமான கருவிகள் பெரும்பாலும் இலவசமாக கிடைக்கின்றன! ![Intro Programming](../../../../translated_images/ta/webdev101-programming.d6e3f98e61ac4bff.webp) -> சுருக்கக்குறிப்பு: [Tomomi Imura](https://twitter.com/girlie_mac) அவர்களின் படைப்பு +> சுருக்கோட்டை [Tomomi Imura](https://twitter.com/girlie_mac) அவர்களால் ```mermaid journey - title உங்கள் நிரல்பாடு பயணம் இன்று - section கண்டறிதல் - நிரல்பாடு என்றால் என்ன: 5: You - நிரல்பாட்டு மொழிகள்: 4: You - கருவிகள் பார்வை: 5: You + title உங்கள் நிரலாக்க பயணம் இன்று + section கண்டுபிடி + நிரலாக்கம் என்பது என்ன: 5: You + நிரலாக்க மொழிகள்: 4: You + கருவிகள் நோக்கு: 5: You section ஆராய்ச்சி - குறியீடு தொகுப்பிகள்: 4: You - உலாவிகள் & தயாரிப்புக் கருவிகள்: 5: You + குறியீடு ஆசிரியர்கள்: 4: You + உலாவிகள் & டெவ் கருவிகள்: 5: You கட்டளை வரி: 3: You section பயிற்சி - மொழி காவலர்: 4: You + மொழி детектив்: 4: You கருவி ஆராய்ச்சி: 5: You - சமுதாய தொடர்பு: 5: You + சமூக தொடர்பு: 5: You ``` -## உங்களுக்கு ஏற்கனவே தெரிந்துள்ளதை காண்போம்! - -மகிழ்ச்சியான விஷயங்களில் தாவுவதற்கு முன், நான் ஆச்சரியமாக இருக்கிறேன் – இந்த நிரலாக்க உலகம் பற்றி நீங்கள் ஏது அறிந்திருக்கிறீர்கள்? மற்றும் கேளுங்கள், இந்தக் கேள்விகளைப் பார்த்து "நான் இதுவரை ஒருபோதும் இதைப் பற்றி கூட புரியவில்லை" என நீங்கள் எண்ணினாலும் அது சரிதான், அது சிறந்தது! அதாவது நீங்கள் சரியான இடத்தில் உள்ளீர்கள். இந்த வினாடி வினா கேள்வியை உடற்பயிற்சி முன்பு உதிர்த்தலாக நினைக்கவும் – நாம் உங்கள் மூளையின் தசைகளை வெற்றிகரமாக வெப்பப்படுத்துகிறோம்! +## நீ இவ்வளவு தான் எதைக் கற்றிருக்குகிறாய் என்பதைப் பார்க்கலாம்! -[முந்தைய பாட தேர்வை எடுக்கவும்](https://forms.office.com/r/dru4TE0U9n?origin=lprLink) +களவி எடுத்துப் பார்க்கும் முன், நான் ஆர்வமாக இருக்கிறேன் – இந்த பிரோகிராமிங் உலகத்தில் நீ முன்னதாக என்ன அறிவு கொண்டிருக்கிறாய்? இது பற்றி ஒன்றும் தெரியவில்லை என்று நினைத்தால் அதுவே சரி, அது சரியான இடம்! இந்த வினாடி வினா ஆனது உடற்பயிற்சி முன்னர் உடல்களை வளைக்கும் போல – நாம் சில நிமிடங்கள் வளர்ந்து கொண்டே இருக்கிறோம்! +[முன் பாட வினாடி வினா எடு](https://ff-quizzes.netlify.app/web/) -## நாம் ஒன்றாக செல்லப்போகும் சாகசம் +## நம்மால் ஒன்றாக செல்லப்போகும் பயணம் -சரி, நான் இந்த நாளில் நாம் ஆராயப்போகும் விஷயங்கள் பற்றி உண்மையில் உற்சாகமாக குதூகலிக்கிறேன்! ஐயோ, சில கருத்துக்கள் புரியும்போது உங்களுடைய முகத்தை பார்க்க விரும்புகிறேன். இங்கே நாம் ஒன்றாக பயணிக்கப்போகும் அதிசயம்: +சரி, இன்று நாம் ஆராயப்போகும் விஷயங்களை பற்றி நான் உண்மையாய் ஆர்வமுடன் இருக்கிறேன்! உண்மையைச் சொல்ல, இந்த சில கருத்துக்கள் உனக்கு புரியும்போது உன் முகத்தை நான் காண விரும்புகிறேன். இங்கே நம்மால் சேர்ந்து செய்யப்போகும் அற்புதமான பயணம்: -- **நிரலாக்கம் உண்மையில் என்ன (என்னவென்றால் இது மிக அற்புதமானது!)** – நீங்கள் சுற்றியுள்ள அனைத்தையும் இயக்கும் மறைமுக அதிசய சக்தி என்று குறியீடு எப்படி வேலை செய்கிறது என்பதை காண்போம், திங்கட்கிழமை காலை என்பது அறியும் அலாரம் இருந்து உங்கள் Netflix பரிந்துரைகளை சரியான முறையில் உருவாக்கும் அல்கோரிதம் வரை -- **நிரலாக்க மொழிகளும் அவற்றின் அற்புதமான தன்மைகளும்** – ஒவ்வொரு நபரும் பல வல்லுனர் சக்திகள் மற்றும் சிக்கல்களை தீர்க்கும் விதமாகவே இருக்கும் ஒரு விழாவில் நடந்து செல்ல்வதை கற்பனை செய்யுங்கள். நிரலாக்க மொழிகள் உலகம் அப்படியே இருக்கிறது, நீங்கள் அவர்கள் அனைவரையும் சந்திக்க பிடிக்கும்! -- **டிஜிட்டல் அதிசயம் எவ்வாறு நடக்கிறது என்ற அடிப்படை கட்டிடம்** – இதை உத்தமமான படைப்பாற்றல் LEGO சேட்டாக கருதுங்கள். இந்த துண்டுகள் எப்படி பொருந்துகின்றன என்பதை புரிந்தால், நீங்கள் உங்கள் கனவுகளுக்கேற்ற ஒன்றை உருவாக்க முடியும் என்று நீங்கள் உணர்வீர்கள் -- **தொழில்முறை கருவிகள், நீங்கள் செவ்வணக்கு கைகளைப் பெறுவதாக உணர்த்தும்** – நான் மிகுந்த நாடகராக இருக்கவில்லை – இந்த கருவிகள் உங்களுக்கு அதிசய சக்திகள் உண்டு என்று உணர்த்தும், மற்றும் சிறந்த பகுதி? தொழில்முறை நிபுணர்கள் பயன்படுத்தும் அதே கருவிகள்! +- **பிரோகிராமிங் என்றால் என்ன (அது ஏன் மிகவும் சமரசமானது!)** – கோடு என்பது உன் சுற்றிலும் இருக்கும் அனைத்திற்கும் அசாதாரண மாயம் என்பதை நாம் கண்டுபிடிக்கப்போவது, அது எப்படி திங்கள் காலை என்று அறிவதைக் காட்டிலும் நுண்ணறிவு கொண்ட அலாரம் இருக்கும், கடைசியில் Netflix பரிந்துரைகளை சரியாக தேர்ந்தெடுக்கும் ஆல்கொரிதம் +- **பிரோகிராமிங் மொழிகள் மற்றும் அவற்றின் அற்புதமான தனித்துவங்கள்** – ஒவ்வொரு நபரும் வெவ்வேறு சூப்பர்பவர் திறமைகளும் பிரச்சினைகள் தீர்ப்பும் வழிகளும் கொண்டிருக்கின்ற நிகழ்ச்சியில் செல்வது போன்றது. அப்படித்தான் பிரோகிராமிங் மொழிகளில் உன்னை சந்திக்கப்போகிறாய்! +- **டிஜிட்டல் மாயம் உருவாக்கும் அடிப்படை கட்டடக்கட்டிகள்** – இதைப் புத்தக வண்ண LEGO அமைப்பாக நினைத்து கொள். இந்த துண்டுகள் எப்படி ஒன்று சேர்ந்தால், உன் கற்பனை கனவாகும் எல்லாவற்றையும் உருவாக்க முடியும் என்று உணர்வாய் +- **உனக்கு ஒரு வழிபாட்டு குச்சியை வழங்கும் தொழில்முறை கருவிகள்** – நான் மிக அதிகமாகச் சொல்லவில்லை – இவை உனக்கு சூப்பர்பவர் சக்தி சூட்டும் உணர்வைப் புதுப்பிக்கும், மிகச் சிறந்தது என்னவென்றால்? இவை அஞ்சல்காரர்கள் பயன்படுத்தும் தான்! -> 💡 **வேறு ஒரு விஷயம்**: இன்று எல்லாவற்றையும் நினைவில் வைக்க முயற்சிக்க வேண்டாம்! இப்போது, நீங்கள் சாத்தியமானதற்கான உற்சாகத்தை உணர வேண்டும். விவரங்கள் இயல்பாக நமது பயிற்சியில் நிலைத்திருக்கும் – அதுவே உண்மையான கற்றல்! +> 💡 **இதுதான் முக்கியமாகும்**: இன்றைய தினம் எல்லாவற்றையும் நினைவில் வைக்க முயற்சிக்காதே! இப்போது, என்னை உன் மனதில் ஒரு ஆர்வத்தை எரிய வைத்து விட விரும்புகிறேன். விவரங்கள் தானாகவே நம்முடன் பயிற்சி செய்யும்போது பதியிடும் – அதுதான் உண்மையான கற்றல்! -> நீங்கள் இந்த பாடத்தை [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon) இல் எடுக்கலாம்! +> உன் நிறுவலில் இந்த பாடத்தை [Microsoft Learn](https://learn.microsoft.com/en-us/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon) இல் எடுக்க முடியும்! -## நிரலாக்கம் என்பது *என்ன*? +## அப்படியானால், பிரோகிராமிங் *என்ன*? -சரி, ஒரு கோடிக் கேள்வியைச் சமாளிப்போம்: நிரலாக்கம் உண்மையில் என்ன? +சரி, இந்த நூற்றுக்கணக்கான கேள்வியை நாம் எதிர்கொள்ளலாம்: பிரோகிராமிங் என்பது உண்மையில் என்ன? -நான் இன்று உங்களுக்காக ஒரு கதை சொல்கிறேன், இது என்னைப் முழுமையாக மாற்றியது. கடந்த வாரம், நான் என் அம்மாவுக்கு எங்கள் புதுவிதமான ஸ்மார்ட் டிவி ரிமோட்டை எப்படி பயன்படுத்துவது என்பதைக் கூற முயன்றேன். "சிவப்பு பொத்தானை அழுத்து, ஆனால் பெரிய சிவப்பு பொத்தானை அல்ல, இடதுபுற的小ை சிவப்பு பொத்தானை... இல்லை, உங்கள் இன்னும் இடது... சரி, இப்போது இரண்டு நொடிகள் பிடித்து வையுங்கள், ஒரு நொடி அல்ல, முப்பு நொடி அல்ல..." என்றபடியே சொன்னேன். பரிச்சயமா? 😅 +நான் உனக்கு ஒரு கதையை சொல்ல போகிறேன், அது என் பார்வையை முழுமையாக மாற்றி விட்டது. கடந்த வாரம், நான் என் அன்னைக்கு எங்கள் புதிய ஸ்மார்ட் டிவி ரிமோட்டை எப்படி பயன்படுத்துவது என்று விளக்க முயற்சித்தேன். நான் சொன்னதை கவனிங்க: "சிவப்பு பொத்தானைக் அழுத்து, ஆனால் பெரிய சிவப்பு பொத்தானைக் குழப்பப்படாதே, இடது பக்கத்தில் உள்ள சிறிய சிவப்பு பொத்தானை அழுத்து... இல்லை, அதிந்தான் பதிலாக உன் மற்ற இடது பக்கம்... சமரசமா, இரண்டு விநாடிகள் பிடிக்கக் கவனிக்கவும், ஒன்று அல்ல, மூன்று அல்ல..." இது உனக்கு பரிச்சயமா? 😅 -அதுவே நிரலாக்கம்! இது ஒரு சக்திவாய்ந்தவற்றுக்கு முற்றிலும் விரிவான மற்றுமொரு படி படியாக கொடுக்கும் கலை. நீங்கள் உங்கள் அம்மாவிடம் விளக்குகிறீர்கள் (யார் "எந்த சிவப்பு பொத்தானா?!" என்று கேட்கலாம்), நீங்கள் ஒரு கணினிக்கே விளக்குகிறீர்கள் (எனினும் அது நீங்கள் சொன்னதையே தவறாக இருந்தாலும் அதைச் செய்கிறது). +இதுதான் பிரோகிராமிங்! இது மிகவும் சக்திவாய்ந்த ஒன்றுக்கு மிகவும் விரிவான, படிப்படியாகத் திருப்திப்படுத்தும் அறிவுறுத்தல்களை வழங்கும் கலை. ஆனால் உன் அன்னைக்கு (யார் "யாரது சிவப்பு பொத்தானா?!" என்று கேட்கலாம்) விளக்குவதற்குப் பதிலாக, நீ கணினிக்கு அர்த்தம் கூறுகிறாய் (அது உன் சொன்னதை தான் செய்யும், உன் அர்த்தம் இல்லாவிட்டாலும் கூட). -நான் முதலில் இது கற்றுக்கொண்ட போது என்னை அதிர்ச்சியடைய செய்தது என்னவென்றால்: கணினிகள் அடிப்படையில் மிகவும் எளிமையாக இருக்கின்றன. அவை உண்மையாக இரண்டு விஷயங்களையே புரிந்துகொள்கின்றன – 1 மற்றும் 0, அதாவது "ஆம்" மற்றும் "இல்லை" அல்லது "இயக்கு" மற்றும் "நிறுத்து." அதுவே! ஆனால் அங்கே அது அதிசயம் ஆகிறது – நாம் 1 மற்றும் 0 இல் பேச வேண்டியதில்லை, நாம் The Matrix இல் இருப்பதுபோல் அல்ல. அதற்காக **நிரலாக்க மொழிகள்** உதவுகின்றன. அவை உலகின் சிறந்த மொழிபெயர்ப்பாளர் போல உங்கள் சாதாரண மனித எண்ணங்களை கணினியின் மொழியாக மாற்றுகின்றன. +நான் முதலில் இது கற்றிருக்கும்போது என்னை அதிரவைத்தது என்னவென்றால்: கணினிகள் அடிப்படையில் மிகவும் எளிமையானவை. அவை மூலமாக இரண்டு விஷயங்களை மட்டுமே புரிந்து கொள்கின்றன – 1 மற்றும் 0, அதாவது "ஆம்" மற்றும் "இல்லை" அல்லது "இயக்கு" மற்றும் "நிறுத்து." அதுவே! ஆனால் இங்கே இது மாயமாக்கும் – நம்மிடம் 1களிலும் 0களிலும் பேச்சு சொல்ல தேவையில்லை போல்ஸ் The Matrixலுள்ள போல. அதுவே **பிரோகிராமிங் மொழிகள்** உதவும் காப்புக்காப்பு. அவைகள் எப்படி என்பதை உலகிலேயே சிறந்த மொழிபெயர்ப்பாளர் போல, உன் மனிதரான எண்ணங்களை கணினி மொழியாக மாற்றுகின்றன. -மற்றும் என்னை ஒவ்வொரு காலை விழிக்கும் பின் உண்மையாக அதிர்ச்சி படைக்கும் விஷயம் என்னவென்றால்: உங்கள் வாழ்க்கையின் *எல்லா* டிஜிட்டல் பகுதியும் ஒருவன் இங்கே உங்களைப்போல் இருக்கின்றவர், காபிக் பாட்டிலுடன் பைஜாமாவில் உட்கார்ந்து தனது லேப்டாபில் குறியீடு தட்டச்சு செய்தவர் என்பதிலிருந்து துவங்கியது. உங்களை தோற்றமின்றி காட்டும் அந்த Instagram வடிவமைப்பு? ஒருவன் அதை குறியீடு செய்தார். உங்கள் புதிய பிடித்த பாடலுக்குச் சென்ற பரிந்துரை? ஒருவன் அந்த அல்கோரிதத்தை உருவாக்கினார். நண்பர்களுடன் உணவுப் பில்லுகளைப் பங்கிட உதவும் செயலி? ஆம், ஒருவர் "இதாவே இடையூறு, நான் இதை சரி செய்ய முடியும்" என்று எண்ணினார், பின்னர் அவர்கள் செய்தார்கள்! +இப்போதும் என்னை வார்த்தைகளுக்கு வியப்புக்கு உட்படுத்துகிறது, ஒவ்வொரு காலை எழுந்ததிலும்: உன் வாழ்க்கையின் அனைத்தும் டிஜிட்டல் என்று நினைத்தால், ஒருவன் உங்க போலவே, கம்பளிப்புடை அணிந்து, காபி கிண்ணம் வைத்துக் கொண்டு, தனது லேப்டாப்பில் கோட் தட்டியது. அந்த Instagram ஃபில்டர் உன் தோற்றத்தை அழகாக காட்டும்? அதற்குப் பின்னால் ஒருவன் கோட் எழுதினார். உன் புதிய பிடித்த பாடலை பரிந்துரைத்த ஆல்கொரிதம்? ஒரு டெவலப்பர் அதை உருவாக்கினான். இரவு உணவுக்கு பில்ல்கள் பிரிக்க உதவும் ஆப்? ஆம், ஒருவன் "இது வருத்தமாக இருக்கிறது, நான் இதை சரிசெய்ய முடியும்" என்று நினைத்து, பிறகு செய்துவிட்டான்! -நீங்கள் நிரலாக்கத்தை கற்றுக்கொண்டால், புதிய திறமையை மட்டுமல்ல, இந்த அற்புதமான சிக்கல் தீர்ப்பாளர்களின் சமூகத்தில் கலந்து கொள்கிறீர்கள், அவர்கள் தினமும் "ஒருவர் ஒருசிறியதாக இருக்க உதவும் ஒன்றை நான் கட்டியிருக்கலாமா?" என்று எண்ணுகிறார்கள். உண்மையில், அதன்முதல் மிக வேடிக்கையான விஷயம் எதுவும் இல்லை. +நீ பிரோகிராம் கற்றுக்கொண்டால், நீ ஒரு புதிய திறன் கற்கப்போகிறாய் அல்ல – நீ இந்த அற்புதமான பிரச்சினை தீர்க்கும் சமூகத்தில் சேர்ந்துவிடுகிறாய், எப்படி என்றால் அவர்கள் தினமும் சிந்திக்கின்றனர்: "யாருடைய நாளை சிறிது மேம்படுத்த ஏதேனும் ஒன்றை உருவாக்கலாமா?" உண்மையான விஷயம் என்னவென்றால், அதைவிட ஆர்வமுள்ளதாக உள்ளதா? -✅ **பயனுள்ள தகவல் தேடல்**: உங்கள் இலவச நேரத்தில் ஆராய வேண்டிய ஒரு அற்புதமான விஷயம் – உலகின் முதல் கணினி நிரலாக்கவர் யார் என்று நினைக்கிறீர்கள்? நான் ஒரு குறிப்பு தருகிறேன்: அது நீங்கள் எதிர்பார்க்கும் நபர் அல்லலாம்! அந்த நபர் பின்னணியில் உள்ள கதை மிகவும் சுவாரஸ்யமானது மற்றும் நிரலாக்கம் எப்போதும் படைப்பாற்றல் சிக்கல் தீர்வு மற்றும் அவதானம் தவிர உள்ள தத்துவமாக இருந்தது என்று காட்டுகிறது. +✅ **ரசியான தகவல்**: உனக்கு ஓரளவு நேரம் கிடைத்தால் இதை ஆராய்க்க - உலகின் முதல் கணினி நிரல்பெற்றவர் யார் என நினைக்கிறாய்? நான் உனக்கு ஒரு கூற்று தருகிறேன்: அது நீ எதிர்பார்க்கும் நபர் ஆக இருக்காது! இவரின் கதையின் பின்னணி மிக நற்பெயர், அது நிரல்பெற்றல் என்றால் எல்லாம் சிந்தனையற்ற சிக்கல்களை எளிதாக்குவதற்கான கலை என்றும் காட்டுகிறது. -### 🧠 **தனி நேரம்: நீங்கள் எப்படி உணர்கிறீர்கள்?** +### 🧠 **எப்படி இருக்கிறாய் என்பதை சரிபார்க்கலாம்** -**ஒரு கணம் சிந்தியுங்கள்:** -- "கணினிகளுக்கு உத்தரவுகளை வழங்குவது" என்ற கருத்து உங்களுக்கு இப்போது புரிகிறதா? -- நிரலாக்கத்துடன் எந்த ஒரு தினசரி பணியை தானாகச் செய்வதாக நினைக்கிறீர்கள்? -- இந்த முழு நிரலாக்க விஷயத்துக்கு தொடர்புள்ள உங்கள் மனதில் எழும் கேள்விகள் என்ன? +**ஒரு நிமிடம் எடுத்துக் கொள்ளு:** +- “கணினிகளுக்குத் புகுத்தல் அளிக்கும்” எண்ணம் இப்போது உனக்கு புரிகிறதா? +- நாளாந்த செயல்களை இப்போது பிரோகிராமிங் மூலம் தானாகச் செய்ய விரும்புகிறாயா? +- இந்த முழு பிரோகிராமிங் காரியத்தில் உனக்கு எந்த கேள்விகள் எழுந்துள்ளன? -> **நினைவில் வையுங்கள்**: சில கருத்துக்கள் இப்போது தெளிவாக இல்லாவிட்டாலும் அது இயல்பானது. நிரலாக்கம் ஒரு புதிய மொழியை கற்றுக்கொள்ளுவது போல – உங்கள் மூளை இந்த நரம்பியல் பாதைகளை கட்டமைக்க காலம் எடுக்கும். நீங்கள் அருமையாக செய்து கொண்டிருக்கிறீர்கள்! +> **நினைவில் வைக்கவும்**: சில கருத்துகள் இப்போது குழப்பமடையக் கூடும், அது இயல்பானது. புதிய மொழி கற்றுக்கொள்ளும் போல், உன் மூளை அந்த நியூரல் பாதைகளை அமைக்க நேரம் எடுக்கிறது. நீ நன்றாக செய்கிறாய்! -## நிரலாக்க மொழிகள் பல்வேறு வகையான அற்புத சக்திகள் போல உள்ளன +## பிரோகிராமிங் மொழிகள் என்பது வித்தியாசமான மாயங்களின் வகைகளுக்கு ஒப்பானவை -சரி, இது வித்தியாசமாகக் கேட்கப்பட்டாலும் என்னைத் தொடருங்கள் – நிரலாக்க மொழிகள் பல்வேறு வகையான இசைப்பாணிகளுக்கு மிகவும் ஒத்தவை. நினைத்துப் பார்க்கவும்: ஜாஸ், மென்மையான மற்றும் உடனடி, ராக் சக்திவாய்ந்த மற்றும் நேர்மையாக, கிளாசிக்கல் அழகான மற்றும் கட்டமைக்கபட்ட, ஹிப்-ஹாப் படைப்பாற்றல் மற்றும் வெளிப்பாட்டுள்ள. ஒவ்வொரு பாணிக்கும் தனித்துவம், ஒரு உற்சாகமான ரசிகர் சமூகம் உள்ளது, மற்றும் ஒவ்வொன்றும் வெவ்வேறு மன நிலைகளுக்கும் நிகழ்வுகளுக்கும் உகந்தது. +சரி, இது ஒருவேளை அவ்வளவு சாதாரணமாக இருக்காது, ஆனால் என்னுடன் இரு – பிரோகிராமிங் மொழிகள் வித்தியாசமான இசை வகைகளுக்கு மிகவும் சமமானவை. ஜாஸ் என்றால் மென்மையான, உடனடி இசை; ராக் என்றால் சக்திவாய்ந்த மற்றும் நேரடி; கிளாசிக்கல் என்றால் அழகான மற்றும் கட்டமைக்கப்பட்ட; ஹிப்-ஆப் என்பது படைப்பாற்றல் மிக்க மற்றும் வெளிப்படையானது. ஒவ்வொரு பாணி தனிப்பட்ட அதிர்வெண், அதனுடைய ஆர்வமுள்ள ரசிகர்கள், மற்றும் அவை வேறு-வேறு மனநிலைகள் மற்றும் நிகழ்ச்சிகளுக்கு சிறப்பாக பொருந்தும். -நிரலாக்க மொழிகளும் அதே மாதிரியாய் செயல்படுகின்றன! நீங்கள் ஒரு மகிழ்ச்சியான மொபைல் கேம் கட்டக்க இசை மொழியை அதே மொழியில் பயன்படுத்த மாட்டீர்கள் எனவே நீங்கள் பருவமழை தரவுகளை கையாள கீழ்த்தரம் இதழ்களை பயன்படுத்த மாட்டீர்கள், தலைசிறந்த யோகா வகுப்பில் டெத் மெட்டல் இசை பயன்படுத்த மாட்டீர்கள் (அதுவும், பெரும்பாலும்! 😄). +பிரோகிராமிங் மொழிகளும் அதுபோல செயல்படுகின்றன! நீ பொழுதுபோக்கு கைப்பேசி விளையாட்டை உருவாக்க JavaScript பாவிப்பதால், பெரிய அளவிலான வானிலை தரவு சுருக்க Python பயன்படுத்துவாய் – அதேபோல், யோகா வகுப்பில் டெத் மெட்டல் இசை அரங்கேற்றமில்லை (அதுவும் பெரும்பாலான யோகா வகுப்புகளில்! 😄). -ஆனால் என்னைக் அச்சமடையவைக்கும் விஷயம் என்னவென்றால்: இந்த மொழிகள் உலகின் மிக பொறுமையான, மூளைசெய்கின்ற மொழிபெயர்க்கும் நண்பர் போல நீங்கள் அருகில் இருப்பவர் போலவே இருக்கின்றன. நீங்கள் உங்கள் இயல்பான மனித மூளைக்கு பொருத்தமான கருத்துக்களை வெளிப்படுத்தலாம், அவர்கள் அதனை கணினிகள் பேசும் 1 மற்றும் 0 என்ற மொழியாக மாற்றும் மிகப் பெரிய சிக்கலை கையாள்வார்கள். இது உங்கள் "மனித படைப்பு" மற்றும் "கணினி தர்க்கம்" ஆகிய இரண்டிற்குமான மிகத் தமிழ்நாடு நண்பர் போலவே இருக்கிறது – அவர்கள் ஒருபோதும் சோர்வு அடைய மாட்டார்கள், காப்பி விருந்து தேவையில்லை, மற்றும் ஒன்றை இருமுறை கேட்டுக்கொண்டால் தீர்மானிக்க மாட்டார்கள்! +ஆனால் என்னை ஆச்சரியப்படுத்துவது என்னவெனில்: இந்த மொழிகள் உலகிலேயே மிகவும் பொறுமையான மற்றும் ஆகாய மொழிபெயர்ப்பாளர்கள் போல உனக்கு அருகில் இருப்பார்கள். உன் எண்ணங்களை மனித மூளைக்கு இயலாமல் மாதிரி வெளிப்படுத்திக் கொள்ளலாம், அவர்கள் அதை 1களிலும் 0களிலும் மாற்றி கணினிகள் புரிந்துகொள்ளும் மொழி சாத்தியமாக்கும். இது போலி நண்பர் இருக்கிறான், ”மனித படைப்பாற்றல்” மற்றும் ”கணினி காரியக்கட்டளை” ரீதியாக மிக சரியான மொழிபெயர்ப்பாளர் – அவன் எப்போதும் சோரவில்லை, காபி இடைவேளைகள் எடுத்துக் கொள்ளவில்லை, ஒரே கேள்வியை இருமுறை கேட்கும் போது எப்போதும் உன்னை மதிப்பில்லை! -### பிரபலமான நிரலாக்க மொழிகள் மற்றும் அவற்றின் பயன்பாடுகள் +### பிரபலமான பிரோகிராமிங் மொழிகள் மற்றும் அவற்றின் பயன்பாடுகள் ```mermaid mindmap root((Programming Languages)) - வலை அபிவிருத்தி + Web Development JavaScript - முன்னணி மாயாஜாலம் - ஈடுபடக்கூடிய வலைத்தளங்கள் + முன்‌வட்ட மோஜிக் + இடையுறவு வலைத்தளங்கள் TypeScript JavaScript + வகைகள் - நிறுவன செயலிகள் - தரவு மற்றும் செயற்கை நுண்ணறிவு + நிறுவன பயன்பாடுகள் + Data & AI Python தரவு அறிவியல் - மெஷின் லெர்னிங் + இயந்திர கல்வி தானியங்கி R புள்ளியியல் ஆராய்ச்சி - மொபைல் செயலிகள் + Mobile Apps Java ஆண்ட்ராய்டு - நிறுவனம் + நிறுவனர் Swift iOS - ஆப்பிள் சூழல் + ஆப்பிள் சுற்றுச்சூழல் Kotlin நவீன ஆண்ட்ராய்டு - குறுக்குவழியின் - கணினி அமைப்புகள் மற்றும் செயல்திறன் + குறுக்கு-மேடையகம் + Systems & Performance C++ விளையாட்டுகள் - செயல்திறன் முக்கியமானது + செயல்திறன் அவசியம் Rust - நினைவு பாதுகாப்பு - கணினி நிரலாக்கம் + நினைவக பாதுகாப்பு + அமைப்பு நிரலாக்கம் Go மேக சேவைகள் - பராமரிக்கப்பட்ட பின்னணி + அளவுரு பின்னணி ``` -| மொழி | சிறந்தது | ஏன் பிரசித்தி? | +| மொழி | சிறந்தவை | ஏன் பிரபலமா? | |----------|----------|------------------| -| **JavaScript** | வலை மேம்பாடு, பயனர் இடைமுகங்கள் | உலாவிகளில் இயங்குகிறது மற்றும் இடைமுக வலைத்தளங்களை இயக்குகிறது | -| **Python** | தரவு அறிவியல், தானாக செயல், செயற்கை நுண்ணறிவு | படிக்க மற்றும் கற்றுக்க எளிதானது, சக்திவாய்ந்த நூலகங்கள் | -| **Java** | நிறுவன பயன்பாடுகள், Android செயலிகள் | தளமற்றது, பெரிய அமைப்புகளுக்கு வலுவானது | -| **C#** | Windows பயன்பாடுகள், கேம் மேம்பாடு | Microsoft இன் வலுவான சூழல் ஆதரவு | -| **Go** | மேக சேவைகள், பின்புற அமைப்புகள் | வேகமான, எளிய, நவீன கணினிக்கு வடிவமைக்கப்பட்டது | +| **JavaScript** | வலை மேம்பாடு, பயனர் இடைமுகங்கள் | உலாவிகளில் இயங்கி, தொடர்புடைய வலைத்தளங்களை இயக்குகிறது | +| **Python** | தரவு அறிவியல், தானாகச் செயல்பாடு, AI | படிப்பதற்கு எளிதானது, சக்திவாய்ந்த நூலகங்கள் | +| **Java** | நிறுவன பயன்பாடுகள், ஆண்ட்ராய್ಡ್ ஆப்கள் | தளம்-தனிப்பட்டது அல்ல, பெரிய அமைப்புகளுக்கு வலுவானது | +| **C#** | விண்டோஸ் பயன்பாடுகள், விளையாட்டு மேம்பாடு | Microsoft சூழல் உறுதிப்படுத்தல் சக்திவாய்ந்தது | +| **Go** | மேக சேவைகள், பின்புற அமைப்புகள் | விரைவு, எளிமையானது, நவீன கணினியில் வடிவமைக்கப்பட்டது | -### உயர் நிலை மற்றும் கீழ் நிலை மொழிகள் +### உயர் நிலை மற்றும் குறைந்த நிலை மொழிகள் -சரி, இது உண்மையில் நான் ஆரம்பத்தில் நேற்று நாளையேன் இடித்தேன் கருத்து, எனவே நான் விளக்கம் தருகிறேன் – இது எனக்குப் புரியச் செய்தது, உங்களுக்கும் உதவும் என்று நம்புகிறேன்! +சரி, இது உண்மையில் என்னுடைய மூளை முற்றிலும் உடைத்த கருத்து, நான் முதலில் கற்றுக் கொண்ட போது, எனவே இதை விளக்கும் ஒப்புமை என்னை மிகவும் புரிந்து வைக்க வைத்தது – இது உனக்கும் உதவும் என்று நம்புகிறேன்! -நீங்கள் அந்நாட்டுக்கு பயணம் செய்யலாம், அங்கு நீங்கள் மொழி பேசமாட்டீர்கள் மற்றும் அருகிலுள்ள கழிப்பறையை கண்டுபிடிக்க விரும்புகிறீர்கள் (நாம் எல்லோரும் இருந்தோம், சரியா? 😅): +நீ சமூகத்தில் வருகை தந்தாய் என்று நினைத்து, அங்குள்ள மொழியை பேச தெரியாது மற்றும் அருகிலுள்ள கழுவறையை கண்டுபிடிக்க அவசியமுடையாய் (நான், நீ, நமக்கு இது தெரியும், இல்லையா? 😅): -- **கீழ் நிலை நிரலாக்கம்** என்பது அந்த நாட்டின் அப்பாவின் பழமையான வர்ணனைக்காரம் போல் இருக்கிறது, நீங்கள் பழக்கவழக்கங்களை, உள்ளூர் இன அழைப்புக்களை மற்றும் உள்ளூர் நகைச்சுவைகளைப் பயன்படுத்தி பழைய பழமையான பழமையான மகள் பேசுகிறீர்கள். மிகவும் பாதிக்கக்கூடியதும் மிகச் சிறந்ததும்... ஆனால் நீங்கள் சொந்தமாய் பேசும் போது மட்டுமே! ஆனால் நீங்கள் வெறும் கழிப்பறையை தேடினால் அது சிரமம் அளிக்கும். +- **குறைந்த நிலை programming** என்பது அந்த நாட்டின் பாட்டி விளைவிய பழக்கவழக்கங்களையும் உள்ளே உள்ள நகைச்சுவைகளையும், உள்ளூர் சொற்களை பயன்படுத்தி பழுப்பு பழக்கவழக்கமாக உரையாடியபோல. இது மிக்க திறமையானதும் மிகச்செயல்திறன் வாய்ந்ததும்... ஆனால் நீ அங்கு பழக்கம் இல்லாவிடில் இது சிரமமாய் இருக்கும்! கழுவறை தேடும் போது மிகவும் கடினம். -- **உயர் நிலை நிரலாக்கம்** என்பது அற்புதமான உள்ளூர் நண்பர் போல ஆக்கம் – நீங்கள் "எனக்கு கழிப்பறை மிகவும் தேவை" என்று சீரான ஆங்கிலத்தில் சொல்லுங்கள், அவர்கள் அனைத்து கலாச்சார மொழிபெயர்ப்பையும் செய்து, உங்கள் அங்கீகாரம் இல்லாத மூளைக்கே பொருந்தும் வழிகளை வழங்குவர். +- **உயர் நிலை programming** என்பது அந்த அற்புதமான உள்ளூர் நண்பர் போல, நீ “நான் கழுவறை தேவை” என்று ஆங்கிலத்தில் சொன்னால், அவர் நீக்கத்தை மொழிபெயர்த்து, உனக்கு விளங்கும் முறையில் வழிகாட்டுவார். -நிரலாக்க பின்னணியில்: -- **கீழ் நிலை மொழிகள்** (Assembly அல்லது C போன்ற) கணினியின் இயந்திரத்துடன் மிக விரிவான உரையாடலை அனுமதிக்கின்றன, ஆனால் நீங்கள் இயந்திரம் போல் நினைக்க வேண்டும், அது பெரிய அறிவியல் மாற்றம்! -- **உயர் நிலை மொழிகள்** (JavaScript, Python, அல்லது C# போன்ற) நீங்கள் மனிதராக நினைக்கவும் அனுமதிக்கின்றன, அவர்கள் பின்னணியில் இயந்திரம் பேச கூடிய பணியை நிர்வகிக்கின்றனர். மேலும், அவர்கள் உங்கள் நிலையை நினைவில் வைக்கும் அற்புதமான சமூகங்களைக் கொண்டிருக்கின்றனர் மற்றும் உண்மையிலேயே உதவ விரும்புகிறவர்கள்! +பிரோகிராமிங் வழக்கில்: +- **குறைந்த நிலை மொழிகள்** (Assembly அல்லது C போன்றவை) உனக்கு கம்ப்யூட்டர் ஹார்ட்வேர் உடனான மிகவும் விரிவான உரையாடல்களை அனுமதிக்கின்றன, ஆனால் அது இயந்திரத்தைத்தே மாதிரி சிந்திக்க வேண்டும், அது... மனதில் பெரிய மாற்றம்! +- **உயர் நிலை மொழிகள்** (JavaScript, Python, C# போன்றவை) நீ ஒரு மனிதர் போல சிந்திக்கலாம், அவர்கள் பின்னணியில் இயந்திர மொழியை கவனிப்பார்கள். கூடுதலாக, இவை புதியவர்களாக இருந்த காலத்தை நினைத்துக் கொண்டு உதவ தயாரான மக்களையும் கொண்டிருக்கின்றனர்! -நான் உங்களுக்கு எந்த மொழிகளைத் தொடங்கச் சொல்வேன் என்று கணிக்கிறீர்களா? 😉 உயர் நிலை மொழிகள் பயிற்சி சக்கரங்கள் போன்றவை, அவற்றை நீக்க விரும்பாதீர்கள், ஏனெனில் அவைகள் முழு அனுபவத்தை மிக விரும்பத்தக்கவுமாக்கும்! +எதைத் தொடங்க நான் உனக்கு பரிந்துரைக்கிறேன் என்றால்? 😉 உயர் நிலை மொழிகள் பழுதுபார்க்காமல், பயணத்தைக் கூடுதல் சந்தோஷமாக உருவாக்கும் வைத்து பயிற்சி வுக்குக் காட்டுகிற குதிரைகள் போல! ```mermaid flowchart TB - A["👤 மனித எண்ணம்:
'நான் பிபோனாச்சி எண்களை கணக்கிட விரும்புகிறேன்'"] --> B{மொழி நிலையை தேர்ந்தெடு} + A["👤 மனித சிந்தனை:
'நான் பைபோனாச்சி எண்ணுகளை கணக்கிட விரும்புகிறேன்'"] --> B{மொழி நிலை தேர்வு செய்க} - B -->|அதிக நிலை| C["🌟 ஜாவாஸ்கிரிப்ட்/பைத்தான்
வாசிக்கவும் எழுதவும் எளிது"] - B -->|குறைந்த நிலை| D["⚙️ அசெம்ப்லி/சி
நேரடி ஹார்ட்வேர்க் கட்டுப்பாடு"] + B -->|உயர் நிலை| C["🌟 ஜாவா ஸ்கிரிப்ட்/பைதான்
படிக்கவும் எழுதவும் எளிது"] + B -->|கீழ் நிலை| D["⚙️ அசெம்ப்ளி/சி
நேரடி ஹார்ட்வேர் கட்டுப்பாடு"] C --> E["📝 எழுதுக: fibonacci(10)"] D --> F["📝 எழுதுக: mov r0,#00
sub r0,r0,#01"] - E --> G["🤖 கணினி புரிதல்:
மொழி மாற்றி சிக்கல்களை கையாள்கிறது"] + E --> G["🤖 கணினி புரிதல்:
மொழிபெயர்ப்பாளர் சிக்கல்களை நிர்வகிக்கிறது"] F --> G - G --> H["💻 ஒரே முடிவு:
0, 1, 1, 2, 3, 5, 8, 13..."] + G --> H["💻 அதே முடிவு:
0, 1, 1, 2, 3, 5, 8, 13..."] style C fill:#e1f5fe style D fill:#fff3e0 style H fill:#e8f5e8 ``` -### நான் உங்களுக்கு உயர் நிலை மொழிகள் ஏன் மிகவும் நண்பர்களாக இருக்கின்றன என்று காட்டுகிறேன் +### நான் உனக்கு ஏன் உயர் நிலை மொழிகள் ஃபிரெண்ட்லி என்பதை காட்ட விரும்புகிறேன் -சரி, நான் இனிமேல் உங்களுக்கு இருக்கக்கூடியதை காட்டப்போகிறேன், அது நான் உயர் நிலை மொழிகளுடன் காதலித்து விட்டதற்கான காரணத்தை சரியாக விளக்குகிறது, ஆனால் முதலில் – நீங்கள் எனக்கு ஏதாவது வாக்குறுதி கொடுக்க வேண்டும். அந்த முதல் குறியீட்டு எடுத்துக்காட்டை பார்த்தபோது பயப்படாதீர்கள்! அது பயங்கரமாக தோன்ற வேண்டுமானால் நல்லது. அதுவே நான் குறிப்பிடும் புள்ளி! +சரி, நான் உனக்கு ஒரு நுணுக்கத்தை చూపப்போகிறேன், அது என்னிக்கு உயர் நிலை மொழிகளை காதலிக்க வைத்தது, ஆனால் முன்னர் உனக்கு ஓர் வோய்ப்பாக கோடீடு பார்க்கும் போது பதறவிட்டு விடாதே என்று உறுதியளிக்கவேண்டும். அது குறும்படமா தெரி க்க ஒதுக்கம் – நான் அதைச் சொல்ல விருப்பது அதுவே! -நாம் இரண்டு முற்றிலும் தனித்துவமான பாணிகளில் எழுதப்பட்ட ஒரே வேலை பார்க்க போகிறோம். இரண்டும் Fibonacci தொடர் என்று அழைக்கப்படுகின்றது – இது ஒரு அழகான கணித முறைமையாகும், இதில் ஒவ்வொரு எண், அதன் முன் இரண்டு எண்களின் கூட்டுத்தொகை: 0, 1, 1, 2, 3, 5, 8, 13... (வேடிக்கை விஷயம்: இந்த முறைமை இயற்கையில் எங்கும் உள்ளது – சூரியபூ வற்றின் விதைகள் சுழற்சி, ரேம்பிளிக் வடிவங்கள், பிரபஞ்ச உருவாக்கம்!) +நாம் ஒரே பணி எழுதப்படும் இரண்டு முறையும் பார்க்கப்போகிறோம். இரண்டு முறையும் \Fibonacci வரிசையை உருவாக்கும் – இது ஒரு அழகான கணித முறை, ஒவ்வொரு எண் கடந்த இரண்டு எண்களின் கூட்டுதான்: 0, 1, 1, 2, 3, 5, 8, 13... (சிறந்த விஷயம்: இந்த முறை இயற்கையிலேயே எதுவும்! சூரியகாந்தி விதைகள் சுழற்சிகள், பைன்கோன் வடிவங்கள், விண்மீன் கூட்டம் உருவாக்கும் வழி!) -வேறுபாட்டைப் பார்க்க தயாரா? வாருங்கள்! +வெறுமனே விலை பார்க்க தயாரா? போ! -**உயர் நிலை மொழி (JavaScript) – மனித நண்பர்:** +**உயர் நிலை மொழி (JavaScript) – மனிதர் நட்பு:** ```javascript -// படி 1: அடிப்படையான பைபொனாச்சி அமைப்பு +// படி 1: அடிப்படை ஃபிபொனாச்சி அமைப்பு const fibonacciCount = 10; let current = 0; let next = 1; @@ -183,29 +182,29 @@ let next = 1; console.log('Fibonacci sequence:'); ``` -**இந்த குறியீடு என்ன செய்கிறது:** -- **காற்காணொளி** எத்தனை Fibonacci எண்கள் உருவாக்க விரும்புகிறோம் என்பதை குறிப்பிட ஒரு நிலையானைக் குறிப்பிடுங்கள் -- **இரட்டை மாறிலிகளை தொடங்குங்கள்** தொடர் உள்ள தற்போதைய மற்றும் அடுத்த எண்களை கண்காணிக்க -- **துவக்க மதிப்புகளை அமைக்கவும்** (0 மற்றும் 1) Fibonacci முறைமை வரையறுக்க -- **வெளியீடு தலைப்பை காட்சிப்படுத்தவும்** +**இந்த கோடு என்ன செய்கிறது:** +- **ஒரு நிரந்தரத்தை அறிவிக்கிறது** எத்தனை Fibonacci எண்கள் உருவாக்கவேண்டும் என்று குறிப்பிட +- **இரு மாறிலிகளை தொடங்குகிறது** வரிசை இல் தற்போதைய மற்றும் அடுத்த எண்களை கண்காணிக்க +- **தொடக்க மதிப்புகளை அமைக்கிறது** (0 மற்றும் 1) Fibonacci முறை குறிக்க +- **தலைப்பு செய்தியைப் பதிவு செய்கிறது** எங்களின் வெளியீட்டை துல்லியமாக காட்ட ```javascript -// படி 2: ஒரு வட்டத்தில் தொடரை உருவாக்கு +// படி 2: ஒரு வளைவுடன் தொடர் உருவாக்கவும் for (let i = 0; i < fibonacciCount; i++) { console.log(`Position ${i + 1}: ${current}`); - // தொடரில் அடுத்த எண்ணை கணக்கிடு + // தொடரில் அடுத்த எண்ணை கணக்கிடுக const sum = current + next; current = next; next = sum; } ``` -**இதில் என்ன நடக்கிறது:** -- **ஒவ்வொரு இடத்திலும்** `for` லூப் பயன்படுத்தி திரும்பிச் செல்லவும் -- **எல்லா எண்களையும் அவர்களின் இடம் மற்றும் வடிவமைப்புடன் காட்சியிடவும்** -- **அடுத்த Fibonacci எண்ணை** தற்போதைய மற்றும் அடுத்த மதிப்புகளை சேர்த்து கணக்கிடவும் -- **மாறிலிகளை புதுப்பித்து** அடுத்த சுற்றுக்கு செல்லவும் +**இங்கு நடந்ததை உடைத்துப்போம்:** +- **ஒரு for வட்டாரத்தில் லூப்** செய்கிறது வரிசையின் ஒவ்வொரு இடத்திலும் +- **ஒவ்வொரு எண்ணையும் அதன் இடத்துடன்** மாதிரிமொழி வடிவத்தில் காட்டுகிறது +- **அடுத்த Fibonacci எண்ணைக் கணக்கிடுதல்** தற்போதைய மற்றும் அடுத்த மதிப்புகளை கூட்டியது +- **எங்கள் கண்காணிப்பு மாறிலிகளை புதுப்பித்தல்** அடுத்த சுற்றுக்கு நகர ```javascript // படி 3: நவீன செயல்பாட்டு அணுகுமுறை @@ -224,13 +223,13 @@ const fibSequence = generateFibonacci(10); console.log(fibSequence); ``` -**மேலே நாம்:** -- **நவீன அம்பு செயல்பாட்டு மொழிச் சின்னத்துடன்** மறுபயன்படுத்தக்கூடிய செயல்பாட்டை உருவாக்கினோம் -- **ஒரு வரிசையை உருவாக்கி** முழு தொடரைப் பதித்ததற்கு பதிலாக சேமிக்கிறோம் -- **வரிசை அட்டவணையை பயன்படுத்தி** புதிய எண்ணை கடந்த மதிப்புகளிலிருந்து கணக்கிடுகிறோம் -- **முழு தொடரை திரும்ப வழங்குகிறோம்** எங்கள் நிரலின் பிற பகுதிகளில் போன்றதாக சக்திவாய்ந்த பயன்பாட்டிற்கு +**மேலே, நாம்:** +- **ஆக்ஷன் செயல் எழுத்து (arrow function) பயன்படுத்தி** மீண்டும் பயன்படுத்தக்கூடிய ஒரு செயல்பாட்டைப் படைத்தோம் +- **ஒரு வரிசையை கட்டமைத்தோம்** முழு வரிசையை சேமிக்க ஒவ்வொன்றும் காட்டாமல் +- **வரிசை இட குறிச்சியை பயன்படுத்தி** முன்னொரு மதிப்புகளிலிருந்து ஒவ்வொரு புதிய எண்ணையும் கணக்கிட்டோம் +- **முழு வரிசையை திரும்ப வழங்கினோம்** மற்ற பகுதிகளில் உபயோகிக்க பாவனையளவில் -**கீழ் நிலை மொழி (ARM Assembly) – கணினி நண்பர்:** +**குறைந்த நிலை மொழி (ARM Assembly) – கணினி நட்பு:** ```assembly area ascen,code,readonly @@ -257,128 +256,127 @@ back add r0,r1 end ``` -JavaScript பதிப்பு ஆங்கிலவாதங்களைப் போல வாசிக்கின்றது, ஆனால் Assembly பதிப்பு இரகசிய கட்டளைகளை பயன்படுத்தி கணினி செயலி நேரடியாகக் கட்டுப்படுத்துகிறது. இரண்டும் ஒன்றே வேலை செய்கின்றன, ஆனால் உயர் நிலை மொழி மனிதர்களால் புரிந்து, எழுதவும் பராமரிக்கவும் எளிதாக உள்ளது. +JavaScript பதிப்பு ஆங்கிலக் கட்டளைகளாக வாசிக்கப்படுவது போல் இருக்கிறது, Assembly பதிப்பு கூர்மையான கட்டளைகளைக் கொண்டுள்ளது, நேரடியாக கணினி கம்ப்யூட்டர் செயல்பாட்டைக் கட்டுப்படுத்துகிறது. இரண்டு பதிப்பும் ஒரே பணியைச் செய்து முடிக்கின்றன, ஆனால் உயர் நிலை மொழி மனிதர்களுக்கு புரிந்து கொள்ளவும், எழுதவும், பராமரிக்கவும் எளிதானது. -**உங்களுக்குத் தெரியும் முக்கிய வித்தியாசங்கள்:** -- **வாசனை திறன்**: JavaScript `fibonacciCount` போன்ற விவரமான பெயர்களை பயன்படுத்துகிறது, Assembly `r0`, `r1` போன்ற இரகசிய குறிச்சொற்களை பயன்படுத்துகிறது -- **கருத்துக்கள்**: உயர் நிலை மொழிகள் குறியீட்டை தானாகவே ஆவணப்படுத்தும் விளக்கக் கருத்துக்களை ஊக்குவிக்கின்றன -- **மைப்பு**: ஜாவாஸ்கிரிப்டின் தர்க்கப் பாய்மாறு பிரச்சினைகளை மனிதர்கள் படி படியாக சிந்திப்பதுபோல் உள்ளது -- **பராமரிப்பு**: வெவ்வேறு தேவைகளுக்கு ஜாவாஸ்கிரிப்ட் பதிப்பை புதுப்பிப்பது தெளிவாகவும் எளிதாகவும் இருக்கும் +**நீ கவனம் செலுத்த வேண்டிய முக்கிய வேறுபாடுகள்:** +- **ஓத்துக்குறிப்பாக**: ஜாவாஸ்கிரிப்ட் `fibonacciCount` போன்ற விளக்கமான பெயர்களைப் பயன்படுத்துகிறது, ஆனால் அசெம்பிளி `r0`, `r1` போன்ற கடுமையான லேபிள்களைப் பயன்படுத்துகிறது +- **கருத்துக்கள்**: மேம்பட்ட மொழிகள் குறியீட்டை தானாகவே ஆவணப்படுத்தும் விளக்கமான கருத்துக்களை ஊக்குவிக்கின்றன +- **கட்டமைப்பு**: ஜாவாஸ்கிரிப்டின் தர்க்கமான ஓட்டம் மனிதர்கள் பிரச்சனைகளை படிநிலையில் சிந்திக்கும் முறையைப் பின்பற்றுகின்றது +- **பராமரிப்பு**: வெவ்வேறு தேவைகளுக்காக ஜாவாஸ்கிரிப்ட் பதிப்பை புதுப்பிப்பது நேர்மையானதும் தெளிவானதும் ஆகும் -✅ **பைபோனாச்சி தொடருக்கான விளக்கம்**: இந்த அற்புதமான எண்ணுக்கட்டமைப்பு (ஒவ்வொரு எண் அதற்கு முன்னோரும் முந்தையதும் கூட்டுத்தொகை: 0, 1, 1, 2, 3, 5, 8...) இயற்கையில் உண்மையாக *எங்கும்* காணப்படும்! நாங்கள் இதைப்பார்க்கலாம் வெண்டைப்பூவின் சுழற்சிகளிலும், பைன்கோன் வடிவங்களிலும், நௌடிலஸ் சிப்புகளின் வளைவிலும், மர கிளைகளின் வளர்ச்சியிலும். இயற்கையின் அழகுமிக்க வடிவமைப்புகளை கணிதமும் குறியீட்டும் எவ்வாறு எங்கள் எண்ணைக்குள் கொண்டு சேர்த்து மீண்டும் உருவாக்குகின்றன என்பது பெரிதே வியக்கத்தக்கது! +✅ **பிபோனாச்சி தொடர் பற்றி**: இந்த அற்புதமான எண்கள் உட்படிவம் (ஒவ்வொரு எண் அதற்கு முன் இரண்டும் கூட்டுத்தொகைக்கு சமம்: 0, 1, 1, 2, 3, 5, 8...) இயற்கையில் உண்மையில் *எங்கும்* காணப்படுகிறது! நீங்கள் இதை சூரியகாந்தி சுழற்சிகளில், சவென்கிளியின் தட்டுத்தளங்களில், நாட்டிலஸ் சிப்பற்களின் வளைவும், மர கிளைகளின் வளர்ச்சியிலும் காணமுடியும். கணிதமும் குறியீட்டும் இயற்கையின் அழகை உருவாக்க பயன்படுத்தப்படும் கோட்பாடுகளை புரிந்து கொள்ள உதவுவது உண்மையில் அற்புதமானது! +## மாயத்தை உருவாக்கும் கட்டுமானக் கூறுகள் -## மந்திரத்தை உருவாக்கும் கட்டுமானக் கூறுகள் +சரி, இப்போது நீங்கள் செயல்பாட்டில் காணும் நிரலாக்க மொழிகள் எப்படி இருக்கின்றன என்பது தெரிந்துள்ளதால், எழுதிய ஒவ்வொரு நிரலும் கொண்ட அடிப்படைக் கூறுகளை விரிவாகப் பார்ப்போம். இதை உங்கள் பிடித்த சமையல் உணவுக் குறிப்பின் அவசியமான பொருட்களாகக் கருதி, ஒவ்வொரு கூறும் என்ன செய்யும் என்பதைக் கற்றுக் கொண்டால் நீங்கள் ஏதாவது ஒரு மொழியிலோ பதிப்பிக்க முடியும்! -சரி, இப்போது நீங்கள் நிகழ்ச்சியில் காணும் நிரலை பார்த்துவிட்டீர்கள், இப்போது எழுதியுள்ள ஒவ்வொரு நிரலையும் உருவாக்கும் அடிப்படைக் கூறுகளைப் பார்க்கலாம். இதை உங்கள் மிகவும் பிடித்த சமையல் செய்முறையின் அவசியமான பொருட்களாக நினைத்து கொள்ளுங்கள் – ஒவ்வொன்றின் செயலை நீங்கள் புரிந்துகொண்டால், நீங்கள் எவ்வித மொழியிலும் குறியீடு படிக்கவும் எழுதவும் முடியும்! +இது நிரலாக்கத்தின் வாக்கியக்கட்டமைப்பைப் போன்றது. பள்ளியில் பெயர்ச்சொற்கள், செயற்கூறுகள் மற்றும் வாக்கியங்களை எப்படி அமைப்பது என்று கற்றுக்கொண்டதை நினைவாக்குங்கள். நிரலாக்கத்துக்கும் அதற்கான தனி வகை வாக்கியக்கட்டமைப்பு உள்ளது, ஆனாலும் அது ஆங்கில வாக்கியக்கட்டமைப்பைவிட மிகவும் தர்க்கமானதும் பரிபாலனமிக்கதுமாக உள்ளது! 😄 -இது கணினி நிரலைக் கற்றூட்டும் பாகமாகும். பள்ளியில் நீங்கள் பெயர்ச்சொற்கள், செயற்பாடுகள் மற்றும் வாக்கியங்களை எப்படி உருவாக்குவது என்று கற்றது நினைவிலிருக்கிறதா? நிரல் மொழிகளுக்கும் அப்படி தான் ஒரு இலக்கணம் இருக்கும், அது ஆங்கில இலக்கணத்தைவிட எவ்வளவு தர்க்கபூர்வமாகவும் கருணையாகவும் இருக்கும் என்று அறிந்தால் ஆச்சரியமாகும்! 😄 +### வாக்கியங்கள்: படிநிலை படிநிலையில் வழிமுறைகள் -### பட்டியல்கள்: படி படியாக வழிகாட்டுதல்கள் +**வாக்கியங்களுடன்** நாம் தொடங்குவோம் – இவை உங்கள் கணினியுடன் உள்ள உரையாடலில் தனித்தனியாக ஒரு வாக்கியம் போல் இருக்கும். ஒவ்வொரு வாக்கியமும் கணினிக்கு ஒரு குறிப்பிட்ட காரியத்தைச் செய்யச் சொல்கிறது, அது “இங்குக் கைம derecha திருப்பு”, “சிவப்பு விளக்கு அருகே நிறுத்து”, “அந்த இடத்தில் வாகனம் நிறுத்து” என்று வழிமுறைகளை தருவது போல். -**பட்டியல்கள்** - இவை உங்கள் கணினியுடன் உரையாடும் தனிப்பட்ட வாக்கியங்களைப் போல இருக்கின்றன. ஒவ்வொரு பட்டியலும் கணினியிடம் ஒரு குறிப்பிட்ட செயலைச் செய்யச் சொல்வதாகும்; "இங்கே இடப்பக்கம் திரும்பு," "சிகنالுக்கு நிறுத்து," "அந்த இடத்தில் வாகனத்தை நிறுத்து." - -பட்டியல்கள் மிகவும் வாசிக்க எளிதாயிருக்கின்றன என்பது எனக்கு மிகவும் பிடிக்கும். இதைப் பாருங்கள்: +வாக்கியங்களின் வாசிப்புத் திறனை நான் விரும்புவது என்னவென்றால், அவை பெரும்பாலும் எளிதில் புரிந்துகொள்ளக்கூடியவை என்பதே ஆகும். இதைப் பாருங்கள்: ```javascript -// ஒற்றை செயல்களை நிறைவேற்றும் அடிப்படைக் கூற்றுகள் +// ஒற்றை செயல்களைச் செய்யும் அடிப்படைக் கூற்றுகள் const userName = "Alex"; console.log("Hello, world!"); const sum = 5 + 3; ``` - -**இந்தக் கோடுகள் என்ன செய்கின்றன:** -- பயனர் பெயரைச் சேமிக்க ஒரு நிலையான மாறி அறிவிக்கிறது -- கான்சோல் வெளியீட்டில் வரவேற்பு செய்தியை காட்டுகிறது -- ஒரு கணித செயல்பாட்டின் முடிவை கணக்கிடுகிறது மற்றும் சேமிக்கிறது + +**இந்தக் குறியீடு என்ன செய்யிறது:** +- பயனரின் பெயரைச் சேமிக்க ஒரு மாறி (constant) உருவாக்குகிறது +- கன்சோலில் ஒரு வரவேற்பு செய்தியை காட்டுகிறது +- கணித செயல்பாட்டின் முடிவை கணக்கிட்டு சேமிக்கிறது ```javascript -// வலைப்பக்கங்களுடன் தொடர்புகொண்டு செயல்படும் கருத்துக்கள் +// வலைப்பக்கங்களுடன் தொடர்பு கொள்ளும் பிரகடனங்கள் document.title = "My Awesome Website"; document.body.style.backgroundColor = "lightblue"; ``` - -**படிநிலை ஒரு நிலையில், இங்கே என்ன நடக்கிறது:** -- உலாவி டேப் தலைப்பில் தோன்றும் இணையதளத்தின் தலைப்பை மாற்றுகிறது -- முழு பக்கம் பின்னணி நிறத்தை மாற்றுகிறது -### மாறிலிகள்: உங்கள் நிரலின் நினைவகத் தளம் +**அடிக்கடி, இதோ என்ன நடக்கிறது:** +- உலாவி தாவல் பகுதியில் தோன்றும் பக்கத்தைத் தோற்ற தலைப்பு மாற்றுகிறது +- முழு பக்கத்தின் பின்னணி வண்ணத்தை மாற்றுகிறது -சரி, **மாறிலிகள்** எனக்கு மிகவும் பிடித்த கருத்துக்கள்; ஏன் என்றால் அவை நீங்கள் தினமும் பயன்படுத்தும் காரியங்களைப் போன்றவை! +### மாறிகள்: உங்கள் நிரலின் நினைவகம் -உங்கள் தொலைபேசி தொடர்புகளு பட்டியலை நினைத்துக் கொள்ளுங்கள். நீங்கள் எல்லா எண்ணுகளையும் நினைத்திருக்க மாட்டீர்கள் – அதற்கு பதிலாக "அம்மா," "உறவினர்," அல்லது " இரவு 2 மணி வரை பிச் டெலிவரி செய்பவன்" என்றும் சேமித்து, உங்கள் தொலைபேசி அந்த எண்களை நினைத்துக் கொள்கிறது. மாறிலிகள் போல் செயல் செய்கின்றன! அவை உங்கள் நிரலுக்கு தகவல்களை வைத்திருத்து பின்னர் புரிந்து கொண்டு மாற்றுவதற்கு பெயர்கள் கொண்ட கண்டெயினர்கள் போல. +சரி, **மாறிகள்** உண்மையில் நான் பிடிப்பதன் காரணம் அவை நீங்கள் தினமும் பயன்படுத்தும் விஷயங்களுடன் மிகவும் இணக்கமானவை என்பதுதான்! -மாறிலிகள் பரிமாற்றம் அடிக்கடி நடைபெறுகிறது என்று கூர்ந்து கவனிக்கவும் (ஆகையால் "மாறிலி" என்ற பெயர்!). உதாரணமாக, நீங்கள் நல்ல বিজன்யை கண்டுப்பிடித்தால் அது தொடர்பான எண்ணை புதுப்பிப்பது போல, மாறிலிகள் உங்கள் நிரல் அறிவதைப் பொறுத்து அல்லது சூழ்வுகள் மாறும்போது புதுப்பிக்கப்படலாம்! +உங்கள் தொலைபேசி தொலைபேசி எண்ணுக் பட்டியலை நினைவில் கொள்ளுங்கள். எல்லா எண்ணையும் நினைவில் வைக்க மாட்டீர்கள் – பின் நீங்கள் “அம்மா”, “அதிக நண்பர்”, அல்லது “இரவு 2 மணிவரை வழங்கும் பீஸா இடம்” என்று சேமிக்கிறீர்கள், உங்கள் கைபேசி அந்த எண்ணுகளை நினைக்கிறது. மாறிகள் அதேபோல் செய்கின்றன! அவை உங்கள் நிரலில் தரவை ஒரு பொருத்தமான பெயரால் சேமித்து பின்னர் அதை எளிதாக அணுக பயன்படுகின்றன. -அதன் எளிமையான உதாரணத்தை பார்ப்போம்: +இதோ சரியானது என்னவென்றால்: மாறிகள் உங்கள் நிரல் இயங்கும் போது மாறுபடக்கூடியவை (ஆகவே “மாறி” என்று பெயர்!). நீங்கள் புதிதாக கண்டுபிடித்த சில விஷயங்களுக்கு முன்பிருந்த பீஸா இடத்தை மாற்றுவது போல, மாறிகளும் புதுப்பிக்கப்படலாம்! + +இதன் எளிமையைக் காட்டுகிறேன்: ```javascript -// படி 1: அடிப்படை மாறிகளை உருவாக்குதல் +// படி 1: அடிப்படைக் மாறிலிகளை உருவாக்குதல் const siteName = "Weather Dashboard"; let currentWeather = "sunny"; let temperature = 75; let isRaining = false; ``` - -**இந்த கருத்துக்களை புரிந்துகொள்ள:** -- நிலையான மதிப்புகளை `const` மாறிலிகளில் சேமிக்க (உதா: தளத்தின் பெயர்) -- நிரல் முழுவதும் மாறக்கூடிய மதிப்புகளுக்கு `let` பயன்படுத்த -- வெவ்வேறு தரவுத் தொகைகளை ஒதுக்கிட: எழுத்துக்கள் (text), எண்கள், மற்றும் பூல்கள் (true/false) -- ஒவ்வொரு மாறிலியும் என்ன வெள்ளையை உள்ளடக்கியுள்ளதாக விளக்கும் பொருத்தமான பெயர்களைத் தேர்ந்தெடுக்க + +**இந்தக் குறிப்புகளைப் புரிந்து கொள்ள:** +- `const` மாறிகளில் மாறாத மதிப்புக்களை சேமி (பக்க தகவல் போன்றவை) +- நிரலின் இயங்கும் போது மாறக்கூடிய மதிப்புகளுக்கு `let` பயன்படுத்து +- வெவ்வேறு தரவுத் தரவுப் பிரிவுகளை ஒதுக்கு: வெரைப் (உரை), எண்கள், உண்மை/பொய் (Boolean) +- ஒவ்வொரு மாறியும் என்ன கொண்டிருப்பதென்பதை விளக்கும் விளக்கமான பெயர்களைத் தேர்ந்தெடு ```javascript -// படி 2: தொடர்புடைய தரவை குழுவாக்க பொருட்களுடன் பணியாற்றுதல் +// படி 2: தொடர்புடைய தரவுகளை குழுவாக ஒருங்கிணைக்க பொருட்களுடன் வேலை செய்யுதல் const weatherData = { location: "San Francisco", humidity: 65, windSpeed: 12 }; ``` - -**மேலே, நாம்:** -- பயனுள்ள வானிலை தகவல்களை ஒன்றிணைக்க ஒரு பொருளை உருவாக்கினோம் -- பல தரவுகளைக் கொண்ட ஒரு மாறியிலுள்ள தொகை உருவாக்கினோம் -- ஒவ்வொரு தகவலையும் தெளிவாக குறியிடுவதற்காக முக்கியம்-மதிப்புத் தகவல்களைப் பயன்படுத்தினோம் + +**மேலே, நாம்:** +- தொடர்புடைய வானிலைத் தகவல் ஒன்றை ஒழுங்குபடுத்த ஒரு பொருளை உருவாக்கியுள்ளோம் +- பல தரவுகளை ஒரே மாறி பெயரின் கீழ் ஒழுங்குபடுத்தியுள்ளோம் +- ஒவ்வொரு தரவும் தெளிவாக அடையாளப்படுத்தக் கூடிய முக்கிய-மதிப்பு ஜோடிகள் பயன்படுத்தியுள்ளோம் ```javascript -// படி 3: மாறிகளைக் பயன்படுத்துதல் மற்றும் புதுப்பித்தல் +// படி 3: மாறிலிகளை பயன்படுத்துதல் மற்றும் புதுப்பித்தல் console.log(`${siteName}: Today is ${currentWeather} and ${temperature}°F`); console.log(`Wind speed: ${weatherData.windSpeed} mph`); -// மாறக்கூடிய மாறிகளை புதுப்பித்தல் +// மாற்றக்கூடிய மாறிலிகளை புதுப்பித்தல் currentWeather = "cloudy"; temperature = 68; ``` - -**ஒவ்வொரு பகுதிக்கும் புரிதல்:** -- `${}` இலக்கணத்துடன் உள்ளடக்கி வடிவகுெல்வைச் பயன்படுத்தி தகவல்களை வெளிப்படுத்த -- பொருள் பண்புகளை புள்ளி குறியீட்டினால் அணுகு (`weatherData.windSpeed`) -- `let` வழங்கிய மாறிகளை மாறும் சூழ்நிலைக்கு ஏற்ப புதுப்பிக்க -- பல மாறிகளைக் கூடி பொருளான செய்திகளை உருவாக்க + +**ஒவ்வொரு பகுதியையும் புரிந்து கொள்வோம்:** +- `${}` வடிவமைப்போடு கூடிய வார்ப்புரு வரிகளைக் கொண்டு தகவலைத் திரையில் காண்பி +- பொருள் பண்புகளை புள்ளி குறியீட்டுடன் அணுகு (`weatherData.windSpeed`) +- மாறக்கூடிய நிலைகளை பிரதிபலிக்க `let` மூலம் அறிவிக்கப்பட்ட மாறிகளை புதுப்பி +- பல மாறிகளை இணைத்து பொருள் புரிவான தகவல்களை உருவாக்கு ```javascript -// படி 4: சுத்தமான குறியீட்டிற்கு நவீன உருவகப்படியான தனி பகுப்பறிதல் +// படி 4: சுத்தமான குறியீட்டிற்கான நவீன அழிப்பு const { location, humidity } = weatherData; console.log(`${location} humidity: ${humidity}%`); ``` - -**புரிந்துகொள்ள வேண்டியது:** -- தரவுகள் உட்படுதல் பயன்படுத்தி குறிப்பிட்ட உபவகுப்புகளை தனித்தெடுக்க -- பொருள் முக்கிய அமைப்புகளோடு புதிய மாறுகளை தன்னங்கி செய் -- தொடர்ச்சியான புள்ளி குறியீட்டை தவிர்த்து குறியீடை எளியமாக்கு -### கட்டுப்பாட்டு ஓட்டம்: உங்கள் நிரலை சிந்திக்க கற்பிக்க +**நீங்கள் அறிந்திருக்க வேண்டியது:** +- விஷயங்களை விநியோகிக்க (destructuring assignment) வைத்து குறிப்பிட்ட பண்புகளை எடுத்துக்கொள் +- பொருள் விசைகளின் பெயர்களுடன் புதிய மாறிகளை தானாக உருவாக்கு +- புள்ளி குறியீட்டை மீண்டும் மீண்டும் பயன்படுத்தாமலும் குறியீட்டை எளிமையாக்கு + +### கட்டுப்பாட்டு ஓட்டம்: உங்கள் நிரலை சிந்திக்க கற்றுவி -சரி, இங்கே நிரல் மிகப் பரபரப்பும் ஆச்சரியத்துடனும் வந்துவிடுகிறது! **கட்டுப்பாட்டு ஓட்டம்** என்பது உங்கள் நிரல் எப்படி ஞானமிக்க முடிவுகளை எடுக்கும் என்பதை கற்பிக்கும் செயல், நீங்கள் தினமும் சிந்திக்காமல் செய்வதைப் போல. +சரி, இங்கு நிரலாக்கம் மெய்ப்பற்றி அற்புதமாகிறது! **கட்டுப்பாட்டு ஓட்டம்** என்பது உங்கள் நிரல் நுண்ணறிவு முடிவுகளை எடுக்க எப்படி கற்றுக்கொள்ளும் என்பதே ஆகும், நீங்கள் தினமும் எண்ணாமலேயே செய்யும் அதேபோல. -சொல்லுங்கள், இன்று காலை நீங்கள் "மழை பெய்கிறால் குடை எடுத்துக்குவேன். குளிரானால் ஜாக்கெட் அணிவேன். தாமதமாக இருந்தால் காலை உணவை தவிர்த்து காபி எடுப்பேன்" என்ற வரிசையில் தான் நடந்திருக்க வேண்டும். உங்கள் மூளை இதுபோன்று ஐப்போதும் பல தடவைகள் if-then நியமத்தை பின்பற்றுகிறது! +செல்லும்போது நீங்கள் இதைச் செய்யலாம் என்று நினைத்துக் கொள்ளுங்கள்: “மழை பெய்தால் குடை எடுத்துச் செல்கிறேன், குளிராக இருந்தால் ஜாக்கெட்டை அணிவேன், தாமதமாக இருந்தால் காலை உணவு போதாது, வழி நடத்தும் எடுத்து காபி குடிப்பேன்.” உங்கள் மூளை இயற்கையாகவே இது போன்ற `if`-`then` தர்க்கத்தைக் தொடர்கிறது! -இதுவே நிரல்களை அறிவொளி பலமாகவும் உயிருடன் இருப்பதாக உணர முடியத்தக்க வகையில் மாற்றுகிறது. அவர்கள் பாதுகாப்பாக ஒரு சூழ்நிலையைப் பார்வையிட முடிவெடுத்து சரியான முறையில் பதிலளிக்க முடியும். உங்கள் நிரலுக்கு ஒருதரம் சிந்திப்பதற்கும் தேர்வெடுக்கத் தகும் மூளை கொடுப்பது போல! +இது நிரல்களை அறிவாற்றல் கொண்டவை மற்றும் உயிருள்ளவையாக உணரச் செய்கிறது, சாதாரண, சிலமான ஸ்கிரிப்ட் பின்பற்றுவதில்லை. அவை நிலையைப் பார்வையிட்டு மதிப்பாய்வு செய்து சரியான முறையில் பதிலளிக்கிறது. இது உங்கள் நிரலுக்கு ஏற்பாடுகளை செய்து முடிவெடுக்கும் மூளை அளிக்கும் காட்சியாகும்! -ஏன் இவ்விதமாக வேலை செய்கிறது என்பதை காண செயற்கையாக செய்யட்டும்: +எவ்வாறு நன்றாக செயல்படுகிறது என பார்க்க விரும்புகிறீரா? இதோ எனது உதாரணம்: ```javascript -// படி 1: அடிப்படையான நிலைத்திறன் லாஜிக் +// படி 1: அடிப்படை நிபந்தனை தர்க்கம் const userAge = 17; if (userAge >= 18) { @@ -388,15 +386,15 @@ if (userAge >= 18) { console.log(`You'll be able to vote in ${yearsToWait} year(s).`); } ``` - -**இந்தக் கோடு என்ன செய்கிறது:** -- பயனரின் வயது வாக்குச்சட்டதலை நிரூபிக்கிறதா என சரிபார்க்கிறது -- சூழ்நிலை முடிவின்படி வெவ்வேறு குறியீடு தொகுதிகளை இயக்குகிறது -- 18-ஐக் குறைவானவர்கள் வாக்குரிமைக்காக எவ்வளவு காத்திருக்கப்போகிறார்கள் என்று கணக்கிடி வெளிக்காட்டுகிறது -- ஒவ்வொரு சூழ்நிலைக்குமான குறிப்பிட்ட மற்றும் உதவிக்குறிப்புகளை வழங்குகிறது + +**இந்தக் குறியீடு என்ன செய்கிறது:** +- பயனர் வயது வாக்குப்பதிவு தகுதியைக் கணக்கிடு +- நிலை முடிவின் அடிப்படையில் வெவ்வேறு குறியீடு பகுதிகளைக் இயக்கு +- 18 வயதிற்க்கும் கீழ் இருந்தால் வாக்குப்பதிவு தகுதி வரும் வரை நேரத்தைக் கணக்கிடு மற்றும் காட்டு +- ஒவ்வொரு சூழ்நிலைக்கும் தெளிவான மற்றும் பயனுள்ள கருத்துக்களைக் கொடு ```javascript -// படி 2: தருக்கக் காணிகள் கொண்ட பல நிலைகள் +// படி 2: நியாய செயலிகள் உடன் பல நிலைகள் const userAge = 17; const hasPermission = true; @@ -408,26 +406,26 @@ if (userAge >= 18 && hasPermission) { console.log("Sorry, you must be at least 16 years old."); } ``` - -**இங்கே நிறைவாக என்ன நடக்கிறது:** -- பல சூழ்நிலைகளையும் `&&` (மற்றும்) இயக்கியில் இணைக்கிறது -- பல நிலைகளுக்கு `else if` வைத்து அடுக்கு அமைக்கிறது -- கடைசியில் எல்லா சாத்தியமான சூழ்நிலைகளுக்கும் `else` கொண்டு கையாள்கிறது -- ஒவ்வொரு வேறுபட்ட நிலைக்கும் தெளிவான, நடைமுறை விளக்கத்தை வழங்குகிறது + +**இங்கே என்ன நடக்கிறது:** +- பல நிபந்தனைகளை `&&` (மற்றும்) இயங்கியுடன் இணைக்கும் +- பல சூழ்நிலைகளுக்காக `else if` பயன்படுத்தி நிபந்தனைகளின் அடுக்கமைப்பை உருவாக்கு +- இறுதியில் அனைத்து நிலைகளையும் கையாள `else` பிரிவை வை +- வெவ்வேறு சூழ்நிலைகளுக்கு தெளிவான மற்றும் செயல்படக்கூடிய கருத்துக்களை வழங்கு ```javascript -// படி 3: மூத்த செயலி கொண்டு சுருங்கிய நிபந்தனை +// படி 3: முக்கோண இயக்கி உடன் சுருக்கமான நிபந்தனை const votingStatus = userAge >= 18 ? "Can vote" : "Cannot vote yet"; console.log(`Status: ${votingStatus}`); ``` - -**நீங்கள் நினைவில் வைத்துக்கொள்ள வேண்டியது:** -- எளிய இரண்டு விருப்பமான நிலைகளுக்கு `ternary operator` (`? :`) பயன்படுத்துவது -- முதலில் நிபந்தனையை எழுதவும், பின்னர் `?` வைத்து உண்மை முடிவை, பின்னர் `:` வைத்து பொய் முடிவைச் சூட்டுக -- நிலைகளின் அடிப்படையில் மதிப்புகளை ஒதுக்க வேண்டிய பொழுது இந்த வடிவத்தைப் பயன்படுத்துக + +**நீங்கள் நினைவில் வைத்துக் கொள்ள வேண்டும்:** +- எளிய இரண்டு தேர்வு நிலைகளுக்கு ternary ஆபரேட்டர் (`? :`) பயன்படுத்தவும் +- முதலில் நிபந்தனை எழுது, பிறகு `?`, அப்பொழுது உண்மை விளைவாக, பிறகு `:`, பிறகு பொய் விளைவாக +- நிபந்தனைகளுக்கு அடிப்படையாக மதிப்புகளை ஒதுக்குகையில் இந்த மாதிரியை பயன்படுத்தவும் ```javascript -// படி 4: பல சிறப்பு வழிகளை கையாளுதல் +// படி 4: பல குறிப்பிட்ட சூழல்களை கையாளுதல் const dayOfWeek = "Tuesday"; switch (dayOfWeek) { @@ -446,57 +444,55 @@ switch (dayOfWeek) { console.log("Invalid day of the week"); } ``` - -**இந்த நிரல் பின்வருவன செய்கிறது:** -- மாறியின் மதிப்பை பல குறிப்பிட்ட முனைகளுடன் ஒப்பிடுகிறது -- ஒற்றுமையான முனைகளை ஒன்று சேர்க்கிறது (வார விடுமுறை மற்றும் வார நாட்கள்) -- பொருந்தும் போது படி படியாகக் குறியீடு தொகுதி செயலில் ஈடுபடும் -- எதிர்பாராத மதிப்புகளை சந்திக்கும் `default` நிலையை உள்ளடக்குகிறது -- அடுத்த நிலைக்குச் செல்வதை தடுக்கும் `break` புலன்காட்டுதலை பயன்படுத்துகிறது -> 💡 **உண்மை உலகப்போலியினை**: கட்டுப்பாட்டு ஓட்டம் என்பது உலகின் மிகவும் பொறுமையான GPS போல் உங்கள் வழிகாட்டக்கூடியது. இது "மெயின் தெருவில் போக்குவரத்து இருந்தால், அதில் நெடுஞ்சாலையைப் பயணம் செய்யுங்கள். கட்டுமானம் நெடுஞ்சாலையை மூடியிருந்தால், காட்சியளிக்கும் பாதையை முயற்சி செய்யவும்" என்று சொல்லும். நிரல்கள் அதே வகையான நிபந்தனை வழுவை பயன்படுத்தி சூழ்நிலைகளுக்கு ஞானமாக பதிலளிக்கின்றன மக்களுக்கு சிறந்த அனுபவத்தைத் தர. +**இந்தக் குறியீடு செய்யும் செயல்கள்:** +- பல குறிப்பிட்ட நிலைகளுக்கு மாறியின் மதிப்பை பொருத்து +- ஒற்றையான நிலைகளை ஒருங்கிணைக்க (சனிக்கிழமை வியாழன் விடுமுறை) தொகுப்பாக்கு +- பொருந்தும் நிரல் பகுதியை இயக்கு +- எதிர்பாராத மதிப்புகளை கையாள `default` நிலையை வை +- அடுத்த நிலையுக்குச் செல்லாமல் நிறுத்த `break` கருத்துக்களை பயன்படுத்து -### 🎯 **கருத்து பரிசோதனை: கட்டுமானங்களை ஆர்.கு.பி. பேனர்** +> 💡 **உலகளாவிய ஒப்புமை**: கட்டுப்பாட்டு ஓட்டத்தை உலகின் மிகவும் பொறுமையான GPS வழித்தடம் அளிப்பது போல நினைத்துக் கொள். அது “மெயின் சாலையில் போக்குவரத்து இருந்தால், மாற்று சாலையைப் போ” அல்லது “அக்கரையை தடுக்கும் பொழுதில் ஊதியம் வழியை முயற்சி செய்” என்று கூறும். நிரல்கள் இதே விதமாக பல நிலைகளை நுண்ணறிவுடன் பிரிந்து பாவனையாளர்களுக்கு சிறந்த அனுபவத்தை தர உதவுகிறது. -**அடிப்படைகளை நீங்கள் எப்படி கையாள்கிறீர்கள் என்பதை பார்ப்போம்:** -- உங்கள் சொற்களில் மாறிலி மற்றும் பட்டியலின் வேறுபாட்டை விளக்க முடியுமா? -- ஒரு if-then முடிவுக்கான உண்மையான வாழ்க்கைச் சூழலை நினைக்க (எமது வாக்குச்சட்ட உதாரணம் போல) -- நிரல் தர்க்கத்தில் உங்களை மிகவும் ஆச்சரியப்படுத்தியது என்ன ஒன்று? +### 🎯 **அரிய அறிவு சோதனை: கட்டுமானக் கூறுகளில் தேர்ச்சி** -**விரைவான நம்பிக்கையூட்டும் உதவி:** +**அடிப்படைகளைப் பற்றி உங்கள் நிலை:** +- உங்கள் சொற்களால் மாறியும் வாக்கியமும் வேறுபாடு என்ன என்று கூற முடியுமா? +- நிபந்தனை (if-then) தீர்மானத்தை பயன்படுத்தும் ஒரு உண்மையான நிகழ்வைக் கூறுங்கள் (எமது வாக்குப்பதிவு உதாரணம் போல) +- நிரலாக்கக் கருத்தில் என்ன ஒன்று உங்களை ஆச்சரியப்படுத்தியது? + +**விவேகத்தை மேம்படுத்தும் குறுகிய முனைவு:** ```mermaid flowchart LR - A["📝 அறிக்கைகள்
(உத்தரவுகள்)"] --> B["📦 மாறிகள்
(சேமிப்பு)"] --> C["🔀 கட்டுப்பாட்டு ஓடுகை
(நிர்ணயங்கள்)"] --> D["🎉 வேலை செய்யும் நிரல்!"] + A["📝 அறிக்கைகள்
(கிரியைகள்)"] --> B["📦 மாறிகள்
(சேமிப்பு)"] --> C["🔀 கட்டுப்பாட்டு ஓற்று
(தீர்மானங்கள்)"] --> D["🎉 வேலை செய்கிற ப்ரோக்ராம்!"] style A fill:#ffeb3b style B fill:#4caf50 style C fill:#2196f3 style D fill:#ff4081 -``` -✅ **அடுத்து வரும் பகுதி**: நாம் இந்த கருத்துக்களை மேலும் ஆழமாகப் புரிந்து கொண்டு இந்த அற்புதமான பயணத்தை தொடரப்போகிறோம்! இப்போது, எதிர்காலத்தின் எல்லா அசட்டத்தான சாத்தியங்களைப் பற்றி உற்சாகப்படுத்திக் கொள்ளவும். குறிப்பிட்ட দক্ষியையும் தொழில்நுட்பத்தையும் பழகுவதால் இயலும் என்று உறுதி அளிக்கிறேன் - இது நீங்கள் எதிர்பார்க்கும் அதிரடியான பொழுதுபோக்கை விட 훨씬 அதிகம் சுவாரஸ்யமாக இருக்கும்! - -## தொழில்நுட்ப கருவிகள் +``` +✅ **அடுத்ததாக என்ன வருகிறது**: இந்த அற்புதமான பயணத்தில் இந்தக் கருத்துகளை ஆழமாகக் கற்றுக்கொள்ள நாம் கிளம்பப்போகிறோம்! இப்போது, உங்களுள் உள்ள இந்த ஆச்சரியத்தையும் ஆர்வத்தையும் கவனத்துடன் உணருங்கள். குறிப்பிட்ட திறன்களும் நுட்பங்களும் இயல்பாகத் தோன்றும் என நாங்கள் உங்களுடன் பயிற்சி தொடர்கிறோம் – இது எதிர்பாராதவாறு மிக சக்திவாய்ந்த விளையாட்டாக இருக்கும்! -சரி, இப்பொழுது எனக்கு மிகுந்த உற்சாகம் வருகிறது, அதை தாங்க முடியவில்லை! 🚀 நாளை நீங்கள் ஒரு மின்னணு விண்கலப்பயணத்தின் விசைகளை ஆறும் போல உணரவேண்டிய அற்புத கருவிகளைப் பற்றி பேசப் போகிறோம். +## தொழில்நுட்ப கருவிகள் -ஒரு சமையல்காரர் அவர்களுடைய கை விரிவாக இருப்பதாக உணர்கிற கேனிவுகளைக் கொண்டிருக்கிறார்கள் என்பது உங்களுக்கு தெரியும். அல்லது ஒரு இசைக்கலைஞர் தங்களுடைய கேள்வையை தொடுவதற்குடனே அது பாட ஆரம்பிக்கிறது. நாமும், உருவாக்குநர்களும், அந்த வகையான அதிசய கருவிகளைப் பயன்படுத்துகிறோம், மேலும் பெரும்பாலும் அவை இலவசம் என்று நான் சொல்வதால் உங்களுக்கு ஆச்சரியம் வரும்! +சரி, இந்தப் பகுதி உண்மையில் எனக்கு மிகவும் உற்சாகத்தை தருகிறது! 🚀 இப்போது நாங்கள் உங்கள் கையில் டிஜிட்டல் விண்கலம் இயக்க முக்கிய கருவிகள் பற்றி பேசப்போகிறோம். -நான் இந்த கருவிகளை உங்களுடன் பகிர்ந்துகொள்ளும் எண்ணத்தில் இருந்து குதூகலப்படுகிறேன், ஏனென்றால் அவை மென்பொருள் உருவாக்கும் முறையில் புரட்சி செய்துள்ளன. AI இயக்குனர் உதவியாளர்கள் உங்கள் குறியீட்டை எழுத உதவும் (நான் சூடு சொல்லவில்லை!), இதர இடங்களில் Wi-Fi உடன் இருந்து முழு பயன்பாடுகளை உருவாக்க நீங்கள் செயலாக்க சூழல், மற்றும் X-கதிர் பார்வை போல் உங்கள் நிரல்கள் விசாரணை செய்ய உதவும் டிபக் கருவிகள் இவை. +ஒரு சமையல்காரருக்கு தங்களுடைய கை விரல்கள் போல செம்மையான கத்திகள் இருப்பது போலவே உங்களுக்கு சிறந்த கருவிகள் இருக்கின்றன. அல்லது இசைக்கலைஞர் தொடும் கணத்தில் பாடும் கிட்டார் போலவே. நிஜத்தில் உங்களுக்கு விலைபிடித்த முயற்சியில் சமர்ப்பிக்கப் பட்ட AI கற்றுக் கொடுக்கும் உதவியாளர்கள், Wi-Fi ஐ கொண்டு எங்கிருந்தும் முழு செயலிகளை உருவாக்கும் மேக சூழல்கள், X-கதிர்வீச்சுப் பார்வை போன்ற தீவிரமான பிழைதிருத்த கருவிகள் இவற்றை எல்லாம் உங்களுக்கு கொண்டு வருகிறோம். -மேலும் இது என்ன விறுவிறுப்பை தருகிறது என்றால்: இவை "ஆரம்ப நிலை கருவிகள்" அல்ல, நீங்கள் வளர்ந்து விடும் என்று நினைக்கும் பரிமாணங்கள் அல்ல. இந்தப் பெற்ற தொழில்நுட்ப கருவிகள் Google, Netflix போன்ற பிரபல நிறுவனங்களிலும் உங்கள் பிடித்த குடிமன்ற அயல் நிறுவனமும் இப்போது பயன்படுத்துகின்றன. இவற்றைக் பயன்படுத்தி நீங்கள் முற்றிலும் நிர்வாகி போல உணரப்போகிறீர்கள்! +இவை "ஆரம்பக் கருவிகள்" அல்ல என்று நினைத்திருப்பீர்கள்; இது Google, Netflix மற்றும் உங்கள் விரும்பும் indie செயலி நிறுவனங்கள் பயன்படுத்தும் தொழில்முறை கருவிகள் தான். இவற்றைப் பயன்படுத்தி நீங்கள் நிஜமாகவே திறமையானவனாக இருப்பீர்கள்! ```mermaid graph TD - A["💡 உங்கள் கருத்து"] --> B["⌨️ குறியீடு ஆசிரியர்
(VS Code)"] - B --> C["🌐 உலாவி டெவ் டூல்ஸ்
(சோதனை மற்றும் பிழை தீர்க்கல்)"] - C --> D["⚡ கட்டளை வரி
(தேொடர்ச்சி மற்றும் கருவிகள்)"] - D --> E["📚 ஆவணங்கள்
(கற்றல் மற்றும் குறிப்பு)"] - E --> F["🚀 அருமையான வலை செயலி!"] + A["💡 உங்கள் ஐڈیا"] --> B["⌨️ குறியீடு தொகுப்பி
(VS Code)"] + B --> C["🌐 உலாவி டெவ் டூல்ஸ்
(சோதனை & பிழைதிருத்தல்)"] + C --> D["⚡ கட்டளை வரி
(தானியங்கி மற்றும் கருவிகள்)"] + D --> E["📚 பதிவேடு
(கற்றல் & குறிப்பு)"] + E --> F["🚀 அற்புதமான இணைய செயலி!"] B -.-> G["🤖 AI உதவியாளர்
(GitHub Copilot)"] - C -.-> H["📱 சாதன சோதனை
(பதில் கூறும் வடிவமைப்பு)"] + C -.-> H["📱 சாதன சோதனை
(பதில் தெரிவு கலை)"] D -.-> I["📦 தொகுப்பு மேலாளர்கள்
(npm, yarn)"] - E -.-> J["👥 சமூகத்தினர்
(Stack Overflow)"] + E -.-> J["👥 சமூகமேடைகள்
(Stack Overflow)"] style A fill:#fff59d style F fill:#c8e6c9 @@ -504,147 +500,146 @@ graph TD style H fill:#f3e5f5 style I fill:#ffccbc style J fill:#e8eaf6 -``` -### குறியீடு தொகுப்பாளர்கள் மற்றும் IDEகள்: உங்கள் புதிய டிஜிட்டல் நண்பர்கள் - -குறியீடு தொகுப்பாளர்களைப் பற்றி பேசுவோம் – இவை உங்கள் புதிய பிடித்த இடங்கள் ஆக விடப்போகின்றன! இவற்றை நீங்கள் உங்கள் தனிப்பட்ட குறியீட்டுக் கண்காட்சியாக நினைத்துக் கொள்ளுங்கள், அங்கு நீங்கள் பெரும்பாலான நேரம் உங்கள் டிஜிட்டல் படைப்புகளை உருவாக்கவும் மேம்படுத்தவும் செலவிடுவீர்கள். +``` +### குறியீடு ஆசிரியர்கள் மற்றும் IDEகள்: உங்கள் புதிய டிஜிட்டல் நண்பர்கள் -ஆனால் இன்றைய தொகுப்பாளர்கள் என்ன அற்புதமே என்றால்: இவை வெறும் எழுத்துப்பதிவர் அல்ல. இவை 24/7 நேரம் உங்களுடன் அமர்ந்து உங்கள் குறியீடை புரிந்துகொள்ள உதவும், உங்கள் தப்புகளை முன்பே கட்டப்படுத்தும், நீங்கள் என்ன எழுதவிருக்கிறீர்கள் என கணிப்பதை கூடச் செய்வது போல்! +குறியீடு ஆசிரியர்கள் பற்றி பேசுவோம் – இவை உங்கள் புதிய பிடித்த இடங்களாக மாறும்! இவை உங்கள் தனிப்பட்ட குறியீடு அதிபதிகளாகும், இங்கே நீங்கள் பெரும்பாலான நேரத்தை உலகற்ற பணிகளை உருவாக்கியும் முழுமையாக பளபளப்பாக்கியும் செலவிடுவீர்கள். -நான் முதலில் தானாக நிரலை முடிப்பதை கண்டபோது, அது எதிர்காலத்தில் வாழ்ந்து கொண்டு இருப்பதாக அறிவதாக இருந்தது. நீங்கள் தட்டச்சு செய்ய ஆரம்பிக்கும்போது, உங்கள் தொகுப்பாளர் "நீங்கள் இப்படி ஒரு செயல்பாட்டை நினைத்தீர்களா?" என்று கேட்கிறது. அது உங்கள் குறியீடு நண்பருக்கு மனம் படைப்பவர் இருப்பதுபோல்! +இன்றைய ஆசிரியர்களின் அற்புதம் என்னவெனில், அவை வெறும் உரை ஆசிரியர்கள் அல்ல. அவை 24/7 நீங்கள் அருகில் இருப்பது போன்ற பிரகாசமான, ஆதரவு தரும் குறியீட்டு பயிற்றுவிப்பாளர்களாகும். நீங்கள் பிழை எழுதுவதற்கு முன் அவை கண்டுபிடித்து காட்சிப்படுத்துகின்றன, புத்தாக்கங்களை பரிந்துரைக்கின்றன, ஒவ்வொரு குறியீடும் என்ன செய்கிறது என்பதைக் கூறுகின்றன, அதைத் தொடர்ந்து என்ன எழுதப்போகிறீர்கள் என்று முன்கூட்டியே கூறி உதவுகின்றன! -**இந்த தொகுப்பாளர்கள் என்ன வலிமை தருகின்றன?** +நான் முதலில் தானாக-முழுமையை கண்டுபிடித்த போது, நான் எதிர்காலத்தில் வாழ்கிறேன் என்று உணர்ந்தேன். நீங்கள் ஒன்றை தட்டச்சு ஆரம்பிக்கையில், ஆசிரியர் கேட்கிறது: "இந்த செயல்பாடு உங்களுக்கு தேவைப்படுவது அல்லவா?" அது ஒரு மன வாசகராய் இருப்பதைப்போல்! -நவீன குறியீடு தொகுப்பாளர்கள் உங்கள் உற்பத்தித்தன்மையை உயர்த்த பல அம்சங்களைக் கொண்டுள்ளன: +**இந்த ஆசிரியர்களை அற்புதமாக்கும் அம்சங்கள்:** -| அம்சம் | அது என்ன செய்கிறது | இது எப்படி உதவும் | -|---------|--------------|--------------| -| **இலக்கண வண்ணச்சு** | உங்கள் குறியீடு பகுதிகளை வண்ணமயமாக்குகிறது | குறியீட்டை வாசிக்க மற்றும் பிழைகளை கண்டுபிடிக்க உதவும் | -| **தானாக முடித்தல்** | நீங்கள் தட்டச்சு செய்யும்போது குறியீட்டை பரிந்துரைக்கிறது | குறியீடு செய்யும் வேகம் மற்றும் தப்புகளை குறைக்கும் | -| **டிபக்கிங் கருவிகள்** | பிழைகளை கண்டறிந்து சரிசெய்ய உதவும் | விசாரணைக்கான நேரத்தை காப்பாற்றும் | -| **பிரிப்பு செயற்கைகள்** | சிறப்பு அம்சங்களைச் சேர்க்கிறது | எந்த தொழில்நுட்பத்திற்கும் தொகுப்பாளரை தனிப்பயனாக்கும் | -| **AI உதவியாளர்கள்** | குறியீடு மற்றும் விளக்கங்களை பரிந்துரைக்கிறது | கற்றல் மற்றும் உற்பத்தியை வேகப்படுத்தும் | +நவீன குறியீடு ஆசிரியர்கள் வேலை திறனை அதிகரிப்பதற்கான வலிமையான அம்சங்களை வழங்குகின்றன: -> 🎥 **வீடியோ ஆதாரம்**: இந்த கருவிகள் எப்படி செயல்படுகிறதென்றதை காண விரும்புமா? இதைப் பாருங்கள் [Tools of the Trade video](https://youtube.com/watch?v=69WJeXGBdxg). +| அம்சம் | என்ன செய்கிறது | உதவும் காரணம் | +|---------|--------------|--------------| +| **நடவடிக்கை வண்ணமயம்செய்தல்** | உங்கள் குறியீட்டின் வெவ்வேறு பகுதிகளை வண்ணமயமாக்குகிறது | குறியீட்டை எளிதாக வாசிக்கவும் பிழைகளை அடையாளம் காணவும் உதவும் | +| **தானாக முழுமை** | நீங்கள் தட்டச்சு செய்யும்போது குறியீட்டை முன்மொழிகிறது | குறியீடு வேகத்தை அதிகரிக்கவும் பிழைகள் குறைக்கவும் உதவும் | +| **பிழைத்திருத்த கருவிகள்** | பிழைகளை கண்டறிந்து சரி செய்ய உதவும் |ப் சில மணி நேரங்களைச் சேமிக்க உதவும் | +| **உதவிக்கூறுகள்** | சிறப்பு அம்சங்களை சேர்க்கலாம் | உங்கள் ஆசிரியரை தொழில்நுட்பத் தேவைகளுக்கு ஏற்றார் படுத்தவும் | +| **AI உதவியாளர்கள்** | குறியீடு மற்றும் விளக்கங்களைச் சுட்டிக்காட்டுகின்றன | கற்றல் மற்றும் வேலை திறனை விரைவுபடுத்துகின்றன | -#### வலை மேம்பாட்டிற்கு பரிந்துரைக்கப்படும் தொகுப்பாளர்கள் +> 🎥 **காணொளி ஆதாரம்**: இந்த கருவிகளை செயல்பாட்டில் காண விரும்பினால், [Tools of the Trade video](https://youtube.com/watch?v=69WJeXGBdxg) ஐப் பாருங்கள். -**[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)** (இலவசம்) -- வலை மேம்பாட்டாளர்களில் மிகவும் பிரபலமானது -- சிறந்த பிரிப்பு சூழல் -- உள்ளடக்கப்பட்ட டெர்மினல் மற்றும் Git ஒருங்கிணைப்பு -- **அவசியமான பிரிப்புகள்**: - - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - AI திறன் கொண்ட குறியீடு பரிந்துரை - - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) - நேரடி ஒருங்கிணைப்பு - - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - தானியங்கியாக குறியீடு வடிவமைத்தல் - - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) - குறியீட்டிலுள்ள தப்புகளை கண்டறிதல் +#### இணையத் தயாரிப்பாளர்களுக்கு பரிந்துரைக்கப்பட்ட ஆசிரியர்கள் -**[JetBrains WebStorm](https://www.jetbrains.com/webstorm/)** (செலுத்தப்படும், மாணவர்களுக்கு இலவசம்) -- மேம்பட்ட டிபக் மற்றும் சோதனை கருவிகள் -- புத்திசாலித்தனமான குறியீடு முடித்தல் -- கட்டமைக்கப்பட்ட பதிப்பு கட்டுப்பாடு +**[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)** (இலவசம்) +- இணைய வளர்ப்பாளர்களுக்கு மிகவும் பிரபலம் +- சிறந்த விரிவாக்க சுற்றுச்சூழல் +- உள்ளமைந்த டெர்மினல் மற்றும் Git ஒருங்கைப்பு +- **அவசியமான விரிவாக்கங்கள்**: + - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - AI இயக்கிய குறியீட்டு பரிந்துரைகள் + - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) - நேரடி ஒத்துழைப்பு + - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - தானாக குறியீட்டை வடிவமைத்தல் + - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) - குறியீட்டிலுள்ள எழுத்துப்பிழைகள் அடையாளம் காண்பது -**மேக அடிப்படையிலான IDEகள்** (வேறு விலையில்) -- [GitHub Codespaces](https://github.com/features/codespaces) - உலாவியில் முழுமையான VS Code -- [Replit](https://replit.com/) - கற்றலும் பகிர்வும் சிறந்தது -- [StackBlitz](https://stackblitz.com/) - உடனடி முழு ஸ்டாக் வலை மேம்பாடு +**[JetBrains WebStorm](https://www.jetbrains.com/webstorm/)** (கம்பளங்கள், மாணவர்களுக்கு இலவசம்) +- மேம்பட்ட பிழைத்திருத்த மற்றும் சோதனை கருவிகள் +- அறிவார்ந்த குறியீட்டு முழுமை +- உள்ளமைந்த பதிப்பு கட்டுப்பாடு -> 💡 **தொடங்குவோர் குறிப்பு**: Visual Studio Code-ஐத் தொடங்குங்கள் – இது இலவசம், தொழில்துறையில் பரவலாக பயன்படுத்தப்படுகிறது மற்றும் பல பயனுள்ள கற்றல் வகுப்புகள் மற்றும் பிரிப்புகளை உருவாக்கும் பெரிய சமூகத்துடன் உள்ளது. +**மேகக் கூட்டமைப்பு IDEகள்** (விலை திசை) +- [GitHub Codespaces](https://github.com/features/codespaces) - உலாவியில் முழு VS Code +- [Replit](https://replit.com/) - குறியீடு கற்றல் மற்றும் பகிர்வுக்கு சிறந்தது +- [StackBlitz](https://stackblitz.com/) - உடனடி முழு ஸ்டாக் வலை வளர்ப்பு +> 💡 **ஆரம்பக் குறிப்புரை**: Visual Studio Code இல் தொடங்குங்கள் – இது இலவசம், தொழில்துறை முழுவதும் பரவலாகப் பயன்படுத்தப்படுகிறது, மற்றும் பல பயனுள்ள பயிற்சிகள் மற்றும் விரிவாக்கங்களை உருவாக்கும் பெரிய சமூகமும் உடையது. -### வலை உலாவிகள்: உங்கள் ரகசிய மேம்பாட்டு ஆய்வகம் +### இணைய உலாவிகள்: உங்கள் மறைமொழி வளர்ப்பு ஆய்வகம் -சரி, உங்கள் மனதை முழுமையாக உதிர்வடிக்க தயாராகுங்கள்! நீங்கள் சமூக ஊடகங்களில் சுருள் பிடிக்கவும் வீடியோக்கள் பார்க்கவும் உலாவிகளைப் பயன்படுத்தி வருகிறீர்கள்; இதுவரை அவர்கள் உங்கள் மறைக்கப்பட்ட சக்திவாய்ந்த மேம்பாட்டு ஆய்வகத்தை மறைத்து வைத்து உள்ளனர். +சரி, மனதை முழுமையாகத் தாக்கும் உண்மையை அறியத் தயார்! நீங்கள் சமூக வலைதளங்களை உலாவி காணும் மற்றும் காணொளிகள் பார்ப்பது போல இணைய உலாவிகளைப் பயன்படுத்துகிறீர்கள் என்றாலும், இவை ஒரு மறைமொழி வளர்ப்பு ஆய்வகத்தை எப்போதும் மறைத்து வைத்திருந்தது, நீங்கள் இதை கண்டுபிடிக்கென்று காத்திருக்கிறது! -ஒவ்வொரு முறையும் ஒரு வலைப் பக்கத்தில் வலது கிளிக் செய்து "Inspect Element" (உறுப்பை ஆய்வு செய்) என்பதைக் கிளிக் செய்யும் போது, நீங்கள் ஒரு மறைந்த மேம்பாட்டு கருவிகள் உலகத்தை திறக்கிறீர்கள். நான் முன்பு நூற்றுக்கணக்கான டாலர்கள் செலுத்தி வாங்கிய சில மென்பொரல்களைவிட இவை சக்திவாய்ந்ததாக இருக்கின்றன. அது உங்கள் இயல்பான சமையல் அறைக்குப் பின்னால் ஒரு தொழில்முறை சமையல்காரன் ஆய்வகம் மறைத்து வைத்திருக்கின்றது என்று கண்டுபிடிப்பதைப் போன்றது! -முதன்முறையாக யாரோ எனக்கு உலாவி DevTools-ஐ காட்டியபோது, நான் மூன்று மணி நேரம் கிளிக் செய்து "வாங்க, அது கூட செய்யுமா?!" என்கிறேனே. நீங்கள் நேரடியான நேரத்தில் எந்த இணையதளத்தையும் எடிட் செய்ய முடியும், எல்லாவற்றும் எவ்வளவு வேகமாக ஏற்றுகிறது என்பதை சரியாக பார்க்கலாம், உங்கள் தளம் வேறுபட்ட சாதனங்களில் எப்படி தோற்றமளிக்கிறது என்பதை சோதிக்கலாம், மற்றும் ஜாவாஸ்கிரிப்ட் பிழைகளை நிபுணர்களைப் போல திறம்பட திருத்தலாம். இது முற்றிலும் ஆச்சர்யமளிக்கிறது! +ஒவ்வொரு முறையும் நீங்கள் வலைப்பக்கத்தில் வலது கிளிக் செய்து "Inspect Element" தேர்ந்தெடுக்கும்போது, நீங்கள் ஒரு மறைந்துள்ள வளர்ப்பு கருவிகள் உலகத்தைத் திறக்கிறீர்கள், இது நான் முன்பு காசு செலவிட்ட மதிப்பீடு மென்பொருளைக் காட்டிலும் சக்திவாய்ந்ததாக இருக்கிறது. இது வழக்கமான உங்கள் சமையலறை பின்னணியில் ஒரு தொழில்முறை சமையல்காரரின் ஆய்வகத்தை மறைத்து வைத்திருந்ததை கண்டுபிடிப்பதுபோல உள்ளது! +யாராவது முதன்முறையாக எனக்கு browser DevTools ஐ காட்டும்போது, நான் சுமார் மூன்று மணி நேரம் வெறும் கிளிக் செய்து "நின்று பார்க்கவும், அது இதையும் செய்யலாம் என?" என்று சொல்லிக் கொண்டே இருந்தேன்! நீங்கள் நேரடி நேரத்தில் எந்தவொரு வலைத்தளத்தையும் தொகு திருத்தலாம், எவ்வாறு வேகமாக அனைத்தும் ஏற்றப்படுகின்றன என்பது தெளிவாகக் காணலாம், உங்கள் தளம் பல்வேறு கருவிகளில் எப்படி தோன்றுகிறது என்று சோதிக்கலாம், மற்றும் JavaScript ஐ முழு நிபுணராக டிபக் செய்யவும் முடியும். அது நிச்சயமாக மனதை அறிய வைக்கும்! -**இனிமேல் உலாவிகள் உங்கள் ரகசிய ஆயுதங்கள் ஆக இருப்பதன் காரணம்:** +**வழங்கப்படும் காரணம் இதோ, உங்களுக்கான உள்நுழைவுக் குத்துகோல் இதுதான்:** -நீங்கள் இணையதளம் அல்லது வலை பயன்பாடை உருவாக்கும் போது, அது உண்மையான உலகில் எப்படி தோன்றுகிறது மற்றும் நடக்கிறது என்பதை நீங்கள் காண வேண்டும். உலாவிகள் உங்கள் படைப்பை மட்டுமல்லாமல் செயல்திறன், அணுகல் திறன் மற்றும் சாத்தியமான பிரச்சனைகள் பற்றிய விரிவான கருத்துக்களையும் வழங்குகின்றன. +நீங்கள் ஒரு வலைத்தளம் அல்லது வலை செயலியை உருவாக்கும் போது, அது உண்மையான உலகில் எப்படி தோன்றுகிறது மற்றும் செயல்படுகிறது என்பதை பார்க்க வேண்டும். உலாவிகள் உங்கள் பணிக்கே அல்லாமல் செயல்திறன், அணுகல்தன்மை, மற்றும் சாத்தியமான பிரச்சினைகளுக்கான விரிவான கருத்துக்களையும் வழங்குகின்றன. -#### உலாவி டெவலப்பர் டூல்ஸ் (DevTools) +#### உலாவி டெவலப்பர் கருவிகள் (DevTools) -நவீன உலாவிகள் விரிவான மேம்பாட்டு கருவிகள் கொண்டுள்ளன: +நவீன உலாவிகள் முழுமையான மேம்பாட்டு தொகுப்புகளை உள்ளடக்கியுள்ளன: -| கருவி வகை | அது செய்கிறது என்ன | உதாரண பயன்பாடு | -|---------------|------------------|------------------| -| **எலிமெண்ட் இன்ஸ்பெக்டர்** | நேரடியாக HTML/CSS ஐ பார்க்கவும் மற்றும் திருத்தவும் | உடனடி முடிவுகளை பார்க்க ஸ்டைலிங் மாற்றவும் | -| **கான்சோல்** | பிழை செய்திகள் பார்க்கவும், JS சோதிக்கவும் | பிரச்சனைகளைத் திருத்தவும், கோடை ஆராயவும் | -| **நெட்வொர்க் மோனிட்டர்** | வளங்கள் எப்படி ஏற்ற Mollு என்பதை கண்காணிக்கவும் | செயல்திறன் மற்றும் ஏற்ற நேரங்களை மேம்படுத்தவும் | -| **அணுகல் சோதனை கருவி** | ஒருங்கிணைந்த வடிவமைப்பை சோதிக்கவும் | உங்கள் தளம் அனைத்து பயனர்களுக்கும் செயல்படுவதை உறுதி செய்யவும் | -| **சாதனம் சிமுலேட்டர்** | வித்தியாசமான திரை அளவுகளில் முன்னோட்டம் | பல சாதனங்கள் இல்லாமல் பதிலளிக்கும் வடிவமைப்பை சோதிக்கவும் | +| கருவி வகை | அது என்ன செய்கிறது | உதாரண பயன்பாடு | +|---------------|------------|------------------| +| **எலிமென்ட் இன்ஸ்பெக்டர்** | HTML/CSS ஐ நேரடியாக காணவும் திருத்தவும் | உடனடி விளைவுகளுக்கு பாணி சரிசெய்தல் | +| **கான்சோல்** | பிழை செய்திகளைப் பார்க்கவும் JavaScript ஐ சோதிக்கவும் | பிரச்சனைகளை டிபக் செய்து குறியீடியுடன் முயற்சி செய்பு | +| **நெட்வொர்க் மானிட்டர்** | வளங்கள் எவ்வாறு ஏறுகின்றன என்று கண்காணிக்கவும் | செயல்திறன் மற்றும் ஏற்ற நேரம் மேம்படுத்தவும் | +| **அணுகல்தன்மை சோதகர்** | உள்ளடக்கத்தைக் கொண்டு இருப்பதைச் சோதிக்கவும் | உங்கள் தளம் அனைத்து பயனர்களுக்கும் வேலை செய்கிறது என்பதை உறுதிசெய்தல் | +| **கருவி சிமுலேட்டர்** | வெவ்வேறு திரை அளவுகளில் முன்னோட்டம் | பல கருவிகள் இல்லாமல் பதிலளிக்கும் வடிவமைப்பை சோதிக்கவும் | -#### மேம்பாட்டிற்கான பரிந்துரைக்கப்பட்ட உலாவிகள் +#### மேம்பாட்டுக்கான பரிந்துரைக்கப்பட்ட உலாவிகள் -- **[Chrome](https://developers.google.com/web/tools/chrome-devtools/)** - தொழில்துறை நிலையான DevTools மற்றும் முழுமையான ஆவணங்கள் +- **[Chrome](https://developers.google.com/web/tools/chrome-devtools/)** - விரிவான ஆவணங்களுடன் தொழில்துறையில் தரம் பெற்ற DevTools - **[Firefox](https://developer.mozilla.org/docs/Tools)** - சிறந்த CSS கிரிட் மற்றும் அணுகல் கருவிகள் -- **[Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)** - Chromium அடிப்படையில் மைக்ரோசாஃப்டின் டெவலப்பர் வளங்களுடன் +- **[Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)** - Microsoft இன் மேம்பாட்டு வளங்களுடன் Chromium அடிப்படையில் -> ⚠️ **முக்கிய சோதனை குறிப்புரை**: உங்கள் இணையதளங்களை பல உலாவிகளில் எப்போதும் சோதிக்கவும்! Chrome-ல் சிறப்பாக வேலை செய்பவை Safari அல்லது Firefox-ல் வேறுபடும். தொழில்முறை டெவலப்பர்கள் அனைத்து முக்கிய உலாவிகளிலும் சோதித்து ஒரே மாதிரியான பயனர் அனுபவத்தை உறுதி செய்கின்றனர். +> ⚠️ **முக்கிய சோதனை டிப்**: உங்கள் வலைத்தளங்களை பல உலாவிகளில் எப்போதும் சோதிக்கவும்! Chrome இல் சிறப்பாக வேலை செய்கிறதென்றால் Safari அல்லது Firefox இல் வேறுபட்டு தோன்றலாம். தொழில்முறை மேம்பாட்டாளர்கள் அனைத்து முக்கிய உலாவிகளிலும் சோதனை செய்வதன் மூலம் ஒத்துள்ள பயனர் அனுபவங்களை உறுதி செய்கின்றனர். -### கட்டளை வரி கருவிகள்: உங்கள் டெவலப்பர் சூப்பர் சக்திகளுக்கு வாயிலாக +### கட்டளை வரி கருவிகள்: உங்கள் மேம்பாட்டு அற்புத சக்திக்கான வாயில் -சரி, கட்டளை வரியைப் பற்றி முழுமையாக நேர்மையான ஒரு நேரம் கொள்வோம், ஏனெனில் இதை உணர்ந்து செயல்படுபவர் ஒருவர் இதை உங்களுக்கு சொல்வார். முதலில் அதை பார்த்ததும் – அந்த பயங்கரமான கருப்பு திரை மற்றும் ஒளிரும் எழுத்து – நான் நேரடியாக "இல்லை, இப்போ இல்லை! இது 1980கள்த்து ஹேக்கர் படம் மாதிரி தோன்றுகிறது, நான் இதற்கு ஞானி இல்லை!" என்று நினைத்தேன் 😅 +சரி, கட்டளை வரிக்குக் குறித்துப் பொது உண்மையைப் பகிர்ந்துகொள்வோம், ஏனெனில் அதை உணர்ந்த ஒருவரிடம் இருந்து நீங்கள் அதை கேட்க விரும்புகிறேன். முதலில் நான் அதை பார்த்தபோது – அந்த அச்சுறுத்தும் கருப்பு திரைக்குப் பிளிக்கும் எழுத்துக்கள் – நான் உண்மையில் "அடுறேன், கண்டிப்பாக இல்லை! இது 1980 களின் ஹேக்கர் திரைப்படத்திலிருந்த ஒரு காட்சி போல் தோன்றுகிறது, நான் இதற்கு போதுமான புத்திசாலி அல்ல!" என்று நினைத்தேன் 😅 -ஆனால் போனால் என்ன சொல்ல இருந்தால், கட்டளை வரி பயங்கரம் அல்ல – இது உங்கள் கணினியுடன் நேரடி உரையாடலைப் போன்றது. fancy படங்களை மற்றும் மெனுவை கொண்ட உணவு ஆர்டர் செய்யும் செயலியைவிட (அது நன்றாகவும் எளிமையாகவும் இருக்கிறது) உங்கள் பிடித்த உள்ளூர் உணவகத்தில் சென்று பட்டாணி எப்படி பழகுறார் என்றும் அவருக்கு "சர்ப்ரைஸ் என்னா வேண்?" என்று சொன்னால், அவர் ஒரு சிறந்த உணவை தயார் செய்வார். +ஆனால் நான் அப்போது யாரும் சொல்லாத ஒன்றைக் கூற விரும்புகிறேன், இப்போது நீங்களும் கேட்கவேண்டிய தமிழில்: கட்டளை வரி அச்சுறுத்தாது – அது உங்கள் கணினியுடன் நேரடி உரையாடல் போன்று இருக்கிறது. அதை அழகான படங்கள் மற்றும் பட்டியல்கள் கொண்ட உணவு ஆர்டர் செய்யும் ਐப்ப்லிக்கேஷனைப் போல நினைத்துக் கொள்ளுங்கள் (அது நல்லது மற்றும் எளிது), மாறாக உங்கள் பிடித்த உள்ளூர் உணவகத்துக்குச் சென்று அங்கே பரிசு செய்து ஒரு சிறந்த உணவை தயாரிக்கும் சமையல்காரரை நேரடியாக சந்திப்பது போன்றது. -கட்டளை வரி டெவலப்பர்கள் முழுமையான ஞானிகள் ஆகும் இடம். நீங்கள் சில மாயமான சொல்லுகளை (ஆம், அவை கட்டளைகள் தான், ஆனால் மாயையாகத் தோன்றும்!) தட்டச்சு செய்து enter அழுத்தினால், நீங்கள் முழு திட்ட அமைப்புகளை உருவாக்கி, உலகின் பல பகுதிகளில் இருக்கும் சக்திவாய்ந்த கருவிகளை நிறுவி, உங்கள் பயன்பாட்டை இணையத்தில் பலருக்குப் பார்க்கவைக்கும். ஒருமுறை அந்த சக்தியை நீங்கள் அனுபவித்ததும், அது அடிமைபடுத்தும்! +கட்டளை வரி மேம்பாட்டாளர்கள் தங்களுக்கு அவன் அற்புதமானவர் போல உணர உதவும் இடம். நீங்கள் சில மந்திர ஒத்த வார்த்தைகளை (சரி, அவை கட்டளைகள் தான், ஆனால் அவை மந்திரம் போல் தான்!) தட்டீர்கள், enter அழுத்துகிறீர்கள், மற்றும் பூம் – நீங்கள் முழு திட்ட அமைப்புகளை உருவாக்கிவிட்டீர்கள், உலகம் முழுதிலிருந்தும் சக்திவாய்ந்த கருவிகளை நிறுவிவிட்டீர்கள், அல்லது உங்கள் செயலியை மில்லியன்களின் பார்வைக்கு இணையத்தில் வெளியிட்டுவிட்டீர்கள். அந்த சக்தியின் முதல் சுவையை அடைந்த பிறகு அது முற்றிலும் பழக்கமாகிவிடும்! -**கட்டளை வரி உங்களின் பிரியத்தன்மை கருவியாக இருக்க காரணம்:** +**கட்டளை வரி உங்கள் பிடித்த கருவியாக இருப்பதற்குக் காரணம்:** -கிராஃபிகல் இடைமுகங்கள் பல வேலைகளுக்கு அருமையாக இருந்தாலும், கட்டளை வரி தானியங்கி செயல்பாடுகள், துல்லியம் மற்றும் வேகத்தில் சிறந்தது. பல மேம்பாட்டு கருவிகள் கமாண்டு லைன் வழியே செயல்படுகின்றன, அவற்றை திறம்பட பயன்படுத்த கற்றுக் கொள்வது உங்கள் செயல்திறனுக்கு மிகப்பெரிய மேம்பாட்டை அளிக்கும். +கலாச்சார இடைமுகங்கள் பல பணிகளுக்கு சிறந்ததாக இருந்தாலும், கட்டளை வரி தானாக செயல்பாடு, துல்லியம் மற்றும் வேகத்தில் சிறந்தது. பல மேம்பாட்டு கருவிகள் முதன்மையாக கட்டளை வரிசை இடைமுகங்கள் மூலம் இயங்குகின்றன, அவற்றைப் பயிற்சி செய்து திறமையாக பயன்படுத்தினால் உங்கள் உற்பத்தித் திறன் மிக உயரும். ```bash -# படி 1: திட்ட அடைவை உருவாக்கி அதிலே செல்லவும் +# படி 1: திட்ட அடைவை உருவாக்கி அதில் செல்லவும் mkdir my-awesome-website cd my-awesome-website ``` -**இந்தக் கோடு என்ன செய்கிறது:** -- **ஒரு புதிய கோப்புறை உருவாக்குகிறோம்** - "my-awesome-website" என உங்கள் திட்டத்திற்கு -- **புதிய உருவாக்கப்பட்ட கோப்புறைக்குள் செல்கிறோம்** பணியைத் தொடங்க +**இந்தக் குறியீடு செய்யும் பணிகள்:** +- **"my-awesome-website" என்ற புதிய அடைவை உருவாக்கவும்** உங்கள் திட்டத்துக்காக +- **புதிய அடைவின் உள்ளே செல்லவும்** பணியைத் தொடங்க ```bash -# படி 2: package.json உடன் திட்டத்தை ஆரம்பிக்கவும் +# படி 2: package.json உடன் திட்டத்தை தொடக்கம் செய்க npm init -y -# நவீன வளர்ச்சி கருவிகளை நிறுவவும் +# நவீன உருவாக்கல் கருவிகளை நிறுவுக npm install --save-dev vite prettier eslint npm install --save-dev @eslint/js ``` -**படி படியாக, இதுவே நடக்கிறது:** -- `npm init -y` உபயோகித்து புதிய Node.js திட்டத்தை இயக்கு -- வேகமான மேம்பாட்டுக்கும் தயாரிப்பு கட்டுவதற்கும் Vite என build tool-ஐ நிறுவு -- Prettier (தானியங்கி கோடு வடிவமைப்பு) மற்றும் ESLint (கோடு தரத்துக்கான சோதனை) சேர்க்கவும் -- `--save-dev` கொடியை dev dependencies மட்டும் என குறிக்கவும் +**தடம் தடமாக, இங்கு என்ன நடக்கிறது:** +- **`npm init -y` பயன்படுத்தி** இயல்புநிலை அமைப்புகளுடன் புதிய Node.js திட்டத்தை ஆரம்பித்தல் +- **Vite ஐ நிறுவுதல்** வேகமான மேம்பாடு மற்றும் தயாரிப்பு கட்டலுக்கான நவீன கட்டுமான கருவியாக +- **Prettier ஐ மற்றும் ESLint ஐ சேர்ப்பது** தானாக குறியீடு வடிவமைப்புக்கும் தர சோதனைக்கும் +- **`--save-dev` கொடியை** மேம்பாட்டு ஆதாரங்களாகக் குறிக்கும் ```bash -# படி 3: திட்ட கட்டமைப்பு மற்றும் கோப்புகளை உருவாக்கவும் +# படி 3: திட்ட அமைப்பையும் கோப்புகளையும் உருவாக்கவும் mkdir src assets echo 'My Site

Hello World

' > index.html -# மேம்பாட்டு சர்வரைத் தொடங்கு +# மேம்படுத்தல் சேவையகம் துவக்கவும் npx vite ``` -**மேலேயுள்ளவற்றில் நான் செய்துள்ளேன்:** -- மூலக் குறியீடு மற்றும் தடங்கள் தனித்தனியாக உள்ள கோப்புறைகளை அமைத்தல் -- சரியான ஆவண அமைப்புடன் அடிப்படை HTML கோப்பு உருவாக்கல் -- Vite web development சேவையகத்தை துவங்கி live reloading மற்றும் hot module replacement செயல் +**மேற்கூறியுள்ளவற்றில், நாம்:** +- **மூல குறியீடு மற்றும் வள கோப்பு அடைவுகளை தனித்தனியாக அமைத்தோம்** +- **சரியான ஆவண அமைப்புடன் ஒரு அடிப்படை HTML கோப்பை உருவாக்கினோம்** +- **நேரடி மீண்டும் ஏற்றவும் சூடான மாடுல் மாற்றத்திற்கும் Vite மேம்பாட்டு சேவையைத் துவக்கினோம்** -#### வலை மேம்பாட்டுக்கான கட்டளை வரி கருவிகள் +#### வலை மேம்பாட்டுக்கான அவசியமான கட்டளை வரி கருவிகள் -| கருவி | நோக்கம் | உங்களுக்கு ஏன் தேவை | -|------|---------|------------------| -| **[Git](https://git-scm.com/)** | பதிப்பு கட்டுப்பாடு | மாற்றங்களை கண்காணிக்கவும், கூட்டான பணிகளுக்கு உதவவும், பணியை காப்பி வைக்கவும் | -| **[Node.js & npm](https://nodejs.org/)** | ஜாவாஸ்கிரிப்ட் ரன்டைம் மற்றும் பைக்கேஜ் மேலாண்மை | உலாவி வெளியே JS இயக்கு, நவீன மேம்பாட்டு கருவிகள் நிறுவு | -| **[Vite](https://vitejs.dev/)** | கட்டமைப்பு கருவி மற்றும் வலை சேவையகம் | அதி வேக மேம்பாட்டுநிலையில் hot module replacement | -| **[ESLint](https://eslint.org/)** | கோடு தரம் | உங்கள் ஜாவாஸ்கிரிப்ட் கோடுகளில் பிரச்சனைகளை தானாக கண்டுபிடித்து சரி செய்க | -| **[Prettier](https://prettier.io/)** | கோடு வடிவமைப்பு | உங்கள் கோடுகளை ஒரே மாதிரியாக வாசிக்க சுலபமாக வைத்திரு | +| கருவி | நோக்கம் | நீங்கள் ஏன் அதை வேண்டும்? | +|------|---------|-----------------| +| **[Git](https://git-scm.com/)** | பதிப்பு கட்டுப்பாடு | மாற்றங்களை கண்காணிக்க, மற்றவர்களுடன் இணைந்து பணியாற்ற, உங்கள் பணியை பின்நகல் எடுக்க | +| **[Node.js & npm](https://nodejs.org/)** | JavaScript ஓட்டுநான் மற்றும் தொகுப்பு மேலாண்மை | உலாவிகளைத் தாண்டி JavaScript இயக்கு, நவீன மேம்பாட்டு கருவிகளை நிறுவு | +| **[Vite](https://vitejs.dev/)** | கட்டுமான கருவி மற்றும் மேம்பாட்டு சேவை | சூடான மாடுல் மாற்றத்துடன் மிக வேகமான மேம்பாடு | +| **[ESLint](https://eslint.org/)** | குறியீடு தரம் | உங்கள் JavaScript இல் பிரச்சனைகளை தானாக கண்டறிந்து சரி செய் | +| **[Prettier](https://prettier.io/)** | குறியீடு வடிவமைப்பு | குறியீட்டை ஒரே மாதிரியான முறையில் தெளிவாக வைக்கவும் | -#### தனிப்பட்ட தளங்கள் விருப்பங்கள் +#### தளம்-நਿਰ்ப்பப பிதாவு **Windows:** - **[Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)** - நவீன, அம்சமிக்க டெர்மினல் @@ -652,203 +647,201 @@ npx vite - **[Command Prompt](https://docs.microsoft.com/windows-server/administration/windows-commands/?WT.mc_id=academic-77807-sagibbon)** 💻 - பாரம்பரிய Windows கட்டளை வரி **macOS:** -- **[Terminal](https://support.apple.com/guide/terminal/)** 💻 - உடனடியாக கிடைக்கும் டெர்மினல் செயலி -- **[iTerm2](https://iterm2.com/)** - மேம்பட்ட அம்சங்களுடன் டெர்மினல் +- **[Terminal](https://support.apple.com/guide/terminal/)** 💻 - ஏற்கனவே உள்ள டெர்மினல் செயலி +- **[iTerm2](https://iterm2.com/)** - மேம்படுத்தப்பட்ட, முன்னணி அம்சங்கள் கொண்ட டெர்மினல் **Linux:** -- **[Bash](https://www.gnu.org/software/bash/)** 💻 - நிலையான Linux ஷெல் -- **[KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)** - மேம்பட்ட டெர்மினல் எமுலேட்டர் +- **[Bash](https://www.gnu.org/software/bash/)** 💻 - ஸ்டாண்டர்ட் லினக்ஸ் ஷெல் +- **[KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)** - மேம்படுத்தப்பட்ட டெர்மினல் எமுலேட்டர் > 💻 = இயங்குதளத்தில் முன்பே நிறுவப்பட்டுள்ளது -> 🎯 **கற்றல் பாதை**: `cd` (கோப்புறை மாற்றம்), `ls` அல்லது `dir` (கோப்புகள் பட்டியல்), `mkdir` (கோப்புறை உருவாக்கல்) போன்ற அடிப்படை கட்டளைகளுடன் துவங்குங்கள். பிறகு `npm install`, `git status`, மற்றும் `code .` (தற்போது கோப்புறை VS Code-ல் திறக்கும்) போன்ற நவீன கட்டளைகளை முயற்சி செய்யவும். அதிக நெருக்கமாக கற்றுக்கொள்ளும்போது, நீங்கள் தானாகவே மேம்பட்ட கட்டளைகள் மற்றும் தானியங்கி தொழில்நுட்பங்களை கற்றுக்கொள்ளுவீர்கள். +> 🎯 **கற்றல் பாதை**: அடிப்படையான கட்டளைகள் `cd` (அடைவை மாற்று), `ls` அல்லது `dir` (கோப்புகளை பட்டியலிடு), மற்றும் `mkdir` (அடைவை உருவாக்கு) போன்றவற்றுடன் தொடங்கி பயிற்சி செய்யவும். நவீன வேலைநூல் கட்டளைகள் `npm install`, `git status`, மற்றும் `code .` (தற்போதுள்ள அடைவை VS Code இல் திறக்க) ஆகியவற்றை முயற்சி செய்யவும். உங்களுக்கு முழுமையான அனுபவம் வந்ததும், நீங்கள் இயல்பாக மேம்பட்ட கட்டளைகள் மற்றும் தானியங்கி முறைகளை கற்றுக்கொள்ளுவீர்கள். -### ஆவணங்கள்: எப்போதும் கிடைக்கும் உங்கள் கற்றல் மன்றம் +### ஆவணம்: எப்போதும் கிடைக்கும் கற்றல் வழிகாட்டி -சரி, ஒரு ரகசியத்தை பகிர்ச்செய்ய விரும்புகிறேன், இது நீங்கள் ஒரு ஆரம்ப நிலை மாணவர் என்ற உணர்வுக்கு மிகவும் உதவும்: மிக அனுபவசாலிகளான டெவலப்பர்கள் கூட பெரும்பாலான நேரம் ஆவணங்களைப் படிப்பதில் செலவிடுகிறார்கள். அதற்குக் காரணம் அவர்கள் என்ன செய்கிறார்கள் தெரியாமலில்லை என்பதல்ல; இது அறிவுத்திறனின் அடையாளம்! +சரி, எனக்கு ஒரு சிறிய ரகசியத்தை பகிர்ந்து கொடுக்கலாம், அது தொடக்கத்திலிருந்தும் பாதுகாப்பாக நீங்கள் உணர உதவும்: மிக அனுபவமிக்க மேம்பாட்டாளர்களும் தங்கள் நேரத்தின் பெரும்பகுதியை ஆவணங்கள் படிப்பதில் போகும். அது அவர்கள் என்ன செய்கிறார்கள் தெரியாதத்துக்காக அல்ல – அது அறிவுத்திறனின் குறியீடு! -ஆவணங்களை உலகின் மிகவும் பொறுமையான, அறிவுமிக்க ஆசிரியர்களாகக் கருதுங்கள், அவர்கள் 24/7 க beschikbaar. இரவில் 2 மணிக்கு பிரச்சனையில் சிக்கினீர்களா? ஆவணங்கள் உங்களுக்கு ஒரு வொளி அன்பு வழங்கி நீங்கள் தேவைப்படுகிற சரியான பதிலை தரும். அனைவரும் பேசும் புதிய அம்சத்தை கண்டுபிடிக்க விரும்புகிறீர்களா? ஆவணங்களில் படி படியான எடுத்துக்காட்டுகள் உள்ளன. ஏன் ஒரு விஷயம் அதேபோல் செயல்படுகிறது என்று அறிய விரும்புகிறீர்களா? சரி, ஆவணத்தைப் பாருங்கள், அது தெளிவான விளக்கத்துடன் இருக்கிறது! +ஆவணம் என்பது உலகின் மிகவும் பொறுமையான, அறிவுள்ள ஆசிரியை போல அவர்களது 24/7 கிடைக்கும் உதவியாக நினைத்துக் கொள்ளுங்கள். இரவு 2 மணிக்கு ஒரு பிரச்சனையில் சிக்கினால்? ஆவணம் உங்களுக்கு ஒரு சூடான உரை அணைத்தல் மற்றும் தேவையான முற்றிலும் சரியான விடையை அளிக்கும். அனைவரும் பேசும் புதிய அம்சங்கள் பற்றி அறிய விரும்பினால்? ஆவணம் படிமுறை விளக்கங்களுடன் உங்கள் பக்கம் இருக்கும். ஏன் அது அப்படியே வேலை செய்கிறது என்று புரிந்து கொள்ள முயற்சிப்பீர்களா? உங்கள் கணக்கில் அது கிளிக் செய்யும் விதமாக அணுகத்தை எடுத்துச் சொல்கிறது! -என்னுடைய பார்வையை முற்றிலும் மாற்றிய ஒன்று: வலை மேம்பாட்டு உலகம் மிக வேகமாக நகர்கிறது, ஒரு நபரும் (முடிந்தவர்வும்) எல்லாவற்றையும் நினைவில் வைத்திருக்க முடியாது. 15 ஆண்டுகளுக்கு மேல் அனுபவம் உள்ள மூத்த டெவலப்பர்கள் அடிப்படை சீரான வசனங்களையும் தேடிப் பார்க்கின்றனர், அது அவமானகரமாக இல்லை – அது புத்திசாலித்தனமானது! அது ஒரு மேலான நினைவில் வைத்துக்கொள்ளல் அல்ல; அது சரியான பதில்களை எங்கேப் பெறுவது மற்றும் அவற்றைக் எவ்வாறு பயன்படுத்துவது என்பதை அறிதல். +இங்கு என்னை முழுமையாக மாற்றிய ஒரு விஷயம்: வலை மேம்பாட்டுக்கூட உலகம் மிக வேகமாக நகர்கிறது, எந்த மனிதனும் (எல்லாம் அல்லாமல்!) அனைத்தையும் மனதில் வைத்திருக்க முடியாது. 15+ ஆண்டு அனுபவம் கொண்ட மூத்த வலைமேம்பாட்டாளர்கள் கூட அடிப்படை வடிவமுறை syntax-ஐ தேடுவதை பார்த்துள்ளேன், அது கூட்டாசுக்கானது அல்ல – அது அறிவே! -**முதலில் உண்மையான மகிமை :** +**உண்மையான மாயை நிகழும் இடம் இங்கே:** -தொழில்முறை டெவலப்பர்கள் பெரும்பாலான நேரத்தை ஆவணங்களைப் படிப்பதில் செலவிடுகிறார்கள் – அவர்கள் தகவல் தெரியாமலல்ல, ஆனால் யூத்தில் வலை மேம்பாடு இடர்பாடுகளுக்கு மாறுகின்றது என்பதால் தொடர்ந்த கற்றல் அவசியம் ஆகிறது. சிறந்த ஆவணங்கள் எப்படி பயன்படுத்துவது மட்டும் அல்ல, ஏன் மற்றும் எப்போது பயன்படுத்துவது என்பதையும் புரிய விடுகிறது. +தொழில்முறை மேம்பாட்டாளர்கள் அவர்களது நேரத்தின் ஒரு முக்கிய பகுதியை ஆவணங்களைப் படிப்பதில் செலவிடுகிறார்கள் – ஏன் அவர்களது செய்கின்றதைத் தெரியவில்லை எனக்குக் கூட அல்ல, ஆனால் வலை மேம்பாட்டுக்கான சூழல் அதிவேகமாக மாறுவதால் புதியதை தொடர்ந்து கற்றுக்கொள்வது அவசியம். சிறந்த ஆவணங்கள் *எப்படிச்* பயன்படுத்துவது மட்டுமல்ல *ஏன்* மற்றும் *எப்போது* பயன்படுத்துவது என்பதையும் புரிய உதவும். -#### முக்கிய ஆவணங்கள் மூலம் +#### அவசியமான ஆவண வளங்கள் **[Mozilla Developer Network (MDN)](https://developer.mozilla.org/docs/Web)** -- வலை தொழில்நுட்ப ஆவணங்களுக்கு தங்க நிலை -- HTML, CSS, JavaScript-க்கு விரிவான வழிகாட்டிகள் -- உலாவி பொருத்த தன்மை தகவல்கள் -- நடைமுறை எடுத்துக்காட்டுகள் மற்றும் தொடர்புடைய டெமோக்கள் +- வலை தொழில்நுட்ப ஆவணங்களுக்கு தங்கக் கோவை +- HTML, CSS, மற்றும் JavaScript க்கு விரிவான வழிகாட்டிகள் +- உலாவி பொருத்தப்படல் தகவல் உட்பட +- நடைமுறைக்கான உதாரணங்கள் மற்றும் பரிணாம காட்சிகள் -**[Web.dev](https://web.dev)** (Google வழங்குகிறது) -- நவீன வலை மேம்பாட்டு சிறந்த செயல்முறைகள் -- செயல்திறன் சிறப்பாக்க வழிகாட்டிகள் -- அணுகலும் ஒருங்கிணைந்த வடிவமைப்பும் -- உண்மையில் பயன்பட்ட திட்டங்கள் ஆய்வுகள் +**[Web.dev](https://web.dev)** (Google வழங்கியது) +- நவீன வலை மேம்பாட்டுத் தேவைகள் +- செயல்திறன் மேம்பாட்டு வழிகாட்டிகள் +- அணுகல் மற்றும் உள்ளடக்கத்திற்கான வடிவமைப்பு கொள்கைகள் +- உண்மையான திட்டங்களின் வழக்கக் காட்சிகள் **[Microsoft Developer Documentation](https://docs.microsoft.com/microsoft-edge/#microsoft-edge-for-developers)** -- எட்ஜ் உலாவி மேம்பாட்டு வளங்கள் -- முன்னேற்றமான வலை பயன்பாடுகள் கையேடுகள் -- பன்முக மேம்பாடு தகவல்கள் +- Edge உலாவி மேம்பாட்டு வளங்கள் +- முன்நிலை வலை செயலிகள் வழிகாட்டிகள் +- பல தள மேம்பாட்டு உள்ளுணர்வுகள் **[Frontend Masters Learning Paths](https://frontendmasters.com/learn/)** -- அமைக்கப்பட்ட கற்றல் படிகள் -- தொழில்துறை நிபுணர்களின் வீடியோ பாடங்கள் -- நேரடி கோடு பயிற்சிகள் +- கட்டமைக்கப்பட்ட கற்றல் பாடத்திட்டங்கள் +- தொழில்முறை வல்லுநர்களின் வீடியோ கற்கைகள் +- நெறிமுறை குறியீடு பயிற்சிகள் -> 📚 **கற்றல் வழிமுறை**: ஆவணங்களை நினைவில் வைக்க முயற்சிக்க வேண்டாம் – அதற்குப் பதிலாக திறம்பட அணுக கற்றுக்கொள்ளுங்கள். அடிக்கடி பயன்படுத்தப்படும் குறிப்புகளை புத்தகக்குறிப்புகளாக வை மற்றும் தேடல் செயல்பாடுகளை பயன்படுத்தி விரைவில் தகவலைக் கண்டுபிடிக்க பயிற்சி செய்யுங்கள். +> 📚 **கற்றல் தந்திரம்**: ஆவணம் பூர்த்தியாக நினைக்க வேண்டாம் – அதனை நுட்பமாக பயிர்ச்சி செய்ய கற்றுக் கொள்ளுங்கள். அடிக்கடி பயன்படுத்தும் தகவல் தொகுப்புகளை புத்தக குறியீட்டில் சேமிக்கவும் மற்றும் விரும்பிய தகவல்களை விரைவில் கண்டுபிடிக்க தேடல் செயல்பாடுகளை உபயோகிக்கவும் பழக்கம் படையுங்கள். -### 🔧 **கருவி திறம்பட பயன்படுத்தல்: உங்களுக்கு என்ன உகந்தது?** +### 🔧 **கருவி நுட்பம் சோதனை: உங்களை மயக்கும் என்ன?** -**ஒரு நிமிடம் எடுத்துக் கொண்டு பரிசீலிக்கவும்:** -- முதலில் எந்த கருவியை முயற்சி செய்ய மிகவும் ஆவலாக இருக்கின்றீர்கள்? (தவறான பதில் இல்லை!) -- கட்டளை வரி இன்னும் பயங்கரமாக உணரப்படுகிறதா, அல்லது அதைத்தான் ஆராய விரும்புகிறீர்களா? -- உங்களுக்கு பிடித்த வலைத்தளங்களுக்கு பின்னால் உலாவி DevTools பயன்படுத்தி பார்ப்பதைக் கற்பனை செய்ய முடியுமா? +**ஒரு நிமிடம் எடுத்துக் கொள்ளவும்:** +- முதலில் எந்த கருவியை மிக ஆவலுடன் முயற்சிக்கப் போகிறீர்கள்? (தவறான பதில் இல்லை!) +- கட்டளை வரி இன்னும் அச்சுறுத்துகிறதா, அல்லது அதில் ஆர்வமா இருக்கிறீர்கள்? +- உங்களது பிடித்த வலைத்தளங்களை பின்னணி முழுக்க காண உலாவி DevTools உபயோகிப்பதை நினைத்திருக்கிறீர்களா? ```mermaid -pie title "செயல்பாட்டாளர் கருவிகளுடன் செலவிடும் நேரம்" - "குறியீட்டு ஆசிரியர்" : 40 - "உலாவி சோதனை" : 25 - "கட்டளை வரி" : 15 - "ஆவணங்களை படிக்கும்" : 15 - "தனிமைப்படுத்தல்" : 5 +pie title "கருவிகளுடன் டெவலப்பர் செலவிட்ட நேரம்" + "கோட் எடிட்டர்" : 40 + "பிரௌசர் சோதனை" : 25 + "கமாண்ட் லைன்" : 15 + "ஆவணங்களை படித்தல்" : 15 + "பிழைத்திருத்தல்" : 5 ``` -> **சுவாரஸ்யமான தகவல்**: அதிகமான டெவலப்பர்கள் தங்களது கோடு எடிட்டரில் சுமார் 40% நேரம் செலவிடுகிறார்கள், ஆனால் சோதனை, கற்றல் மற்றும் பிரச்சனை தீர்க்கும் நேரத்தில் கூட கவனம் செலுத்துகிறார்கள். நிரலாக்கம் என்பது கோடு எழுதுதல் மட்டுமல்ல – அது அனுபவங்களை வடிவமைத்தல்! +> **உணர்வுப்பூர்வமான தகவல்**: பெரும்பாலான மேம்பாட்டாளர்கள் சுமார் 40% நேரத்தை குறியீடு எடிட்டரில் செலவாக்குகின்றனர், ஆனால் சோதனை, கற்றல் மற்றும் பிரச்சனைகளைத் தீர்க்கும் நேரம் எவ்வளவு என்பதை கவனித்தீர்களா. நிரல் எழுதுவது மட்டுமல்ல – அனுபவங்களை உருவாக்குவதும் ஆகும்! -✅ **தியாக உணவு**: வலைதளங்கள் உருவாக்க பயன்படுத்தப்படும் கருவிகள் (development) மற்றும் அவை எப்படி தோற்றமளிப்பதை வடிவமைக்கும் கருவிகள் (design) மத்தியில் எவ்வளவு வேறுபாடு இருக்கலாம் என்று சிந்திக்கவும்! இது அழகான வீடு வடிவமைக்கும் ஒருவனும், அதை கட்டுவோர் வேறுபடும் மாதிரி தான். இருவரும் முக்கியமானவர்கள், ஆனால் அவற்றிற்கு வேறுபட்ட கருவிகள் தேவை! இந்த எண்ணம் உங்களுக்கு இணையதளங்கள் எப்படி உருவாக்கப்படுகின்றன என்று பெரிய படத்தை பார்க்க உதவும். +✅ **ஆராய்ச்சிக்கான உணவு**: வலைத்தளங்களை உருவாக்கும் கருவிகள் (மேம்பாடு) மற்றும் அவை எப்படி தோன்றுகின்றன என்று வடிவமைக்கும் கருவிகள் (வடிவமைப்பு) வேறுபடுவது போல் இருக்குமா? அது ஒரு அழகான வீட்டை வடிவமைக்கும் வடிவமைப்பாளரும், அதை கட்டும் தரகரும் இடையிலான வேறுபாடு போலவே. இருவரும் முக்கியம், ஆனால் வேறு கருவிகள் தேவை! இவ்வாறு சிந்திப்பது வலைத்தளங்கள் எப்படி உருவாகின்றன என்பதை விரிவாகப் புரிந்து கொள்ள உதவும். ## GitHub Copilot Agent சவால் 🚀 -Agent முறையைப் பயன்படுத்தி கீழ்க்காணும் சவாலை நிறைவேற்றுங்கள்: +Agent முறையைப் பயன்படுத்தி கீழ்காணும் சவாலை முடிக்கவும்: -**விளக்கம்:** ஒரு நவீன கோட் எடிட்டர் அல்லது IDE இன் அம்சங்களை ஆராய மற்றும் அது உங்கள் வேலைசுற்றத்தை எப்படி மேம்படுத்த முடியும் என்பதை நிரூபியுங்கள். +**விளக்கம்:** நவீன குறியீடு எடிட்டர் அல்லது IDE இன் அம்சங்களை ஆராய்ந்து, அது உங்கள் வேலைப்பாட்டை எப்படி மேம்படுத்துகிறது என்பதைக் காட்டவும். -**உள்ளீடு:** Visual Studio Code, WebStorm அல்லதுCloud-அடிப்படையிலான IDE போன்ற எந்த ஒரு கோட் எடிட்டர் அல்லது IDEயைத் தேர்வு செய்யவும். மூன்று அம்சங்கள் அல்லது விரிவாக்கங்களை பட்டியலிடுங்கள், அவை உங்கள் கோடு எழுதும், பிழைகள் திருத்தும் அல்லது பராமரிப்பதில் பிடிவாதமாக உதவுகிறன. ஒவ்வொன்றும் உங்கள் வேலைசுற்றத்திற்கு எப்படி உதவுகிறது என்பதற்கான சுருக்க விளக்கத்தினை கொடுங்கள். +**சுட்டுரை:** Visual Studio Code, WebStorm அல்லது மேக தள IDE போன்ற குறியீடு எடிட்டர் அல்லது IDE ஐ தேர்ந்தெடுத்து, குறியீடு எழுதுவதை, டிபக் செய்யுவதை, அல்லது பராமரிப்பதைச் சரிசெய்யும் மூன்று அம்சங்கள் அல்லது நீட்டிப்புக்களை பட்டியலிடவும். ஒவ்வொன்றுக்கும் அது உங்கள் வேலைப்பாட்டிற்கு எப்படி உதவுகிறது என்பதைக் குறுந்தகவலுடன் வழங்கவும். --- ## 🚀 சவால் -**சரி, டிடெக்டிவ், உங்கள் முதல் வழக்குக்கு தயார்?** +**சரி, துப்பறிவுத் தொழிலாளரே, உங்கள் முதல் வழக்குக்கு தயாரா?** -இப்போது நீங்கள் இந்த அற்புதமான அடிப்படை வைத்துள்ளீர்கள், நான் உங்களுக்கு ஒரு சவாலை கொடுக்கிறேன், அது நிரூபிக்கும் எப்படி பிரോഗிராமிங் உலகம் அளவிலும் அற்புதமாக வேறுபடுகிறது மற்றும் அசத்தலானது என்பதை. கவனத்துடன் கேளுங்கள் – இது இன்னும் கோடு எழுதுவதற்கானது இல்லை, ஆகையால் அழுத்தம் தேவையில்லை! நீங்கள் ஒரு நிரலாக்க மொழி டிடெக்டிவ் ஆக உங்கள் முதல் மிக ஆவலான வழக்கில் இருப்பதாக நினைக்கவும்! +இந்த அற்புத அடித்தளத்தை நீங்கள் பெற்றுவிட்டீர்கள், இப்போது நான் ஒரு சவாலை கொடுக்கிறேன், அது நிரல் உலகம் எவ்வளவு விரிவானதும் விசித்திரமானதுமோ என்பதை பார்க்க உதவும். கேள் – இது இன்னும் குறியீடு எழுதும் நேரம் அல்ல, அதனால் இங்கே அழுத்தம் இல்லை! நீங்கள் ஒரு நிரல் மொழி விசாரணையாளர் போல உங்கள் முதல் அதிரடியான வழக்குக்கு தயாராகுங்கள்! -**உங்கள் பணி, நீங்கள் ஏற்க விரும்பினால்:** -1. **மொழி ஆராய்ச்சியாளர் ஆகவும்**: முற்றிலும் வேறுபட்ட மூன்று நிரலாக்க மொழிகளைத் தேர்வுசெய்யவும் – ஒருவேளை ஒன்று இணையதளங்கள் செய்தல், ஒன்று மொபைல் செயலிகள் உருவாக்கல் மற்றும் மற்றொன்று விஞ்ஞானிகளுக்கான தரவு ஆய்வு. ஒவ்வொரு மொழியிலும் ஒரே எளிமையான பணிக்கான எடுத்துக்காட்டுகளைத் தேடுங்கள். நான் உங்களுக்காக உறுதி செய்கிறேன், இவை எப்படி மிகவும் வேறுபடுகிறது என்று கண்டால் நீங்கள் அச்சமைவீர்கள்! +**உங்கள் பணி, நீங்கள் ஏற்றுக்கொண்டால்:** +1. **மொழி ஆராய்ச்சியாளர் ஆனால்**: முற்றிலும் வேறுவகையான உலகங்களிலிருந்து மூன்று நிரல் மொழிகளைத் தேர்ந்தெடுக்கவும் – ஒருதலை الموقع ٺاهும், மற்றொன்று மொபைல் செயலிகளை உருவாக்கும், மற்றும் இன்னொன்று விஞ்ஞானிகளுக்கான தரவை நுட்பமாய் இனையாக்கும். ஒவ்வொரு மொழியிலும் ஒரே எளிய பணியை எழுதிய உதாரணங்களை தேடுங்கள். நான் வாக்குறுதி தருகிறேன், ஒரே பணியை செய்வதிலும் அவற்றின் தோற்றம் எவ்வளவு வேறுபடுகிறது என்பதை தெரிந்துகொள்ள மிக அதிர்ச்சியடைவீர்கள்! -2. **அவர்கள் தோற்ற கதை கண்டுபிடிக்கவும்**: ஒவ்வொரு மொழியும் என்ன சிறப்பு? ஒவ்வொரு நிரலாக்க மொழியும் “ஓர் குறிப்பிட்ட பிரச்சனையை தீர்க்க சிறந்த வழி இதுதான்” என்று யாராவது நினைத்ததால் உருவானது. அதெல்லாம் கண்டுபிடிக்க முயற்சியுங்கள்! சில கதைகள் மிகவும் பரபரப்பானவை! +2. **அவற்றின் தோற்றக் கதைகளை அறிந்து கொள்ளுங்கள்**: ஒவ்வொரு மொழியும் என்னால் தனித்துவமாக இருக்கிறது? அற்புதமான கூற்று – ஒவ்வொரு நிரல் மொழியும் உருவானது ஏன் என்றால் ஒருவர் "இந்த குறிப்பிட்ட பிரச்சனையை தீர்க்க வேறு சிறந்த வழி இருக்க வேண்டும்" என்று நினைத்தார். அந்த பிரச்சனைகள் என்னவென்று நீங்கள் கண்டுபிடிக்க முடியுமா? சில கதைகள் உண்மையில் திருப்திகரமானவை! -3. **கூட்டமைப்புகளை சந்திக்கவும்**: ஒவ்வொரு மொழியின் சமூகத்தையும் பாருங்கள் அவை எவ்வளவு வரவேற்கின்றன மற்றும் ஈடுபட்டுள்ளன. சிலருக்கு கோடி டெவலப்பர்கள் பரஸ்பர உதவி செய்கின்றனர், மற்றவர்கள் சிறிய ஆனால் ஒன்றிணைந்த, ஆதரவான சமூகங்கள். இந்த வேறுபட்ட தன்மைகள் பார்த்து ரசிக்கப் போகிறீர்கள்! +3. **சமூகங்களை சந்தியுங்கள்**: ஒவ்வொரு மொழியின் சமூகமும் எவ்வளவு வரவேற்கும் மற்றும் உற்சாகமாக உள்ளனர் என்பதைப் பாருங்கள். சில உள்ளனர் கோடிக்கணக்கான மேம்பாட்டாளர்களோடு பகிர்ந்துகொள்கின்றனர் மற்றும் ஒருவருக்கொருவர் உதவுகின்றனர், சில சிறியவையாக இருப்பினும் பக்கசார தீராத ஒருமை உடைந்த சமூகமாகவும் உள்ளனர். இந்த சமூகங்களின் வெவ்வேறு பண்புகளைப் பார்ப்பதை நீங்கள் ரசிப்பீர்கள்! -4. **உங்கள் உள்ளுணர்வை பின்பற்றவும்**: எந்த மொழி தற்போது உங்களுக்கு எளிதாக தோன்றுகிறது? "சரியான" தெரிவை மட்டும் கவலைப்பட வேண்டாம் – உள்ளுணர்வை கேளுங்கள்! இங்கு தவறான பதில் இல்லாமல், பிறகு நீங்கள் வேறு மொழிகளையும் ஆராயலாம். +4. **உளர்வை பின்பற்றுங்கள்**: இப்போது எந்த மொழி உங்களுக்கு மிகவும் அணுகக்கூடியதாக தோன்றுகிறது? "சரியான" தேர்வாக செய்ய உங்களுக்கு பளபளப்பு தேவையில்லை – உங்கள் உணர்வுகளை கேளுங்கள்! இங்கே தவறான பதில் இல்லையே, பின்னர் பிறவற்றைப் பற்றியும் ஆராயலாம். -**போனஸ் டிடெக்டிவ் வேலை**: ஒவ்வொரு மொழியிலும் எந்த முக்கிய இணையதளங்கள் அல்லது செயலிகள் உருவாக்கப்பட்டுள்ளன என்பதைத் தெரிய முயற்சி செய்யுங்கள். Instagram, Netflix அல்லது நீங்கள் நிறுத்த முடியாத அந்த மொபைல் விளையாட்டு எந்த மொழியால் இயங்குகிறது என்பதை அறிந்தால் அதிர்ச்சியடைவீர்கள்! +**கூடுதல் விசாரணை வேலை**: ஒவ்வொரு மொழியிலும் முக்கியமான வலைத்தளங்கள் அல்லது செயலிகள் எவை உருவாக்கப்படுகின்றன என்று கண்டுபிடிக்க முயற்சிக்கவும். Instagram, Netflix, அல்லது நீங்கள் நிறுத்த முடியாத அந்த மொபைல் விளையாட்டை இயக்கின பற்றிய ஆச்சரியமான தகவல்களை அறிய நீங்கள் ரெடியாக இருக்க வேண்டும்! -> 💡 **மறக்காதீர்கள்**: இன்று நீங்கள் எந்த மொழியிலும் உள்நுண்ணறிவு நிபுணராக ஆக முயற்சிக்கவில்லை. நீங்கள் அங்குள்ள சமூகத்தைக் கற்றுக்கொள்ளப் போகிறீர்கள். நேரத்தை எடுத்துக்கொள்ளவும், அதை ரசிக்கவும், ஆர்வம் வழிவகுக்கும்! +> 💡 **நினைவில் வைக்கவும்**: நீங்கள் இன்று எந்த மொழியிலும் நிபுணராக ஆக முயற்சிக்கவில்லை. நீங்கள் இவ்வளைவுகளை அறிந்து, பின் எங்கு உங்கள் கடையை தொடங்கலாம் என்பதைத் தீர்மானிக்க முன், அந்த வயலில் சுற்றி பார்க்கிறீர்கள். நேரத்தை எடுத்துக் கொண்டு, அதை பொழுதுபோக்கு பரிமாறும் விதமாக ஆகவும் அனுபவிக்கவும், உங்கள் ஆர்வம் உங்களை வழிநடத்தட்டும்! -## நீங்கள் கண்டுபிடித்ததை கொண்டாடுவோம்! +## நீங்கள் கண்டுபிடித்தவற்றை கொண்டாடுவோம்! -அருகமுள்ளதைப் பார்த்தேன்! நீங்கள் இன்று நம்பகத்தக்க அளவில் பல அற்புத தகவல்களை உறிஞ்சிக்கொண்டிருக்கிறீர்கள்! நான் உண்மையில் ஆவலுடன் இருக்கிறேன் உங்கள் பயணத்தில் இதுவரை எவ்வளவு தகவல்கள் உறுதியாக நிற்கின்றன என்பதைப் பார்ப்பதில். நினைவில் வையுங்கள் – இது ஒரு பரீட்சை அல்ல, எதையும் சரியாகச் செய்ய வேண்டியதில்லை. இது நீங்கள் கற்றுக்கொண்ட அருமையான விஷயங்களின் கொண்டாட்டம்! +ஓ மைக்கேல், இன்று நீங்கள் மிக அதிர்ஷ்டமான தகவல்களை கடுமையாக உறிஞ்சித்துள்ளீர்கள்! நான் உண்மையாகவே ஆச்சரியப்படுகிறேன், இந்த அற்புத பயணம் உங்களுடன் எவ்வளவு உறுதி செய்து நிற்கிறது என்பதைப் பார்க்க. நினைவில் வைத்துக் கொள்ளுங்கள் – இது எல்லாமே சரியாக செய்ய வேண்டிய ஒரு தேர்வல்ல. உங்கள் இன்பமான உலகத்தை பற்றி நீங்கள் கற்றிய அனைத்து அற்புதமான விஷயங்களுக்கான கொண்டாட்டம் இது! -[பாடம் முடிவுப் பரீட்சையை எடுத்து பாருங்கள்](https://ff-quizzes.netlify.app/web/) -## பரிசீலனை மற்றும் சுயபாடம் +[பாடநிறைவு சீர்வரிசை](https://ff-quizzes.netlify.app/web/) -**இதனை ஆராய்ந்து மகிழ்ச்சி கொண்டாட உங்கள் நேரத்தை எடுத்துக் கொள்ளுங்கள்!** +## ஆய்வு மற்றும் சுயபயிற்சி -நீங்கள் இன்று அதிக அளவு கற்றுக்கொண்டுள்ளீர்கள், இது பெருமைக்குரியது! இப்போது சுவாரஸ்யமான பகுதி வருகிறது – உங்கள் ஆர்வத்தை எழுப்பிய தலைப்புக்களை ஆராய்வது. இது வீட்டுப்பாடம் அல்ல – இது ஒரு சாகசம்! +**நேரத்தை எடுத்துக் கொண்டே ஆராயவும், அனுபவிக்கவும்!** +இன்று நீங்கள் நிறைய விஷயங்களை கவர்ந்தீர்கள், அது பெருமைக்குரியது! இப்போது வேடிக்கை பகுதி - உங்கள் ஆர்வத்தை கிளப்பிய தலைப்புகளை ஆராய்வது. இது வீட்டுப்பயிற்சி அல்ல என்பதை நினைவில் வைக்கவும் – இது ஒரு சாகசம்! -**உங்களை உற்சாகப்படுத்தும் விஷயங்களில் ஆழமாக கலந்துகொள்ளுங்கள்:** +**உங்களை ஏமாற்றியதை மேலும் ஆழமாக ஆராயுங்கள்:** -**ப்ரோகிராமிங் மொழிகளுடன் கைமுறை அனுபவம் பெறுங்கள்:** -- உங்களின் கவனத்தை ஈர்த்த 2-3 மொழிகளின் அதிகாரபூர்வ வலைத்தளங்களை பார்வையிடுங்கள். ஒவ்வொன்றுக்கும் தனிப்பட்ட தன்மை மற்றும் கதை உள்ளது! -- [CodePen](https://codepen.io/), [JSFiddle](https://jsfiddle.net/), அல்லது [Replit](https://replit.com/) போன்ற ஆன்லைன் கோடிங் விளையாட்டு தளங்களை முயற்சிக்கவும். பயப்படாமல் பரிசோதனை செய்யுங்கள் – எதையும் கெடுக்க முடியாது! -- உங்கள் பிடித்த மொழி எப்படி உருவானது என்பதைப் பற்றி படியுங்கள். உண்மையில், சில ஆரம்பநலகதைகள் நன்றாகவே சுவையானவை மற்றும் மொழிகள் எப்படி செயல்படுகின்றன என்பதுக்கு புரிதலை வழங்கும். +**பிரோகிராமிங் மொழிகளுடன் கைகளைக் கையாளவும்:** +- உங்கள் கவனத்தை ஈர்த்த 2-3 மொழிகளின் அதிகாரப்பூர்வ வலைத்தளங்களை பார்வையிடுங்கள். ஒவ்வொன்றுக்கும் தனித்துவமான தன்மை மற்றும் கதை உள்ளது! +- [CodePen](https://codepen.io/), [JSFiddle](https://jsfiddle.net/), அல்லது [Replit](https://replit.com/) போன்ற ஆன்லைன் குறியீட்டு விளையாட்டுப்பிடிப்புகளை முயற்சிக்கவும். தோற்றுவிக்கவேண்டாம் – நீங்கள் எதையும் சேதமாக்க முடியாது! +- உங்கள் பிடித்த மொழி எப்படி உருவெடுத்தது என்பதைப் பற்றி படியுங்கள். மேலும், சில துவக்கக் கதைகள் மிகவும் பண்பட்டவை மற்றும் மொழிகள் ஏன் அந்த விதமாக இயங்குகின்றன என்பதைப் புரிந்துகொள்ள உதவும். **புதிய கருவிகளுடன் பழகுங்கள்:** -- இன்னும் இல்லையெனில் Visual Studio Code ஐ பதிவிறக்கிவிடுங்கள் – இது இலவசம், மேலும் நீங்கள் இதனை விரும்பப்போகிறீர்கள்! -- விரிவாக்கங்கள் சந்தையை சில நிமிடங்கள் உலாவுங்கள். இது உங்கள் குறியீட்டு ஆசிரியருக்கான ஒரு அப்பிளிகேஷன் സൂடாக உள்ளது! -- உங்கள் உலாவியின் Developer Tools ஐத் திறந்து கிளிக் செய்யுங்கள். எல்லாவற்றையும் புரிந்து கொள்வதில்லை என்று கவலைப்பட வேண்டாம் – உள்ளதைப் பற்றி பழகுங்கள். - -**சமூகத்திற்கு சேர்ந்துகொள்ளுங்கள்:** -- [Dev.to](https://dev.to/), [Stack Overflow](https://stackoverflow.com/), அல்லது [GitHub](https://github.com/) போன்ற டெவலப்பர் சமூகங்களை பின்தொடருங்கள். ப்ரோகிராமிங் சமூகம் புதியவர்களை மிகவும் வரவேற்கிறது! -- YouTube இல் ஆரம்ப நிலை கோடிங் காணொளிகளைப் பார்க்கவும். அங்கே ஆர்வமுள்ள அக்கறை கொண்ட அருமையான உருவாக்குநர்கள் நிறையருக்கின்றனர். -- உள்ளூர் சந்திப்புக்கள் அல்லது ஆன்லைன் சமூகங்களில் சேர்வதைக் கருதுங்கள். நம்புங்கள், டெவலப்பர்களுக்கு புதியவர்களுக்கு உதவ விருப்பம் உள்ளனர்! - -> 🎯 **உங்கள் நினைவில் வைத்துக்கொள்ள இந்தச் செய்தி**: நீங்கள் ஒரே நாளில் ஒரு கோடிங் மேதை ஆகும் என்று எதிர்பார்க்கப்படவில்லை! இப்போது, நீங்கள் இந்த அற்புதமான புதிய உலகத்தை அறிமுகப்படுத்திக்கொண்டிருக்கிறீர்கள். உங்கள் நேரத்தை எடுத்துக் கொள்ளுங்கள், பயணத்தை அனுபவியுங்கள், மேலும் நினைவில் வைக்கவும் – நீங்கள் ரசிக்கும் ஒவ்வொரு டெவலப்பருமாக இருந்தவர்கள் ஒருநாள் நீங்கள் இருக்கிற இடத்தில் இருந்தார்கள், உற்சாகமாகவும் சிறிது குழப்பமாகவும் உணர்ந்தார்கள். இது இயற்கையானது, மேலும் நீங்கள் சரியாக செயல்பட்டு வருகிறீர்கள்! +- Visual Studio Code ஐ இன்னும் பதிவிறக்கம் செய்யவில்லை என்றால், அதை பதிவிறக்குங்கள் – அது இலவசமாகும் மற்றும் நீங்கள் அதை விரும்பப்போகிறீர்கள்! +- விரிவாக்கங்கள் சந்தைபதிவைக் குளாயுங்கள். அது உங்கள் குறியீட்டு தொகுப்பாளருக்கான செயலி கடை போன்றது! +- உங்கள் உலாவி வளைமுறை கருவிகள் (Developer Tools) ஐத் திறந்து சுற்றி கிளிக் செய்யவும். அனைத்தையும் புரிந்து கொள்வதில் கவலைப்படாதீர்கள் – பழகவேண்டும். +**சமுதாயத்தில் சேருங்கள்:** +- [Dev.to](https://dev.to/), [Stack Overflow](https://stackoverflow.com/), அல்லது [GitHub](https://github.com/) போன்ற டெவலப்பர் சமுதாயங்களை பின்தொடருங்கள். பிரோகிராமிங் சமுதாயம் புதியவர்களுக்கு மிகுந்த கொண்டாட்டம் செய்கிறது! +- YouTube இல் தொடக்கத் தெரியுமாறு உகந்த குறியீட்டு காணொளிகளை பாருங்கள். ஆரம்பிக்க விரும்பும் பல சிறந்த உருவாக்குநர்கள் அங்கு உள்ளனர். +- உள்ளூர் சந்திப்புகள் அல்லது ஆன்லைன் சமுதாயங்களில் சேர்வதை பரிசீலியுங்கள். நம்புங்கள், டெவலப்பர்கள் புதியவர்களை உதவ விரும்புகிறார்கள்! +> 🎯 **நான் உங்கள் மனதில் நிறுத்த விரும்புவது**: நீங்கள் ஒரே இரவுக்குள் குறியீட்டு மேதை ஆக வேண்டும் என எதிர்பார்க்கப்படவில்லை! இப்போது, நீங்கள் இந்த அற்புதமான புதிய உலகத்தை அறிந்துகொள்ள ஆரம்பிப்பதாகும். உங்கள் நேரத்தை எடுத்துக்கொள்ளுங்கள், பயணத்தை அனுபவிக்கவும், நினைவில் வைக்கவும் – நீங்கள் பாராட்டும் ஒவ்வொரு டெவலப்பரும் ஒருநாள் உங்களுக்கே இருப்பது போலவே அதிர்ச்சியுடன், சில நேரங்களில் கொஞ்சம் கலங்கியிருந்தனர். அது இயல்பானது, அதும் நீங்கள் சரியாக செய்கின்றீர்கள் என்பதற்கான சான்று! -## பணிமனை +## அசைன்மெண்ட் [Reading the Docs](assignment.md) -> 💡 **உங்கள் பணிக்கு ஒரு சிறிய தூண்டுதல்**: நாம் இன்னும் பேசிக்கொள்ளவில்லை என்ற சில கருவிகளை நீங்கள் ஆராய்ந்து பார்க்க விரும்புகிறேன்! முதல் நிலையில் பேசப்பட்டுள்ள ஆசிரியர்கள், உலாவிகள் மற்றும் கட்டளை வரி கருவிகளை தவிர்க்கவும் – அங்கே நிறைய அற்புதமான வளர்ச்சி கருவிகள் உள்ளன, அவை ஆராயப்படுவதை காத்திருக்கின்றன. பராமரிப்பு நன்றாக நடைபெறும் மற்றும் விளக்கமான பன்முக சமுதாயங்கள் உள்ள கருவிகளைத் தேடுங்கள் (இவை சிறந்த பாடங்களையும் தேவையான நேரத்தில் உதவக்கூடிய மக்களையும் கொண்டிருக்கின்றன). +> 💡 **உங்கள் அசைன்மெண்டிற்கு சிறிய ஊக்கமாக**: நாம் இன்னும் கவராத சில கருவிகளை நீங்கள் ஆராய்ந்து பார்க்க விரும்புகிறேன்! நாம் ஏற்கனவே பேசிய தொகுப்பிகள், உலாவிகள், கட்டளை வரி கருவிகளை தவிர்க்கவும் – அங்கு கிடைக்கும் அற்புதமான வளர்ச்சிக்கான கருவிகளின் முழு விசித்திரமான பிரபஞ்சம் உள்ளது. அவற்றில் செயல்படுத்தப்பட்டு வளர்ந்துவரும் சமுதாயங்கள் உடன் கூடியவை யாவும் மிக சிறந்த பாடங்கள் மற்றும் உதவிக்கரமானவர்கள் நிறைந்த வசதிகளை கொண்டிருக்கின்றன (நீங்கள் சிக்கலில் விழுந்து உதவி தேவைப்படும்போது). --- -## 🚀 உங்கள் ப்ரோகிராமிங் பயணம் காலவரிசை +## 🚀 உங்கள் பிரோகிராமிங் பயணத்தின் காலவரிசை ### ⚡ **அடுத்த 5 நிமிடங்களில் நீங்கள் செய்யக்கூடியவை** -- [ ] உங்கள் கவனத்தை ஈர்த்த 2-3 ப்ரோகிராமிங் மொழி வலைத்தளங்களை பக்கச்செல்லுங்கள் -- [ ] இன்னும் பெறவில்லை என்றால் Visual Studio Code ஐ பதிவிறக்கவும் -- [ ] உங்கள் உலாவியின் DevTools (F12) திறந்து எந்தவொரு வலைத்தளத்தையும் கிளிக் செய்யுங்கள் -- [ ] ஒரு ப்ரோகிராமிங் சமூகத்தில் சேர்ந்துகொள்ளுங்கள் (Dev.to, Reddit r/webdev, அல்லது Stack Overflow) - -### ⏰ **இந்த மணி நேரத்தில் நீங்கள் செய்யக்கூடியவை** -- [ ] பாடம் முடிந்த போது வினாடி வினா முடித்து உங்கள் பதில்களைப் புலனாய்வு செய்யுங்கள் -- [ ] GitHub Copilot விரிவாக்கத்துடன் VS Code ஐ அமைக்கவும் -- [ ] ஆன்லைனில் இரண்டு வெவ்வேறு ப்ரோகிராமிங் மொழிகளில் "Hello World" எடுத்துக்காட்டை முயற்சிக்கவும் -- [ ] YouTube இல் "ஒரு டெவலப்பர் வாழ்க்கை நாளில்" என்ற காணொளியைப் பார்க்கவும் -- [ ] உங்கள் ப்ரோகிராமிங் மொழி விசாரணை பணியை (சவாலை) தொடங்கவும் - -### 📅 **உங்கள் ஆகஸ்தியமான வார அனுபவம்** -- [ ] பணிமனையை முடித்து 3 புதிய வளர்ச்சி கருவிகளை ஆராயுங்கள் -- [ ] சமூக ஊடகங்களில் 5 டெவலப்பர் அல்லது ப்ரோகிராமிங் கணக்குகளை பின்தொடருங்கள் -- [ ] CodePen அல்லது Replit இல் சிறிய ஒன்றை உருவாக்க முயற்சிக்கவும் (உதாரணமாக "Hello, [உங்கள் பெயர்]!") -- [ ] யாராவது டெவலப்பரின் கோடிங் பயணம் குறித்த ஒரு வலைப்பதிவு பதிவைப் படியுங்கள் -- [ ] ஒரு இணைய மாநாட்டில் கலந்து கொள்ளவோ அல்லது ப்ரோகிராமிங் பேச்சைப் பார்க்கவும் -- [ ] ஆன்லைன் பாடங்களுடன் உங்கள் தேரிந்த மொழியை கற்றல் துவங்கவும் - -### 🗓️ **உங்கள் மாதாந்திர மாற்றம்** -- [ ] உங்கள் முதல் சிறிய திட்டத்தை உருவாக்குங்கள் (ஒரு எளிய வலைபக்கம் கூட போலிய!) -- [ ] ஒரு திறந்த-மூல திட்டத்திற்கு பங்களிக்கவும் (ஆதரவுக் கோப்புகளில் திருத்தங்களை செய்ய ஆரம்பிக்கவும்) -- [ ] ப்ரோகிராமிங் பயணம் துவங்கியவர்களுக்கு வழிகாட்டி ஆகவும் +- [ ] உங்கள் கவனத்தை ஈர்த்த 2-3 பிரோகிராமிங் மொழி வலைத்தளங்களை புத்திசாலித்தனமாய் சேமிக்கவும் +- [ ] Visual Studio Code ஐ பதிவிறக்கம் செய்யவில்லை என்றால் பதிவிறக்கவும் +- [ ] உங்கள் உலாவி DevTools (F12) திறந்து எந்தவொரு வலைத்தளத்திலும் கிளிக் செய்யவும் +- [ ] ஒரு பிரோகிராமிங் சமுதாயத்தில் சேர்ந்துகொள்ளவும் (Dev.to, Reddit r/webdev, அல்லது Stack Overflow) + +### ⏰ **இந்த மணி நேரத்தில் நீங்கள் முடிக்கக்கூடியவை** +- [ ] பாடக் குறுமொழி குழுவை முடித்து உங்கள் பதில்களை விமர்சிக்கவும் +- [ ] VS Code ஐ GitHub Copilot விரிவாக்கத்துடன் அமைக்கவும் +- [ ] இரண்டு வேறு பிரோகிராமிங் மொழிகளில் ஆன்லைனில் "Hello World" எடுத்துக்காட்டை முயற்சிக்கவும் +- [ ] YouTube இல் "ஒரு டெவலப்பர் வாழ்க்கை நாள்" காணொளியைப் பாருங்கள் +- [ ] உங்கள் பிரோகிராமிங் மொழி காவலாளர் (detective) பணியை ஆரம்பியுங்கள் (சவால் பகுதியில் இருந்து) + +### 📅 **உங்கள் வாரம் முழுவதும் சாகசம்** +- [ ] அசைன்மெண்டை முடித்து 3 புதிய வளர்ச்சி கருவிகளை ஆராயுங்கள் +- [ ] சமூக ஊடகங்களில் 5 டெவலப்பர் அல்லது பிரோகிராமிங் கணக்குகளை பின்தொடருங்கள் +- [ ] CodePen அல்லது Replit இல் சிறிய ஒன்று கட்டியமைக்கவும் (பரவாயில்லை, "Hello, [உங்கள் பெயர்]!" கூட சரி) +- [ ] ஒருவருடைய குறியீட்டு பயணத்தைப் பற்றிய டெவலப்பர் வலைப்பதிவைக் கையாண்டு படியுங்கள் +- [ ] ஒரு காட்சி சந்திப்பில் சேரவும் அல்லது ஒரு பிரோகிராமிங் உரையைப் பாருங்கள் +- [ ] ஆன்லைன் பாடங்களுடன் உங்கள் தேர்ந்தெடுத்த மொழியை கற்றல் தொடங்குங்கள் + +### 🗓️ **உங்கள் மாத பூரண மாற்றம்** +- [ ] உங்கள் முதல் சிறிய திட்டத்தை உருவாக்குங்கள் (ஒரு எளிய வலையலைப்பக்கம் கூட சரி!) +- [ ] ஓப்பன்-சோர்ஸ் (திறந்த மூல) திட்டத்திற்கு பங்களிக்கவும் (ஆரம்பமாக ஆவண திருத்தங்களுடன்) +- [ ] புதிதாக தொடங்கும் ஒருவருக்கு வழிகாட்டி ஆகுங்கள் - [ ] உங்கள் டெவலப்பர் தளத்தை உருவாக்குங்கள் -- [ ] உள்ளூர் டெவலப்பர் சமூகவாக்கள் அல்லது படிப்பகங்கள் இணைக்கவும் -- [ ] அடுத்த கற்றல் இலக்கை திட்டமிடத் தொடங்கவும் +- [ ] உள்ளூர் டெவலப்பர் சமுதாயங்கள் அல்லது படிப்பு குழுக்களுடன் இணைந்து கொள்வது +- [ ] உங்கள் அடுத்த கற்றல் இலக்கை திட்டமிடத் தொடங்குங்கள் -### 🎯 **இறுதி சிந்தனை சரிபார்ப்பு** +### 🎯 **இறுதிக் கருத்தாய்வு** -**முன்னேறுவதற்கு முன்னர் சிறிது நேரம் முடிவுகளை கொண்டாடுங்கள்:** -- இன்று ப்ரோகிராமிங் பற்றி எதுவும் உங்களை உற்சாகப்படுத்தியது என்ன? -- முதலில் எந்த கருவி அல்லது கருத்தை ஆராய விரும்புகிறீர்கள்? -- இந்த ப்ரோகிராமிங் பயணத்தைத் துவங்குதல் பற்றித் நீங்கள் எப்படி உணர்கிறீர்கள்? -- இப்போது ஒரு டெவலப்பரிடம் நீங்கள் கேட்டுக் கொள்ள விரும்பும் ஒரு கேள்வி என்ன? +**நீங்கள் மேலும் செல்லும் முன், ஒரு தருணத்தை கொண்டாடுங்கள்:** +- இன்றைய தினம் பிரோகிராமிங் பற்றி உங்களை உற்சாகப்படுத்தியது என்ன ஒன்று? +- முதலில் நீங்கள் ஆராய விரும்பும் கருவி அல்லது கருத்து எது? +- இந்த பிரோகிராமிங் பயணத்தைத் தொடங்கும் போது நீங்கள் எப்படி உணர்கிறீர்கள்? +- இப்போது ஒரு டெவலப்பரால் கேட்க விரும்பும் ஒரு கேள்வி என்ன? ```mermaid journey title உங்கள் நம்பிக்கை உருவாக்கும் பயணம் section இன்று - ஆர்வமாக: 3: You - அவசரத்தில்: 4: You - உற்சாகமாக: 5: You + ஆர்வமாக 있음: 3: You + சுமையாயிருத்தல்: 4: You + உற்சாகமாக 있음: 5: You section இந்த வாரம் - ஆராய்ந்து கொண்டிருக்கும்: 4: You - கற்றுக்கொள்கிறேன்: 5: You - தொடர்பு கொள்ளுதல்: 4: You + ஆராய்தல்: 4: You + கற்றல்: 5: You + தொடர்பு கொள்வது: 4: You section அடுத்த மாதம் - கட்டமைப்பது: 5: You - நம்பிக்கை கொண்டிருத்தல்: 5: You - மற்றவர்களை உதவுதல்: 5: You + கட்டமைத்தல்: 5: You + நம்பிக்கையாக 있음: 5: You + மற்றவர்களுக்கு உதவுதல்: 5: You ``` -> 🌟 **என்றும் நினைவில் வையுங்கள்**: ஒவ்வொரு நிபுணரும் ஒருவேளை தொடங்கியவர்களே ஆகினர். ஒவ்வொரு மூத்த டெவலப்பரும் இப்போது நீங்கள் உணர்ந்து கொண்டிருக்கும் போலவே – உற்சாகமுள்ள, சற்று குழப்பமாகவும், என்ன இயலும் என்பதில் ஆர்வமுள்ளவர்களே. நீங்கள் அற்புதமான குழுவில் உள்ளீர்கள், இந்த பயணம் அற்புதமாக இருக்கும். ப்ரோகிராமிங் அதிசய உலகத்திற்கு வரவேற்கிறோம்! 🎉 +> 🌟 **நினைவில் வைக்கவும்**: ஒவ்வொரு நிபுணரும் ஒருநாள் ஆரம்பித்தவர். ஒவ்வொரு மூத்த டெவலப்பரும் இப்போது நீங்கள் உணரும் மாதிரி – உற்சாகமாக, சில சமயங்களில் கொஞ்சம் கலங்கியவர்களாக உணர்ந்தவர்கள். நீங்கள் அற்புதமான அன்போது இருக்கிறீர்கள், இந்த பயணம் அற்புதமாக இருக்கும். பிரோகிராமிங் உலகத்தின் அற்புத உலகத்திற்கு வரவேற்கிறோம்! 🎉 --- -**விருப்பு அறிவிப்பு**: -இந்த ஆவணம் AI மொழிபெயர்ப்பு சேவை [Co-op Translator](https://github.com/Azure/co-op-translator) பயன்படுத்தி மொழிபெயர்க்கப்பட்டுள்ளது. நாங்கள் துல்லியத்திற்காக முயற்சித்தாலும், தானியங்கி மொழிபெயர்ப்புகளில் பிழைகள் அல்லது தவறுகள் இருக்கக்கூடும் என்பதனை கவனத்தில் கொள்ளவும். அதன் சொந்த மொழியில் உள்ள அசல் ஆவணம் தான் அதிகாரப்பூர்வமான மூலமாக கருதப்பட வேண்டும். முக்கியமான தகவல்களுக்கு, தொழில்முறை மனித மொழிபெயர்ப்பை பரிந்துரைக்கிறோம். இந்த மொழிபெயர்ப்பின் பயன்பாட்டில் இருந்து ஏற்படும் எந்தவொரு புரிதல் தவறுகளுக்கும் நாங்கள் பொறுப்பேற்கமாட்டோம். +**முன்னிட்டுரை**: +இத்திரைப்படத்தை AI மொழிபெயர்ப்பு சேவை [Co-op Translator](https://github.com/Azure/co-op-translator) பயன்படுத்தி மொழிபெயர்க்கப்பட்டது. நாங்கள் துல்லியத்திற்காக முயற்சி செய்கிறோம் என்பதாலும், தானாக்கூறல் மொழிபெயர்ப்புகளில் தவறுகள் அல்லது துல்லியமின்மைகள் இருக்க வாய்ப்பு உள்ளது என்பதை தயவுசெய்து கவனிக்கவும். அசல் ஆவணம் அதன் இயல்பான மொழியில் அதிகாரபூர்வ ஆதாரமாகக் கருதப்பட வேண்டும். முக்கியமான தகவல்களுக்கு, தொழில்முறை மனித மொழிபெயர்ப்பை பரிந்துரைக்கிறோம். இந்த மொழிபெயர்ப்பின் பயன்பாட்டால் பிறந்த எந்தவொரு தவறாகிய புரிதல்கள் அல்லது தவறான விளக்கங்களுக்கும் நாங்கள் பொறுப்பாக இருக்கமுடியாது. \ No newline at end of file diff --git a/translations/ta/AGENTS.md b/translations/ta/AGENTS.md index 18f3f5f7d..213410914 100644 --- a/translations/ta/AGENTS.md +++ b/translations/ta/AGENTS.md @@ -2,27 +2,27 @@ ## Project Overview -இது ஆரம்பநிலை பயனாளர்களுக்கு வலை மேம்பாட்டின் அடிப்படைகளை கற்பிப்பதற்கான கல்வி பாடத்திட்டக் களஞ்சியம் ஆகும். இந்த பாடத்திட்டம் Microsoft Cloud Advocates மூலம் உருவாக்கப்பட்ட முழுமையான 12-வாரம் கால பாடநெறி, இதில் JavaScript, CSS மற்றும் HTML அடங்கிய 24 கைமுறைகளான பாடங்கள் உள்ளன. +இந்த அனுஷ்டானம் ஆரம்பகட்ட மாணவர்களுக்கு வலை வளர்ச்சி அடிப்படைகளை கற்பிப்பதற்கான கல்வி பாடத்திட்டக் களஞ்சியமாகும். இந்த பாடத்திட்டம் மைக்ரோசாஃப்ட் கிளௌட் வாதாளர்களால் உருவாக்கப்பட்ட முழுமையான 12 வார பாடநெறி ஆகும், இதில் ஜாவாஸ்கிரிப்ட், CSS, மற்றும் HTML-ஐ உள்ளடக்கிய 24 கையேடு பாடங்கள் உள்ளன. ### Key Components -- **கல்வி உள்ளடக்கம்**: திட்ட அடிப்படையிலான தொகுதிகள் வெளிப்படுத்தப்பட்ட 24 கட்டமைக்கப்பட்ட பாடங்கள் -- **ஆய்வின் செயல்பாடுகள்**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor மற்றும் AI Chat உதவியாளர் -- **இணையக் கேள்விகள்**: ஒவ்வொரு பாடத்திற்கும் 3 கேள்விகளுடன் 48 கேள்விச்செட்டுக்கள் (பாடம் முன்/பிறகு மதிப்பாய்வுகள்) -- **பல மொழி ஆதரவு**: GitHub Actions மூலம் 50+ மொழிகளுக்கு தானாக மொழிபெயர்ப்பு +- **கல்வி உள்ளடக்கம்**: 24 கட்டமைக்கப்பட்ட பாடங்கள், திட்ட அடிப்படையிலான மொட்யூல்கள் +- **பயன்முறை திட்டங்கள்**: டெரேரியம், டைப் செய்பவர் விளையாட்டு, உலாவி நீட்டிப்பு, விண்வெளி விளையாட்டு, வங்கி பயன்பாடு, குறியீடு ஆசிரியர், மற்றும் AI உரையாடல் உதவியாளர் +- **இணைய வினாடி கேள்விகள்**: 3 கேள்விகளுடன் 48 வினாக்கள் (முன்/பின் பாடநெறி மதிப்பீடுகள்) +- **பல மொழி ஆதரவு**: GitHub செயற்பாடுகள் மூலம் 50+ மொழிகளுக்கு தானியங்கி மொழிபெயர்ப்பு - **தொழில்நுட்பங்கள்**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI திட்டங்களுக்கு) ### Architecture -- பாடத்திட்ட அடிப்படையிலான கல்வி களஞ்சியம் -- ஒவ்வொரு பாடக் கோப்பகத்திலும் README, குறியீட்டு உதாரணங்கள் மற்றும் தீர்வுகள் இருக்கின்றன -- தனித்தனியானத் திட்டங்கள் வேறு கோப்பகங்களில் (quiz-app, பல பாடத் திட்டங்கள்) -- GitHub Actions (co-op-translator) மூலம் மொழிபெயர்ப்பு அமைப்பு -- Docsify மூலம் ஆவணங்கள் வழங்கப்படுகிறன மற்றும் PDF ஆக கிடைக்கின்றன +- பாடத்தின் அடிப்படையிலான அமைப்பு கொண்ட கல்விக் களஞ்சியம் +- ஒவ்வொரு பாடத்துக்குமான கோப்புறை README, குறியீடு உதாரணங்கள் மற்றும் தீர்வுகளை கொண்டது +- தனித்தனியாய் உள்ள திட்டங்கள் (quiz-app, பல பாடத் திட்டங்கள்) +- GitHub செயற்பாடுகள் கொண்டு மொழிபெயர்ப்பு அமைப்பு (co-op-translator) +- Docsify மூலம் ஆவணப்படுத்தல் வழங்கப்படுகின்றது மற்றும் PDF வடிவில் கிடைக்கும் ## Setup Commands -இந்தக் களஞ்சியம் முதன்மையாக கல்வி உள்ளடக்கம் பயன்பாட்டிற்கானது. குறிப்பிட்ட திட்டங்களுடன் வேலை செய்ய: +இந்தக் களஞ்சியம் முதன்மையாக கல்வி உள்ளடக்கம் பயன்படுத்தப்படுகிறது. குறிப்பிட்ட திட்டங்களுடன் வேலை செய்ய: ### Main Repository Setup @@ -30,79 +30,79 @@ git clone https://github.com/microsoft/Web-Dev-For-Beginners.git cd Web-Dev-For-Beginners ``` - + ### Quiz App Setup (Vue 3 + Vite) ```bash cd quiz-app npm install -npm run dev # மேம்பாட்டு சர்வரை தொடங்கு -npm run build # உற்பத்திக்காக கட்டமைக்கவும் -npm run lint # ESLint ஐ செயல்படுத்து +npm run dev # மேம்பாட்டு சர்வரைத் தொடங்கு +npm run build # உற்பத்திக்கான கட்டமைப்பை உருவாக்கு +npm run lint # ESLint ஐ இயக்கு ``` - + ### Bank Project API (Node.js + Express) ```bash cd 7-bank-project/api npm install -npm start # API சேவையகத்தைத் தொடங்கு -npm run lint # ESLint ஐ இயக்கு +npm start # API சேவையகத்தை துவக்கம் செய்க +npm run lint # ESLint இயக்குக npm run format # Prettier உடன் வடிவமைக்கவும் ``` - + ### Browser Extension Projects ```bash cd 5-browser-extension/solution npm install -# உலாவி-சிறப்பு விரிவாக்க ஏற்றும் வழிமுறைகளை பின்பற்றவும் +# பROWSER-சார்ந்த நீட்டித்தை ஏற்றுதல் வழிமுறைகளை பின்பற்றவும் ``` - + ### Space Game Projects ```bash cd 6-space-game/solution npm install -# index.html ஐ உலாவியில் திறக்கவும் அல்லது Live Server ஐ பயன்படுத்தவும் +# index.html ஐ உலாவியில் திறக்கவும் அல்லது லைவ் சர்வரை பயன்படுத்து ``` - + ### Chat Project (Python Backend) ```bash cd 9-chat-project/solution/backend/python pip install openai -# GITHUB_TOKEN சுற்றுச்சூழல் மாறியை அமைக்கவும் +# GITHUB_TOKEN சுற்றுச் சூழல் மாறியை அமைக்கவும் python api.py ``` - + ## Development Workflow ### For Content Contributors -1. **உங்கள் GitHub கணக்கில் களஞ்சியத்தை Fork செய்யவும்** -2. **உங்கள் Fork-ஐ உள்ளூரில் Clone செய்யவும்** -3. **உங்கள் மாற்றங்களுக்கு புதிய கிளை உருவாக்கவும்** -4. பாட உள்ளடக்கம் அல்லது குறியீட்டு உதாரணங்களில் மாற்றங்கள் செய்யவும் -5. சம்பந்தப்பட்ட திட்டக் கோப்பகங்களில் குறியீடு மாற்றங்களை சோதிக்கவும் -6. பங்குதாரர் வழிகாட்டுதல்களை பின்பற்றி Pull Request சமர்ப்பிக்கவும் +1. **உங்கள் GitHub கணக்கில் களஞ்சியத்தை Fork செய்க** +2. **உங்கள் Fork-ஐ உள்ளூர் கணினியில் Clone செய்க** +3. **மாற்றங்களுக்கான புதிய கிளை உருவாக்குக** +4. பாடத் தரவுகள் அல்லது குறியீடு உதாரணங்களில் மாற்றங்கள் செய்யவும் +5. தொடர்புடைய திட்டக் கோப்புறைகளில் குறியீடுகளை சோதனை செய்யவும் +6. பங்களிப்பு வழிகாட்டுதல்களை பின்பற்றி pull request சமர்ப்பிக்கவும் ### For Learners -1. களஞ்சியத்தை Fork அல்லது Clone செய்யவும் -2. பாடக் கோப்பகங்களை முறையே நீக்கிச் செல்லவும் -3. ஒவ்வொரு பாடத்திற்குமான README கோப்புகளைப் படிக்கவும் -4. https://ff-quizzes.netlify.app/web/ இல் பாட முன் கேள்விச்செட்டுக்களை முடிக்கவும் -5. பாடக் கோப்பகங்களில் குறியீட்டு உதாரணங்களுடன் பணியாற்றவும் -6. பணிகள் மற்றும் சவால்களை முடிக்கவும் -7. பாடம் பின் கேள்விச்செட்டுக்களை எடுத்துக்கொள்ளவும் +1. களஞ்சியத்தை Fork செய்யவும் அல்லது Clone செய்யவும் +2. பாடக் கோப்புறைகளில் தொடர் முறையில் செல்லவும் +3. ஒவ்வொரு பாடத்திற்குமான README கோப்புகளை படிக்கவும் +4. https://ff-quizzes.netlify.app/web/ என்ற இடத்தில் முன் பாட வினாடி கேள்விகளை முடிக்கவும் +5. பாடக் கோப்புறைகளில் குறியீடு உதாரணங்களைத் தொடர்ந்து வேலை செய்க +6. பணிகள் மற்றும் சவால்களை நிறைவேற்றுக +7. பின் பாட வினாடி கேள்விகளை எடுக்கவும் ### Live Development -- **ஆவணங்கள்**: ரூட்டில் `docsify serve` இயக்கவும் (போர்ட் 3000) -- **Quiz App**: quiz-app கோப்பகத்தில் `npm run dev` இயக்கவும் -- **திட்டங்கள்**: HTML திட்டங்களுக்கு VS Code Live Server விரிவாக்கத்தைப் பயன்படுத்தவும் -- **API திட்டங்கள்**: சம்பந்தப்பட்ட API கோப்பகங்களில் `npm start` இயக்கவும் +- **ஆவணங்கள்**: ரூட் (port 3000)இல் `docsify serve` இயக்கவும் +- **Quiz App**: quiz-app கோப்புறையில் `npm run dev` இயக்கவும் +- **திட்டங்கள்**: VS Code Live Server நீட்டிப்பை HTML திட்டங்களுக்கு பயன்படுத்தவும் +- **API திட்டங்கள்**: சம்பந்தப்பட்ட API கோப்புறைகளில் `npm start` இயக்கவும் ## Testing Instructions @@ -110,173 +110,173 @@ python api.py ```bash cd quiz-app -npm run lint # குறியீட்டை வடிவமைப்பு பிழைகள் இருப்பதை சரிபார்க்கவும் -npm run build # கட்டுமானம் வெற்றி பெறுவதை உறுதிசெய்க +npm run lint # குறியீடு நடைமுறைப் பிழைகளை சரிபார்க்கவும் +npm run build # கட்டமைப்பு வெற்றியடையுமா என்பதை உறுதிசெய்தல் ``` - + ### Bank API Testing ```bash cd 7-bank-project/api -npm run lint # குறியீட்டு பாணி பிழைகள் உள்ளதா என்பதை சரிபார்க்கவும் -node server.js # சேவையகத் துவக்கம் பிழைகள் இல்லாமல் நடந்ததா என்பதை உறுதிப்படுத்தவும் +npm run lint # குறியீட்டு வடிவமைப்பு பிழைகள் உள்ளதா பார்க்கவும் +node server.js # சேவையகம் பிழைகள் இல்லாமல் தொடங்குகிறதா என உறுதி செய்யவும் ``` - + ### General Testing Approach -- இது முழுமையான தானியங்கி சோதனைகள் இல்லாத கல்வி களஞ்சியம் -- கைமுறை சோதனை பின்வருமாறு கவனம் செலுத்துகிறது: - - குறியீட்டு உதாரணங்கள் பிழையின்றி இயங்கினால் - - ஆவணங்களில் உள்ள இணைப்புகள் சரியாக செயல்படினால் - - திட்டங்களின் கட்டுமானம் வெற்றிகரமாக முடிந்தால் - - உதாரணங்கள் சிறந்த நடைமுறைகளை பின்பற்றினால் +- இந்தக் களஞ்சியம் விரிவான தானியங்கி சோதனைகள் இல்லாமல் கல்விக்கானது +- கைமுறை சோதனைகள் கவனம் செலுத்துகின்றன: + - குறியீடு உதாரணங்கள் பிழையின்றி இயங்குதல் + - ஆவணங்களில் உள்ள இணைப்புகள் வேலை செய்வது + - திட்ட கட்டுமானங்கள் வெற்றிகரமாக நிறைவேற்றல் + - உதாரணங்கள் சிறந்த நடைமுறைகளை பின்பற்றல் ### Pre-submission Checks -- package.json உள்ள கோப்பகங்களில் `npm run lint` இயக்கவும் -- Markdown இணைப்புகள் செல்லுபடியாக உள்ளதா என சரிபார்க்கவும் -- குறியீட்டு உதாரணங்களை உலாவியில் அல்லது Node.js இல் சோதிக்கவும் -- மொழிபெயர்ப்புகள் சரியான கட்டமைப்போடு உள்ளதா என்பதைக் கண்காணிக்கவும் +- package.json உள்ள கோப்புறைகளில் `npm run lint` இயக்கவும் +- மார்க்டவுன் இணைப்புகள் செல்லுபடியாக உள்ளதா என்று சரிபார்க்கவும் +- குறியீடு உதாரணங்களை உலாவி அல்லது Node.js இல் சோதனை செய்யவும் +- மொழிபெயர்ப்புகள் சரியான அமைப்பை பராமரிக்கின்றனவா எனச் சரிபார்க்கவும் ## Code Style Guidelines ### JavaScript -- நவீன ES6+ தொகுக்குள் எழுதவும் -- திட்டங்களில் வழங்கப்பட்ட ESLint கட்டமைப்புகளை பின்பற்றவும் -- கல்வி தெளிவுக்கு பொருந்தும் பொருத்தமான மாறிலிகள் மற்றும் செயல்பாட்டுப் பெயர்களைப் பயன்படுத்தவும் -- கற்றலுக்கான கருத்துகளுடன் கருத்துரைகளைச் சேர்க்கவும் -- Prettier ஐ அமைப்பில் பயன்படுத்தி வடிவமைக்கவும் +- நவீன ES6+ சொற்றொடர்கள் பயன்படுத்துக +- திட்டங்களில் வழங்கப்பட்ட பராமரிக்கப்பட்ட ESLint கட்டமைப்புகளை பின்பற்றுக +- கல்வி பண்பாட்டிற்கு பொருத்தமான மாறிலி மற்றும் செயல்பாடுகளின் பெயர்களைப் பயன்படுத்துக +- கற்றுக்கொள்ளும் நோக்கத்துக்கான கருத்துக்களைச் சேர்க்கவும் +- கட்டமைக்கப்பட்ட இடங்களில் Prettier மூலம் வடிவமைக்கவும் ### HTML/CSS -- அர்த்தபூர்வ HTML5 கூறுகள் -- பதிலளிக்கும் வடிவமைப்பு 원칙ங்கள் -- தெளிவான வகுப்பு பெயரிடும் விதிகள் -- CSS கலப்பாணி விளக்கக் கருத்துரைகள் +- பொருத்தமான HTML5 கூறுகள் +- பதிலளிக்கும் வடிவமைப்புக் கொள்கைகள் +- தெளிவான வகுப்பு பெயரிடுகைகள் +- CSS தொழில்நுட்பங்கள் விளக்கும் கருத்துக்களைச் சேர்க்கவும் ### Python -- PEP 8 நடைமுறைகளைக் கடைப்பிடிக்கவும் -- தெளிவான, கல்விசார் குறியீட்டு உதாரணங்கள் -- கற்றலுக்காக தேவைப்பட்டால் வகை குறியீடுகளுடன் +- PEP 8 பாணி வழிகாட்டுதல்கள் +- தெளிவான, கல்வி குறியீடு உதாரணங்கள் +- கற்றுக்கொள்ள உதவும் இடங்களில் வகை குறிப்பு ### Markdown Documentation -- தெளிவான தலைப்பு வரிசை -- மொழி விவரிக்கப்பட்ட குறியீட்டு தொகுதிகள் -- கூடுதல் ஆதாரங்கள் இணைப்புகள் -- படங்கள் மற்றும் ஸ்கிரீன்ஷாட்கள் `images/` கோப்பகங்களில் -- அணுகலும் வசதிக்கும் படங்களுக்கான Alt உரை +- தெளிவான தலைப்பு வரிசைமை +- மொழி குறிப்புடன் குறியீடு தொகுதிகள் +- கூடுதல் வளங்களுக்கு இணைப்புகள் +- `images/` கோப்புறைகளில் திரைபடங்கள் மற்றும் படங்கள் +- படங்களுக்கு அணுகல் வசதிக்கான Alt உரை ### File Organization -- பாடங்கள் தொடர் எண்களுடன் (1-getting-started-lessons, 2-js-basics, என) -- ஒவ்வொரு திட்டத்திற்கும் `solution/` மற்றும் பெரும்பாலும் `start/` அல்லது `your-work/` கோப்பகங்கள் -- படங்கள் பாடத் தனிப்பட்ட `images/` கோப்பகங்களில் -- மொழிபெயர்ப்புகள் `translations/{language-code}/` அமைப்பில் +- பாடங்கள் தொடர் எண்களுடன் (1-getting-started-lessons, 2-js-basics, போன்றவை) +- ஒவ்வொரு திட்டத்துக்கும் `solution/` மற்றும் பெரும்பாலும் `start/` அல்லது `your-work/` கோப்புறைகள் +- பாடத் தனித்துவமான `images/` கோப்புறைகளில் படம் சேமிப்பு +- `translations/{language-code}/` அமைப்பில் மொழிபெயர்ப்புகள் ## Build and Deployment ### Quiz App Deployment (Azure Static Web Apps) -quiz-app Azure Static Web Apps வெளியீட்டிற்கு அமைக்கப்பட்டுள்ளது: +quiz-app Azure Static Web Apps இடைமுகம் கொண்டு ஒழுங்குபடுத்தப்பட்டுள்ளது: ```bash cd quiz-app -npm run build # dist/ கோப்புறை உருவாக்குகிறது -# மெயின் கிளையில் புஷ் செய்தபோது GitHub Actions வேலைநடத்தை மூலம் பிரசாரம் செய்கிறது +npm run build # dist/ கோப்புறையை உருவாக்குகிறது +# பிரதான கிளையை புதுப்பிக்கும் போது GitHub Actions பண்அமைப்பினூடாக வெளியிடுகிறது ``` - -Azure Static Web Apps வரைகலை: -- **App location**: `/quiz-app` -- **Output location**: `dist` -- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` + +Azure Static Web Apps அமைப்பு: +- **App இடம்**: `/quiz-app` +- **வெளியீடு இடம்**: `dist` +- **வேலைபாடு**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` ### Documentation PDF Generation ```bash -npm install # docsify-to-pdf ஐ நிறுவவும் -npm run convert # docs இலிருந்து PDF ஐ உருவாக்கவும் +npm install # docsify-to-pdf ஐ நிறுவுக +npm run convert # docs இலிருந்து PDF உருவாக்குக ``` - + ### Docsify Documentation ```bash -npm install -g docsify-cli # Docsify ஐ முழுமையாக நிறுவுக -docsify serve # localhost:3000 இல் சேவை செய்க +npm install -g docsify-cli # Docsify ஐ உலகளாவிய முறையில் நிறுவவும் +docsify serve # localhost:3000 இல் சேவை வழங்கவும் ``` - + ### Project-specific Builds -ஒவ்வொரு திட்டக் கோப்பகத்திலும் தனிப்பட்ட கட்டுமான செயல்முறை இருக்கும்: -- Vue திட்டங்கள்: `npm run build` மூலம் தயாரிப்புத் தொகுப்புகள் உருவாக்கப்படும் -- நிலையான (Static) திட்டங்கள்: கட்டுமான படி இல்லாமல் நேரடியாக கோப்புகளை வழங்கும் +ஒவ்வொரு திட்டக் கோப்புறைக்கும் தனிப்பட்ட கட்டுமான செயல்முறை இருக்கலாம்: +- Vue திட்டங்கள்: `npm run build` மூலம் தயாரிப்பு தொகுதிகள் உருவாகும் +- நிலையான (static) திட்டங்கள்: கட்டுமான படி இல்லை, கோப்புகளை நேரடியாக வழங்குகிறது ## Pull Request Guidelines ### Title Format -மாற்றத்தின் பகுதியை தெளிவாக காட்டும் தலைப்புகளைப் பயன்படுத்தவும்: -- `[Quiz-app] பாடம் Xக்கான புதிய கேள்வி சேர்க்கவும்` -- `[Lesson-3] terrarium திட்டத்தில் பிழை திருத்தம்` -- `[Translation] பாடம் 5க்கான ஸ்பானிஷ் மொழிபெயர்ப்பு சேர்க்கவும்` -- `[Docs] அமைப்பு நிகழைகள் புதுப்பித்தல்` +மாற்றத்தை தெளிவாக விளக்கும் தலைப்புகளைப் பயன்படுத்துக: +- `[Quiz-app] பாடம் X க்கான புதிய வினாடி கேள்வி சேர்க்கவும்` +- `[Lesson-3] டெரேரியம் திட்டத்தில் எழுத்துப் பிழை திருத்தவும்` +- `[Translation] பாடம் 5 க்கு ஸ்பானிஷ் மொழிபெயர்ப்பு சேர்க்கவும்` +- `[Docs] அமைப்பு வழிமுறைகளை புதுப்பிக்கவும்` ### Required Checks -PR சமர்ப்பிப்புக்கு முன்: +PR சமர்ப்பிப்பதற்கு முன்: -1. **குறியீட்டு தரம்**: - - தாக்கத்துக்குள்ளான திட்டக் கோப்பகங்களில் `npm run lint` இயக்கவும் - - அனைத்து பிழைகளும் எச்சரிக்கைகளும் சரிசெய்யப்பட வேண்டும் +1. **குறியீடு தரம்**: + - சம்பந்தப்பட்ட திட்டக் கோப்புறைகளில் `npm run lint` இயக்கவும் + - அனைத்து lint பிழைகள் மற்றும் எச்சரிக்கைகளை சரி செய்யவும் -2. **கட்டுமான சரிபார்ப்பு**: - - பொருந்துமானால் `npm run build` இயக்கவும் - - கட்டுமான பிழைகள் இருக்கக் கூடாது +2. **கட்டுமான சரிபார்ப்பு**: + - பொருந்துமானால் `npm run build` இயக்கவும் + - கட்டுமான பிழைகள் வராமல் உறுதி செய்யவும் -3. **இணைப்பு சரிபார்ப்பு**: - - அனைத்து Markdown இணைப்புகளும் சரிபார்க்கப்பட வேண்டும் - - படங்கள் குறிப்பு சரியாக இருக்க வேண்டும் +3. **இணைய இணைப்பு சரிபார்ப்பு**: + - அனைத்து மார்க்டவுன் லிங்குகளை சோதிக்கவும் + - படம் மேற்கோள்கள் வேலை செய்கின்றதா என உறுதிசெய்யவும் -4. **உள்ளடக்கம் ஆய்வு**: - - எழுத்து மற்றும் இலக்கண பிழைகள் இல்லாமல் இருக்க வேண்டும் - - குறியீட்டு உதாரணங்கள் சரியாகவும் கல்விசரியும் இருக்க வேண்டும் - - மொழிபெயர்ப்புகள் அசல் பொருளினை பாதுகாத்திருக்க வேண்டும் +4. **உள்ளடக்கம் பரிசீலனை**: + - எஃகு மற்றும் இலக்கண பிழைகள் இல்லாததைக் கோருங்கள் + - குறியீடு உதாரணங்கள் சரியானதும் கல்விக்கூடியதுமானது + - மொழிபெயர்ப்புகள் உண்மையான பொருளை பராமரிக்கின்றன ### Contribution Requirements -- Microsoft CLAஐ ஏற்றுக்கொள்ள வேண்டும் (முதல் PRஇல் தானாகச் சரிபார்க்கப்படுக) -- [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) பின்பற்றவும் -- விரிவான வழிகாட்டலுக்கு [CONTRIBUTING.md](./CONTRIBUTING.md) பார்வையிடவும் -- தேவையானால் PR விளக்கத்தில் பிரச்சினை எண்கள் குறிப்பிடவும் +- Microsoft CLA-வை ஒப்புக்கொள்ளவும் (முதற்ப(PR)-ல் தானியங்கி சோதனை) +- [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) பின்பற்ற வேண்டும் +- விரிவான வழிகாட்டலுக்கு [CONTRIBUTING.md](./CONTRIBUTING.md) பார்க்கவும் +- PR விளக்கத்தில் பிரச்சினை எண்களை குறிப்பிடுங்கள் எனில் ### Review Process -- PRகள் பராமரிப்பாளர்கள் மற்றும் சமூகத்தால் மதிப்பாய்வு செய்யப்படுகின்றன -- கல்வி தெளிவுக்கு முக்கியத்துவம் கொடுக்கப்படுகிறது -- குறியீட்டு உதாரணங்கள் தற்போதைய சிறந்த நடைமுறைகளை பின்பற்ற வேண்டும் -- மொழிபெயர்ப்புகள் சரியான தன்மை மற்றும் பண்பாட்டு பொருத்தத்திற்கு ஆய்வு செய்யப்படுகின்றன +- PR-களை பராமரிப்பவர்கள் மற்றும் சமுதாயம் விமர்சனப்படுத்துவர் +- கல்வி தெளிவு முன்னிருத்தப்படும் +- குறியீடு உதாரணங்கள் தற்போதைய சிறந்த நடைமுறைகளை பின்பற்றவேண்டும் +- மொழிபெயர்ப்புகள் துல்லியமும் பண்பாட்டுத் தகுதியும் பரிசீலிக்கப்படும் ## Translation System ### Automated Translation -- GitHub Actions உடன் co-op-translator workflow பயன்படுத்தப்படுகிறது -- தானாக 50+ மொழிகளுக்கு மொழிபெயர்க்கிறது -- மூல கோப்புகள் பிரதான கோப்பகங்களில் -- மொழிபெயர்க்கப்பட்ட கோப்புகள் `translations/{language-code}/` கோப்பகங்களில் +- GitHub செயற்பாடுகள் மற்றும் co-op-translator வேலைப்பாட்டைப் பயன்படுத்துகிறது +- தானாக 50+ மொழிகளுக்கு மொழிபெயர்க்கின்றது +- மூல கோப்புகள் முதன்மை கோப்புறைகளில் +- மொழிபெயர்க்கப்பட்ட கோப்புகள் `translations/{language-code}/` கோப்புறைகளில் ### Adding Manual Translation Improvements -1. `translations/{language-code}/` இல் கோப்பை கண்டுபிடிக்கவும் -2. கட்டமைப்பை பாதுகாத்து மேம்படுத்தулер செய்யவும் -3. குறியீட்டு உதாரணங்கள் செயல்படுவதில் இணக்கமானவை என்பதை உறுதி செய்யவும் -4. உள்ளூர்தமிழ் கேள்விகளுக்கு சோதனை செய்யவும் +1. `translations/{language-code}/` இல் கோப்பை கண்டறியவும் +2. அமைப்பை மாறாமல் மேம்படுத்துக +3. குறியீடு உதாரணங்கள் செயல்படுவதை உறுதிசெய்க +4. உள்ளூர் வினாடி கேள்விகள் இருந்தால் சோதிக்கவும் ### Translation Metadata -மொழிபெயர்க்கப்பட்ட கோப்புகளில் metadata தலைப்பு இடப்பட்டுள்ளது: +மொழிபெயர்க்கப்பட்ட கோப்புகளில் metadata தலைப்பு உள்ளது: ```markdown ``` - + ## Debugging and Troubleshooting ### Common Issues -**Quiz app துவங்காது**: -- Node.js பதிப்பு (v14+ பரிந்துரைக்கப்படுகிறது) -- `node_modules` மற்றும் `package-lock.json` நீக்கி `npm install` மீண்டும் இயக்கவும் -- போர்ட் முரண்பாடுகள் (இயல்புநிலை: Vite 5173 போர்ட் பயன்படுத்துகிறது) சரிபார்க்கவும் +**Quiz app துவங்காமல் போவது**: +- Node.js பதிப்பchecks (v14+ பரிந்துரைக்கப்படுகிறது) +- `node_modules` மற்றும் `package-lock.json` நீக்கி `npm install` மீண்டும் இயக்கவும் +- போர்ட் எதிர்ப்பு இருந்தால் சரிபார்க்கவும் (இயல்புநிலை: Vite போர்ட் 5173 பயன்படுத்துகிறது) -**API சேவையகம் துவங்கவில்லை**: -- Node.js பதிப்பு குறைந்தபட்சம் node >=10 இருக்கிறதா என உறுதி செய்யவும் -- போர்ட் ஏற்கனவே பயன்படுத்தப்படுகிறதா என சரிபார்க்கவும் -- அனைத்து சார்புகள் `npm install` மூலம் நிறுவப்பட்டுள்ளனவா என உறுதி செய்யவும் +**API சர்வர் துவங்காது**: +- Node.js பதிப்பு குறைந்தபட்சம் node >=10 இருக்க வேண்டும் +- போர்ட் ஏற்கனவே பயன்பாட்டில் இருக்கிறதா என்று பார்க்கவும் +- அனைத்து சார்பு தொகுதிகள் `npm install` மூலம் நிறுவப்பட்டுள்ளனவா என சரிபார்க்கவும் -**Browser extension ஏற்றப்படவில்லை**: -- manifest.json சரியாக வடிவமைக்கப்பட்டுள்ளதா என்பதை சரிபார்க்கவும் -- உலாவி(console) பிழைத் தொடரலை பார்வையிடவும் -- உலாவி-சுட்டி சிறப்பு நிறுவல் வழிமுறைகளை பின்பற்றவும் +**Browser Extension ஏற்றாது**: +- manifest.json சரியான வடிவில் இருக்கிறதா பார்க்கவும் +- உலாவி கன்சோலில் பிழைகளை பார்க்கவும் +- உலாவி-சிறப்பு நீட்டிப்பு நிறுவல் வழிமுறைகளை பின்பற்றவும் -**Python chat திட்டத்தில் பிரச்சினைகள்**: -- OpenAI தொகுப்பு நிறுவப்பட்டுள்ளது: `pip install openai` -- GITHUB_TOKEN சுற்றுச்சூழல் மாறி அமைக்கப்பட்டுள்ளது என உறுதி செய்யவும் -- GitHub மாடல்கள் அணுகல் அனுமதிகளைச் சரிபார்க்கவும் +**Python உரையாடல் திட்ட பிழைகள்**: +- OpenAI தொகுதி நிறுவப்பட்டுள்ளதா (`pip install openai`) +- GITHUB_TOKEN சுற்றுச்சூழல் மாறி அமைக்கப்பட்டுள்ளது +- GitHub Models அணுகல் அனுமதிகளை சரிபார்க்கவும் -**Docsify ஆவண சேவை வழங்கவில்லை**: -- உலகளாவிய docsify-cli நிறுவவும்: `npm install -g docsify-cli` -- களஞ்சியத்தின் ரூட் கோப்பகத்தில் இயக்கவும் -- `docs/_sidebar.md` கோப்பு உள்ளது என்பதை உறுதி செய்யவும் +**Docsify ஆவணங்கள் வழங்கவில்லை**: +- docsify-cli-ஐ உலகளவில் நிறுவவும்: `npm install -g docsify-cli` +- களஞ்சியத்தின் ரூட் கோப்புறைஇருந்து இயக்கவும் +- `docs/_sidebar.md` உள்ளது என உறுதிசெய்க ### Development Environment Tips -- HTML திட்டங்களுக்கு VS Code Live Server விரிவாக்கம் பயன்படுத்தவும் -- ஒரே மாதிரியான வடிவமைப்புக்கு ESLint மற்றும் Prettier விரிவாக்கங்களை நிறுவவும் -- JavaScript பிழைகள் கண்டறிய Browser DevTools பயன்படுத்தவும் -- Vue திட்டங்களுக்கு Vue DevTools உலாவி விரிவாக்கத்தை நிறுவவும் +- HTML திட்டங்களுக்கு VS Code Live Server நீட்டிப்பைப் பயன்படுத்தவும் +- ஒத்திவைக்கும் வடிவமைப்புக்கு ESLint மற்றும் Prettier நீட்டிப்புகளை நிறுவவும் +- JavaScript பிழைத்திருத்தத்திற்கு உலாவி DevTools பயன்படுத்தவும் +- Vue திட்டங்களுக்கு Vue DevTools உலாவி நீட்டிப்பைப் பயன்படுத்தவும் ### Performance Considerations -- மொழிபெயர்க்கப்பட்ட கோப்புகள் (50+ மொழிகள்) அதிகமானவை காரணமாக முழு க்ளோன்கள் பெரிதாக இருக்கும் -- உள்ளடக்கத்துடன் மட்டும் வேலை செய்ய shallow clone பயன்படுத்தவும்: `git clone --depth 1` -- ஆங்கில உள்ளடக்கங்களில் மொழிபெயர்ப்புகளை தேடல்களில் விலக்கு விடவும் -- கட்டுமான செயல்முறைகள் முதன்முறையாக மெதுவாக இருக்க வாய்ப்பு (npm install, Vite build) +- 50+ மொழிகளில் மொழிபெயர்க்கப்பட்ட கோப்புகள் அதிகம் இருப்பதால் முழு கிளோன் பெரிதாக இருக்கும் +- உள்ளடக்கம் மட்டுமே வேலை செய்வின் `git clone --depth 1` பயன்படுத்தவும் +- ஆங்கில உள்ளடக்கத்தில் மொழிபெயர்ப்புகளைத் தேடும் போது தவிர்க்கவும் +- கட்டுமான செயல்முறைகள் முதன்முறையாக மெதுவாக இருக்கலாம் (npm install, Vite build) ## Security Considerations ### Environment Variables -- API விசைகளை களஞ்சியத்தில் பதிப்பிக்க கூடாது -- `.env` கோப்புகளை (ஏற்கனவே `.gitignore` உள்ளது) பயன்படுத்தவும் -- திட்ட README-களில் தேவையான சுற்றுச்சூழல் மாறிகள் ஆவணப்படுத்தவும் +- API விசைகள் களஞ்சியத்தில் சேர்க்கப்படக் கூடாது +- `.env` கோப்புகளை பயன்படுத்தவும் (ஈவ்வுலகில் `.gitignore` உள்ளது) +- திட்ட README-களில் தேவைப்படும் சுற்று மாறிகள் ஆவணப்படுத்தவும் ### Python Projects -- `python -m venv venv` கொண்டு மெய்நிகர் சுற்றுச்சூழல்களைப் பயன்படுத்தவும் -- சார்புகளை மேம்படுத்திக் கொள்வது முக்கியம் -- GitHub டோகன்கள் குறைந்தபட்ச அனுமதிகளுடன் இருக்க வேண்டும் +- மெய்நிகர் சுற்றுச்சூழல்களை பயன்படுத்தவும்: `python -m venv venv` +- சார்புகளை புதுப்பித்து வைக்கவும் +- GitHub டோக்கன்களுக்கு குறைந்தபட்ச தேவையான அனுமதிகளை அளிக்கவும் ### GitHub Models Access -- GitHub Models க்கு தனிப்பட்ட அணுகல் டோகன்கள் (PAT) தேவை -- டோகன்கள் சுற்றுச்சூழல் மாறிகள் ஆக பாதுகாக்கப்பட வேண்டும் -- டோகன்கள் அல்லது கடவுச்சொற்களை பதிப்பிப்பது தவிர்க்கவும் +- GitHub Models-க்கு தனிப்பட்ட அணுகல் டோக்கன்கள் தேவை +- டோக்கன்களை சுற்றுச்சூழல் மாறிகளாக வைத்திருக்கவும் +- டோக்கன் அல்லது சான்றுகளை களஞ்சியத்தில் சேர்க்கக்கூடாது ## Additional Notes ### Target Audience -- வலை மேம்பாட்டிற்கு முழுமையான ஆரம்பநிலை பயனாளர்கள் -- மாணவர்கள் மற்றும் தன்னடையாள கற்றல் செய்பவர்கள் -- வகுப்பறைகளில் பாடத்திட்டத்தைப் பயன்படுத்தும் ஆசிரியர்கள் -- உள்ளடக்கம் அணுகல் வசதி மற்றும் படிப்படியான திறன் வளர்ச்சிக்காக வடிவமைக்கப்பட்டுள்ளது +- முழுமையாக ஆரம்ப நிலையில் உள்ள வலை வளர்ச்சி கற்றுக் கொள்ளும்வர் +- மாணவர்கள் மற்றும் சுய கற்றுநர் +- வகுப்பறைகளில் பாடத்திட்டத்தை பயன்படுத்தும் ஆசிரியர்கள் +- அணுகல் வசதிக்கானவும் படிப்படியாக திறமை வளர்க்கும் வகையിലുള്ള உள்ளடக்கம் ### Educational Philosophy -- திட்ட அடிப்படையிலான கற்றல் முறையை பயன்படுத்துகிறது -- அடிக்கடி அறிவு சோதனை (quizzes) -- கைமுறை குறியீட்டு பயிற்சிகள் -- நிஜ உலகைப் பயன்படுத்திய பயன்பாட்டு உதாரணங்கள் -- முன் அமைப்புகளுக்கு முன்னால் அடிப்படைகள் மீது கவனம் +- திட்ட அடிப்படையிலான கற்றல் முறை +- அடிக்கடி அறிவு சோதனை (வினாடி கேள்விகள்) +- கையேடு குறியீடு பயிற்சிகள் +- நெறிமுறை பயன்பாட்டு உதாரணங்கள் +- கட்டமைப்புகளை விட அடிப்படைகளை முன்னுரிமை ### Repository Maintenance -- சுறுசுறுப்பான கற்றல் மற்றும் பங்கு செய்பவர் சமூகத்துடன் -- சார்புகள் மற்றும் உள்ளடக்கம் தொடர்ந்து புதுப்பிக்கப்படுகின்றன -- பிரச்சினைகள் மற்றும் விவாதங்களை பராமரிப்பாளர்கள் கண்காணிக்கின்றனர் -- மொழிபெயர்ப்புகள் GitHub Actions வழியாக தானாக புதுப்பிக்கப்படுகின்றன +- திடீர் மாணவர்கள் மற்றும் பங்களிப்பாளர்கள் மூலம் செயலில் +- சார்புகள் மற்றும் உள்ளடக்கங்களில் தேவையான புதுப்பிப்புகள் +- பிரச்சினைகள் மற்றும் விவாதங்கள் பராமரிப்போரால் கண்காணிப்பு +- மொழிபெயர்ப்பு புதுப்பிப்புகள் GitHub செயல்பாடுகள் மூலம் தானாக நடைபெறுகின்றன ### Related Resources -- [Microsoft Learn modules](https://docs.microsoft.com/learn/) -- [Student Hub resources](https://docs.microsoft.com/learn/student-hub/) -- கற்றவர்களுக்கு பரிந்துரைக்கப்படும் [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) -- கூடுதல் பாடநெறிகள்: Generative AI, Data Science, ML, IoT பாடத்திட்டங்கள் கிடைக்கும் +- [Microsoft Learn modules](https://docs.microsoft.com/learn/) +- [Student Hub resources](https://docs.microsoft.com/learn/student-hub/) +- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) கற்றலுக்கான பரிந்துரை +- கூடுதல் பாடநெறிகள்: பிறந்த AI, தரவு அறிவியல், இயந்திர கற்றல், IoT பாடத்திட்டங்கள் ### Working with Specific Projects -தனித்தனியான திட்டங்களுக்கான விரிவான வழியுறைகளைப் பெற: -- `quiz-app/README.md` - Vue 3 கேள்வி பதில் செயலி -- `7-bank-project/README.md` - அங்கீகாரம் உடைய வங்கிக் செயலி -- `5-browser-extension/README.md` - உலாவி விரிவாக்க மேம்பாடு -- `6-space-game/README.md` - கான்வாஸ் அடிப்படையிலான விளையாட்டு -- `9-chat-project/README.md` - AI உரையாடல் உதவியாளர் திட்டம் +ஒவ்வொரு திட்டத்திற்கான விரிவான வழிமுறைகள் README கோப்புகளில் உள்ளன: +- `quiz-app/README.md` - Vue 3 வினாடி கேள்விகள் செயலி +- `7-bank-project/README.md` - அங்கீகாரம் கொண்ட வங்கி பயன்பாடு +- `5-browser-extension/README.md` - உலாவி நீட்டிப்பு உருவாக்கம் +- `6-space-game/README.md` - கன்வாஸ் அடிப்படையிலான விளையாட்டு +- `9-chat-project/README.md` - AI உரையாடல் உதவியாளர் திட்டம் ### Monorepo Structure -பாரம்பரியமாக ஒரு monorepo ஆக இல்லாவிட்டாலும், இந்தக் களஞ்சியம் பல தனித்தனி திட்டங்களை கொண்டுள்ளது: -- ஒவ்வொரு பாடமும் தனித்தனி உள்ளது -- திட்டங்கள் சார்புகளை பகிர வேண்டாமே -- தனிப்பட்ட திட்டங்களில் மட்டுமே பணியாற்றலாம் மற்றவற்றுக்கு பாதிப்பில்லை -- முழு பாடத்திட்ட அனுபவத்திற்குள் முழுக் களஞ்சியத்தை கிளோன் செய்யவும் +சார்பு பகிர்வு இல்லாத பல தனித்தனியான திட்டங்கள் கொண்ட களஞ்சியம்: +- ஒவ்வொரு பாடமும் தனித்தனியாக உள்ளது +- திட்டங்கள் சார்புகளை பகிர்வதில்லை +- தனித்திட்டங்களில் வேலை செய்யலாம் மற்றவற்றை பாதிக்காமல் +- முழு பாடத்திட்ட அனுபவத்திற்கான முழுக் களஞ்சியத்தை கிளோன் செய்யவும் --- -**குறிப்புரை**: -இந்த ஆவணம் AI மொழிபெயர்ப்பு சேவை [Co-op Translator](https://github.com/Azure/co-op-translator) மூலம் மொழிபெயர்க்கப்பட்டுள்ளது. நாங்கள் துல்லியத்திற்காக முயலினாலும், தானாக மொழிபெயர்ப்புகள் சில தவறுகள் அல்லது துல்லியமற்ற பார்வைகளை கொண்டிருக்கலாம் என்பதை தயவுசெய்து கவனத்தில் கொள்ளுங்கள். அதன் தாய்மொழியில் உள்ள அசல் ஆவணம் அதிகாரப்பூர்வ மூலமாக கணிக்கப்பட வேண்டும். முக்கிய தகவல்களுக்கு, தொழில்முனைவோர் மனித மொழிபெயர்ப்பை பரிந்துரைக்கப்படுகின்றது. இந்த மொழிபெயர்ப்பைப் பயன்படுத்துவதால் ஏற்படும் தவறான புரிதல்கள் அல்லது தவறான விளக்கங்களுக்கு நாங்கள் பொறுப்பாளிகள் அல்ல. +**புரிந்துணர்வு**: +இந்த ஆவணம் [Co-op Translator](https://github.com/Azure/co-op-translator) என்ற செயற்கை நுண்ணறிவு மொழிபெயர்ப்புச் சேவையைப் பயன்படுத்தி மொழிபெயர்க்கப்பட்டுள்ளது. துல்லியத்திற்காக நாம் முயற்சிக்கிறோம் என்றாலும், தானாகக் செய்யப்பட்ட மொழிபெயர்ப்புகளில் பிழைகள் அல்லது தவறான தகவல்கள் இருக்கக்கூடும் என்பதை தயவுசெய்து கவனிக்கவும். அசல் ஆவணம் தனது இயல்புநிலைய மொழியில் அங்கீகாரம் பெற்ற மூலமாக கருதப்பட வேண்டும். முக்கியமான தகவல்களுக்கு, திறமையான மனித மொழிபெயர்ப்பை பரிந்துரைக்கிறோம். இந்த மொழிபெயர்ப்பைப் பயன்படுத்துவதால் ஏற்பட்டுள்ள எந்த தவறான புரிதல்கள் அல்லது தவறான விளக்கங்களுக்கும் நாங்கள் பொறுப்பேற்கமாட்டோம். \ No newline at end of file diff --git a/translations/ta/README.md b/translations/ta/README.md index bd735195a..047068693 100644 --- a/translations/ta/README.md +++ b/translations/ta/README.md @@ -10,204 +10,213 @@ [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -# ஆரம்ப நிலை வலைப் பயன்பாட்டுக்கான முன்னுரிமை பாடத்திட்டம் +# ஆரம்பநிலை நெட்வெர் மேம்பாட்டுக்கான பாடத்திட்டம் -Microsoft Cloud Advocates வழங்கும் 12 வார முழுமையான பாடத்திட்டத்துடன் வலை பயன்பாட்டின் அடிப்படைகளை கற்றுக்கொள்ளுங்கள். ஒவ்வொரு 24பாடமுமும் மற்றும் JavaScript, CSS மற்றும் HTML -ஐ கையாளும் செயல்முறைகள், Browser விசிறிகள் மற்றும் விண்வெளி விளையாட்டுகள் போன்ற செய்முறை செயலுந் திட்டங்களுடன் கூடி உள்கட்டளை பெறுகிறது. வினாக்கள், விவாதங்கள் மற்றும் நடைமுறை பணிகள் மூலம் ஈடுபடவும். உங்கள் திறன்களை மேம்படுத்தி அறிவுகொள்ளும் திறனை எளிமையாக ஆக்கவும் எங்கள் செயல்முறையான திட்ட அடிப்படையிலான கற்பித்தல் முறையை பயன்படுத்துங்கள். உங்கள் குறியீடு பயணத்தை இன்றே தொடங்குங்கள்! +Microsoft Cloud Advocates வழங்கும் 12 வார விரிவான பாடநெறியுடன் வலை மேம்பாட்டின் அடிப்படைகளை கற்றுக்கொள்க. 24 பாடங்களின் ஒவ்வொன்றும் ஜாவாஸ்கிரிப்ட், CSS மற்றும் HTML ஐ கரைதிருக்கும் திட்டங்களான டெராரியம்கள், உலாவி நீட்சிகள் மற்றும் விண்வெளி விளையாட்டுகள் மூலம் கையடக்கப் பயிற்சிகளுடன் ஆராய்கிறது. கேள்வி கேட்கிற, விவாதம் செய்க, மற்றும் நடைமுறை பணிகளை மேற்கொள். உங்கள் திறன்களை மேம்படுத்தவும் உங்கள் அறிவு நினைவாற்றலை எங்கள் பயிற்சி திட்டத்தின் மூலம் மேம்படுத்தவும். இன்று உங்கள் குறியீட்டு பயணம் தொடங்குங்கள்! -Azure AI Foundry Discord சமூகத்தில் இணைக +Azure AI Foundry Discord சமூகத்தில் சேரவும் [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -இந்த வளங்கள் பயன்படுத்த ஆரம்பிக்க பின்வரும் படிகளை பின்பற்றவும்: -1. **காப்புகளை பிரித்தெடுக்கவும்**: கிளிக் செய்யவும் [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) -2. **காப்புகளை இடமாற்றுக**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -3. [**Azure AI Foundry Discord இல் சேரவும் மற்றும் நிபுணர்கள் மற்றும் பிற டெவலப்பர்களை சந்திக்கவும்**](https://discord.com/invite/ByRwuEEgH4) +இந்த வளங்களை பயன்படுத்தத் தொடங்க இந்த படிகள் பின்பற்றவும்: +1. **காப்பகத்தை Fork செய்யவும்**: சொடுக்கவும் [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) +2. **காப்பகத்தை கிளோன் செய்யவும்**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +3. [**Azure AI Foundry Discord இல் கலந்துகொள் மற்றும் நிபுணர்களை மற்றும் இணை உருவாக்குநர்களை சந்தி**](https://discord.com/invite/ByRwuEEgH4) -### 🌐 பல மொழி ஆதரவு +### 🌐 பலமொழி ஆதரவு -#### GitHub செயல்பாட்டின் மூலம் ஆதரவு (தானாகவும் எப்போதும் புதுப்பிக்கப்படுபவும்) +#### GitHub செயல்பாட்டின் மூலம் ஆதரவு (தானியங்கி & எப்போதும் கன்டேட்) [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](./README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) -> **உள்ளூரில் காப்புப் பெற விரும்புகிறீர்களா?** - -> இந்த காப்பகம் 50+ மொழி மொழிபெயர்ப்புகளை கொண்டுள்ளது, இது பதிவிறக்க அளவை பெரிய அளவில் அதிகரிக்கிறது. மொழிபெயர்ப்புகள் இல்லாமல் காப்பு பெற sparse checkout பயன்படுத்தவும்: +> **உள்ளூர் கிளோன் செய்ய விரும்புகிறீர்களா?** +> +> இந்த காப்பகம் 50+ மொழி மொழிபெயர்ப்புகளை உள்ளடக்குகிறது, இது பதிவிறக்கக் காட்சியை பெருக்குகிறது. மொழிபெயர்ப்புகள் இல்லாமல் கிளோன் செய்ய sparse checkout ஐ பயன்படுத்தவும்: +> +> **Bash / macOS / Linux:** > ```bash > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > cd Web-Dev-For-Beginners > git sparse-checkout set --no-cone '/*' '!translations' '!translated_images' > ``` -> இது பாடத்திட்டம் முழுவதும் விரைவான பதிவிறக்கத்துடன் செய்ய தேவையான எல்லாவற்றையும் உங்களுக்கு வழங்கும். +> +> **CMD (Windows):** +> ```cmd +> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git +> cd Web-Dev-For-Beginners +> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" +> ``` +> +> இது விரைவான பதிவிறக்கத்துடன் படிப்பை முடிப்பதற்கான அனைத்து தேவைகளையும் உங்களுக்கு வழங்கும். -**மேலும் மொழிபெயர்ப்புகள் ஆதரவு தேவையெனில் [இங்கே](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) பட்டியலிடப்பட்டுள்ளன** +**மேலும் மொழிபெயர்ப்புகளுக்காக ஆதரவு தேவையெனில், இங்கு பட்டியலிட்டுள்ளன [here](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) -#### 🧑‍🎓 _நீங்கள் ஒரு மாணவரா?_ +#### 🧑‍🎓 _நீங்கள் மாணவரா?_ -[**மாணவர் மைய பக்கம்**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) பார்வையிடவும், அங்கு நீங்கள் ஆரம்பநிலை வளங்கள், மாணவர் தொகுப்புகள் மற்றும் இலவச சான்றிதழ் கூப்பன்களை பெறும் வழிகளையும் காண்பீர்கள். மாதாந்திரமாக உள்ளடக்கம் மாற்றப்படுவதால் இந்தப் பக்கத்தை உங்கள் பிரபலமானங்களில் சேர்த்து பரிசீலிக்கவும். +[**மாணவர் ஹப் பக்கம்**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) பார்க்கவும், அங்கே நீங்கள் ஆரம்பநிலை வளங்கள், மாணவர் பேக்குகள் மற்றும் இலவச சான்றிதழ் வவுச்சர் பெறும் வழிகளையும் காண்பீர்கள். மாதந்தோறும் உள்ளடக்கங்கள் மாறும் என்பதால் இந்தப் பக்கத்தைக் குறிச்சொல் வைத்து உடனுக்குடன் பார்க்கவும். -### 📣 அறிவிப்பு - புதிய GitHub Copilot Agent முறையின் சவால்கள்! +### 📣 அறிவிப்பு - புதிய GitHub Copilot Agent முறையிலான சவால்கள் நிறைவு செய்க! -புதிய சவாலைச் சேர்த்துள்ளோம், பெரும்பாலான அத்தியாயங்களில் "GitHub Copilot Agent Challenge 🚀" என பாருங்கள். இது GitHub Copilot மற்றும் Agent முறையைப் பயன்படுத்தி பல்வேறு சவால்களை நிறைவேற்றும் புதிய சவால் ஆகும். நீங்கள் Agent முறையை முன்பு பயன்படுத்தவில்லையெனில், இது உரை உருவாக்குவதற்கே அல்ல, கோப்புகளை உருவாக்கவும் திருத்தவும், கட்டளைகளை இயக்கவும் திறன் கொண்டது. +புதிய சவால் சேர்க்கப்பட்டது, பெரும்பாலான அத்தியாயங்களில் "GitHub Copilot Agent Challenge 🚀" என்பதைத் தேடுங்கள். இது GitHub Copilot மற்றும் Agent முறையைப் பயன்படுத்தி முடிக்க புதிய சவாலாகும். நீங்கள் முன்பு Agent முறையைப் பயன்படுத்தவில்லையெனில், இது உரையை உருவாக்குவததற்கு மட்டுமல்லாமல் கோப்புகளை உருவாக்கி மாற்றவும், கட்டளைகளை நடத்தவும் முடியும். -### 📣 அறிவிப்பு - _புதிய Project உருவாக்க Generative AI பயன்படுத்தவும்_ +### 📣 அறிவிப்பு - _உருவாக்கும் AI பயன்படுத்தும் புதிய திட்டம்_ -புதிய AI உதவியாளர் திட்டம் இப்போது சேர்க்கப்பட்டது, பார்வையிடவும் [project](./9-chat-project/README.md) +புதிய AI உதவியாளர் திட்டம் சேர்க்கப்பட்டது, சரிபார்க்கவும் [project](./9-chat-project/README.md) -### 📣 அறிவிப்பு - _JavaScript க்கான Generative AI_ புதிய பாடத்திட்டம் வெளியிடப்பட்டது +### 📣 அறிவிப்பு - _புதிய பாடத்திட்டம்_ ஜாவாஸ்கிரிப்டுக்கான உருவாக்கும் AI பற்றியவை வெளியிடப்பட்டது -புதிய Generative AI பாடத்திட்டத்தை தவறவிடாதீர்கள்! +எங்கள் புதிய உருவாக்கும் AI பாடத்திட்டம் தவறவிடாதீர்கள்! -தொடங்க [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) பார்வையிடுங்கள்! +தொடங்க [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) பார்க்கவும்! ![Background](../../translated_images/ta/background.148a8d43afde5730.webp) -- அடிப்படைகளிலிருந்து RAG வரை அனைத்தும் உள்ள பாடங்கள். -- வரலாற்றுச் கதாபாத்திரத்துடன் GenAI மற்றும் எங்கள் நண்பர் செயலியை பயன்படுத்தி தொடர்பு கொள்ளுங்கள். -- ரசிக்கக்கூடிய மற்றும் சுவாரஸ்யமான கதை; நீங்கள் காலப்பயணம் செய்கிறீர்கள்! +- அடிப்படைகள் முதல் RAG வரை பாடங்கள். +- GenAI மற்றும் எங்கள் துணை செயலியுடன் பண்புமிகு கதாப்பாத்திரங்களுடன் முத்திரை அமைத்து தொடர்பு கொள்ளுங்கள். +- சுவையாகவும் ஈர்க்கும் கதைக்களம், நீங்கள் காலப்பயணம் செய்யப் போகிறீர்கள்! ![character](../../translated_images/ta/character.5c0dd8e067ffd693.webp) -ஒவ்வொரு பாடத்திலும் ஒப்படைப்பு, அறிவு சோதனை மற்றும் கீழ்காணும் தலைப்புகளில் கற்றலை வழிநடத்தும் சவாலை உள்ளடக்கியுள்ளது: -- Prompting மற்றும் prompt பொறியியல் -- உரை மற்றும் பட தலைப்பு செயலிகள் உருவாக்கல் +ஒவ்வொரு பாடத்திலும் ஒரு பணியை நிறைவு செய்ய வேண்டும், அறிவு பரிசோதனை மற்றும் சில சவால்கள் உண்டாகும், அவை கீழ்காணும் தலைப்புகளில் உங்களுக்கு வழிகாட்டும்: +- ஃப்ராம்ட் மற்றும் ஃப்ராம்ட் என்ஜினியரிங் +- உரை மற்றும் பட செயலி உருவாக்கம் - தேடல் செயலிகள் -தொடங்க [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) பார்வையிடுங்கள்! +தொடங்க [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) பாருங்கள்! -## 🌱 ஆரம்பிக்க +## 🌱 தொடங்குதல் -> **ஆசிரியர்கள்**, இந்த பாடத்திட்டத்தை எப்படி பயன்படுத்துவது என்பது பற்றிய [சுலபக் குறிப்புகள்](for-teachers.md) சேர்த்துள்ளோம். உங்கள் கருத்துக்களை எங்கள் [விவாத வாரப்பட்டியில்](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) பகிரவும்! +> **ஆசிரியைர்கள்**, இந்த பாடத்திட்டத்தை எப்படி பயன்படுத்துவது என்பதற்கான சில பரிந்துரைகளை நாங்கள் [இதில் சேர்த்துள்ளோம்](for-teachers.md). உங்கள் கருத்துக்களை [எமது விவாத மன்றத்தில்](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) பகிர்வீர்கள் என நம்புகிறோம்! -**[கற்றலை விரும்புவோர்](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, ஒவ்வொரு பாடத்திற்கும் முன்-பாட வினாடிக்கணக்கு மூலம் தொடங்கி, பாடத்தைக் கற்றுக்கொள்ள, பின்வட்டார நடவடிக்கைகளை நிறைவேற்றி, பின்-பாட வினாடிக்கணக்குடன் உங்கள் புரிதலை பரிசோதியுங்கள். +**[கற்றவர்கள்](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, ஒவ்வொரு பாடத்திற்கும் முன்-கல்வி வினோதையுடன் ஆரம்பித்து, பாடத்திட்ட வாசிப்பை தொடரவும், பல்வேறு செயல்பாடுகளை முடிக்கவும் மற்றும் பின்கல்வி வினோதையுடன் உங்கள் புரிதலை சோதிக்கவும். -உங்கள் கற்றல் அனுபவத்தை மேம்படுத்த, பங்களிப்பாளர்களுடன் இணைந்து திட்டங்களைச் செயல்படுத்த பரிந்துரைக்கப்படுகிறது! விவாதங்கள் எங்கள் [விவாத வார்ப்பகலில்](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) வரவேற்கப்படுகின்றன, அங்கு நமது மடரேட்டர் குழு உங்கள் கேள்விகளுக்கு பதிலளிக்க தயார். +உங்கள் கற்றல் அனுபவத்தை மேம்படுத்த, திட்டங்களில் சேர்ந்து செயல்படும் சக மாணவர்களுடன் இணைந்து உழைக்கவும்! விவாதங்கள் எங்கள் [விவாத மன்றத்தில்](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) ஊக்கப்படுத்தப்படுகின்றன, அங்கு எமது மைதான அறிவாளிகள் உங்கள் கேள்விகளுக்கு பதில் அளிக்க காத்திருக்கிறார்கள். -மேலும் கல்விக்காக, [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon)ல் கூடுதல் படிப்புப் பொருட்களை ஆராய பரிந்துரைக்கப்படுகிறது. +உங்கள் கல்வியை இன்னும் விரிவுபடுத்த, கூடுதல் படிப்பு பொருட்களுக்காக [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) ஐ கண்டறிய பரிந்துரைக்கிறோம். -### 📋 உங்கள் சுற்றுச்சூழலை அமைப்பது +### 📋 உங்கள் சுற்றுப்புறத்தை அமைத்தல் -இந்த பாடத்திட்டத்திற்கு தேவையான வளர்ச்சி சூழல் தயார் நிலையில் உள்ளது! நீங்கள் தொடங்கும்போது, [Codespace](https://github.com/features/codespaces/) (_பிரவுசர் அடிப்படையிலான, நிறுவல்கள் தேவையில்லை_) அல்லது உங்கள் கணினியில் உள்ள உரை தொகுப்பியைப் பயன்படுத்தி [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) தேர்ந்தெடுக்கலாம். +இந்த பாடத்திட்டத்துக்கு முன்னேற்ற சூழல் தயார் நிலையில் உள்ளது! ஆரம்பிக்கும் போது நீங்கள் பாடத்திட்டத்தை [Codespace](https://github.com/features/codespaces/) (_உலாவி அடிப்படையிலான, நிறுவல்கள் தேவையில்லாத சூழல்_) அல்லது உங்கள் கணினியில் உள்ளே [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) போன்ற உரை தொகுப்பாளரைப் பயன்படுத்தி இயக்க முடியும். -#### உங்கள் காப்பக தொகுதியை உருவாக்குதல் -உங்கள் பணியை எளிதில் சேமிப்பதற்காக, இந்த காப்பகத்தின் உங்களுக்கான பதிப்பை உருவாக்க பரிந்துரைக்கப்படுகிறது. இதை செய்ய பக்கத்தின் மேல் பகுதியில் உள்ள **Use this template** பொத்தானை கிளிக் செய்யவும். இது உங்கள் GitHub கணக்கில் புதிய காப்பகத்தை உருவாக்கும். +#### உங்கள் காப்பகத்தை உருவாக்கல் +உங்கள் பணி சேமிக்க எளிதாக, உங்கள் சொந்த காப்பகத்தை உருவாக்க பரிந்துரைக்கப்படுகிறது. உள் பக்கத்தின் மேல் பகுதியில் உள்ள **Use this template** பொத்தானை அழுத்தி இதை செய்யலாம். இது பாடத்திட்ட காப்பளிக்காக உங்களது GitHub கணக்கில் புதிய காப்பகத்தை உருவாக்கும். -பின்வரும் படிகளை பின்பற்றவும்: -1. **காப்பகத்தை Fork செய்யவும்**: இத்தளத்தின் மேல் வலது மூலையில் உள்ள "Fork" பொத்தானை அழுத்தவும். -2. **காப்பகத்தை Clone செய்யவும்**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +இந்த படிகளை பின்பற்றவும்: +1. **காப்பகத்தை Fork செய்க**: இந்த பக்கத்தின் வலது மேல் மூலையில் உள்ள "Fork" பொத்தானை அழுத்தவும். +2. **காப்பகத்தை கிளோன் செய்க**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -#### Codespace-ல் பாடத்திட்டம் இயக்குவது +#### Codespace இல் பாடத்திட்டத்தை இயக்குதல் -உங்கள் உருவாக்கிய இந்த காப்பகத்தில் **Code** பொத்தானை அழுத்தி **Open with Codespaces** தேர்ந்தெடுக்கவும். இது உங்களுக்கு செயல்படும் புதிய Codespace உருவாக்கும். +நீங்கள் உருவாக்கிய காப்பகத்தில், **Code** பொத்தானை அழுத்தி **Open with Codespaces** ஐ தேர்ந்தெடுக்கவும். இது உங்களுக்கான புதிய Codespace-ஐ உருவாக்கும். ![Codespace](../../translated_images/ta/createcodespace.0238bbf4d7a8d955.webp) -#### உங்கள் கணினியில் உள்ளிருந்தே பாடத்திட்டம் இயக்குவது - -உங்கள் கணினியில் இந்த பாடத்திட்டத்தை இயக்க, ஒரு உரை தொகுப்பி, ஒரு பிரவுசர் மற்றும் கட்டளை வரி கருவி தேவை. நமது முதல் பாடம் [Programming Languages and Tools of the Trade அறிமுகம்](../../1-getting-started-lessons/1-intro-to-programming-languages) உங்களுக்கு அவற்றின் பல்வேறு மாற்றுகளைக் காணச் செய்வதாகும். +#### உங்கள் கணினியில் உள்ளே பாடத்திட்டத்தை இயக்குதல் -நாங்கள் பரிந்துரைக்கிறோம் [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) உங்கள் தொகுப்பியாக, இது [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) உடன் கூட உள்ளது. Visual Studio Code ஐ நீங்கள் இங்கே பதிவிறக்கலாம் [இங்கே](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +இந்த பாடத்திட்டத்தை உள்ளே இயக்க, உங்கள் கணினியில் உரை தொகுப்பாளர், உலாவி மற்றும் கட்டளை வரி கருவி தேவை. எமது முதல் பாடம் [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages) இவற்றை தேர்வு செய்யும் அறிவுரைகளை வழங்கும். - -1. உங்கள் காப்பகத்தைக் கணினியில் நகலெடுக்கவும். இதற்கு **Code** பொத்தானை அழுத்தி URL ஐ நகலெடுக்கவும்: +நாங்கள் பரிந்துரைக்குவது [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) என்ற தொகுப்பாளர். இது கட்டமைக்கப்பட்ட [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) உடன் வருகிறது. Visual Studio Code ஐ [இங்கே](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) பதிவிறக்கம் செய்யலாம். +1. உங்கள் களஞ்சியத்தை உங்கள் கணினியில் கிளோன் செய்யுங்கள். நீங்கள் இதை **Code** பொத்தானை கிளிக் செய்து URLஐ நகலெடுத்துக்கொள்வதும் மூலம் செய்யலாம்: [CodeSpace](./images/createcodespace.png) -அப்பொழுது, [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) உள்ள [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon)-ஐ திறந்து, கீழே கொடுக்கப்பட்ட கட்டளையை இயக்கவும், `` ஐ நீங்கள் தற்போது நகலெடுத்த URL-ஆக மாற்றவும்: + + பிறகு, [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) இல் உள்ள [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) ஐத் திறந்து, கீழ்கண்ட கட்டளையை இயக்குங்கள், `` என்பதற்கு நீங்கள் நடப்பில் நகலெடுத்த URLஐ மாற்றி: ```bash git clone ``` -2. Visual Studio Code-இல் கோப்புறை திறக்கவும். இது **File** > **Open Folder** என்பதை கிளிக் செய்து, நீங்கள் இப்பொழுது கிளோன் செய்த கோப்புறையை தேர்ந்தெடுக்கலாம். +2. Visual Studio Code இல் கோப்புறை(ஐ) திறக்கவும். நீங்கள் இதை **File** > **Open Folder** என்பவற்றை கிளிக் செய்து, நீங்கள் கிளோன் செய்த கோப்புறை(ஐ) தேர்ந்தெடுக்கவும் செய்யலாம். -> பரிந்துரைக்கப்பட்ட Visual Studio Code விரிவுரைகள்: +> பரிந்துரைக்கப்பட்ட Visual Studio Code நீட்சிகள்: > -> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - Visual Studio Code உள்ளே HTML பக்கங்களை முன்னோட்டம் பார்க்க -> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - உங்கள் குறியீட்டை விரைவாக எழுத உதவ +> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - Visual Studio Code இல் HTML பக்கங்களை முன்னோட்டம் காண +> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - உங்கள் குறியீட்டை வேகமாக எழுத உதவும் -## 📂 ஒவ்வொரு பாடத்திலும் உள்ளது: +## 📂 ஒவ்வொரு பாடமும் அடங்கும்: -- விருப்பத்தேர்ந்த ஸ்கெட்ச் நோட் -- விருப்பத்தேர்ந்த கூடுதல் காணொளி -- பாடத்திற்கு முன் வெப்ப ஊட்டக் க்விஸ் -- எழுதப்பட்ட பாடம் -- திட்ட அடிப்படையிலான பாடங்களுக்கு, திட்டத்தை எப்படி கட்டுவது என்பதற்கான படி படியாக வழிகாட்டல்கள் -- அறிவு சரிபார்ப்புகள் +- விருப்பமான ஸ்கெட்ச் நோட் +- விருப்பமான கூடுதல் வீடியோ +- பாடத்திற்கு முந்தின ஆய்வுக் கேள்வி +- எழுதிய பாடம் +- திட்ட அடிப்படையிலான பாடங்களுக்கு, திட்டத்தை கட்டடண பயிற்சிகள் +- அறிவு பரிசோதனைகள் - ஒரு சவால் - கூடுதல் வாசிப்பு -- பணிக்கான ஒப்படைப்பு -- [பாடத்திற்கு பின் க்விஸ்](https://ff-quizzes.netlify.app/web/) +- பணிஎழுத்து +- [பாடம் முடித்த பிறகு கேள்வி](https://ff-quizzes.netlify.app/web/) -> **க்விஸ்களின் குறிப்பு**: அனைத்து க்விஸ்களும் Quiz-app கோப்புறையில் உள்ளன,ஒவ்வொரு க்விசும் மூன்று கேள்விகளுடன் 48 க்விஸ்கள் உள்ளன. இவை [இங்கே](https://ff-quizzes.netlify.app/web/) கிடைக்கின்றன; Quiz app-ஐ உள்ளூரில் இயக்க அல்லது Azure-க்கு பரப்ப முடியும்; `quiz-app` கோப்புறையில் bulunan வழிமுறைகளை பின்பற்றவும். +> **கேள்விகளுக்கு ஒரு குறிப்பு**: அனைத்து கேள்விகள் Quiz-app கோப்புறையில் உள்ளன, ஒவ்வொன்றும் மூன்று கேள்விகளால் ஆன 48 கேள்விகள். இவற்றை [இங்கே](https://ff-quizzes.netlify.app/web/) பெறலாம். கேள்வி செயலியை உள்ளகமாக இயக்கவோ அல்லது Azure இல் வெளியிடவோ செய்யலாம்; `quiz-app` கோப்புறையில் உள்ள வழிமுறைகளை பின்பற்றவும். ## 🗃️ பாடங்கள் -| | திட்டப் பெயர் | கற்பிக்கப்பட்ட கருத்துக்கள் | கற்றல் நோக்குகள் | இணைக்கப்பட்ட பாடம் | ஆசிரியர் | +| | திட்டத்தின் பெயர் | கற்பிக்கப்பட்ட கருத்துக்கள் | கற்றல் நோக்கங்கள் | இணைக்கப்பட்ட பாடம் | ஆசிரியர் | | :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | -| 01 | தொடக்கம் | நிரலாக்கம் அறிமுகம் மற்றும் தொழில்நுட்ப கருவிகள் | பெரும்பான்மை நிரலாக்க மொழிகளின் அடிப்படைகளை மற்றும் தொழில்முறை டெவலபர்களுக்கு உதவும் மென்பொருளைப் பற்றி கற்றல் | [நிரலாக்க மொழிகள் மற்றும் தொழில்நுட்ப கருவிகள் அறிமுகம்](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | -| 02 | தொடக்கம் | GitHub அடிப்படைகள், குழுவென வேலை செய்யும் கற்றல் | உங்கள் திட்டத்தில் GitHub எப்படி பயன்படுத்துவது, மற்றவர்களுடன் இணைந்து நிரலை எப்படி பராமரிப்பது | [GitHub அறிமுகம்](./1-getting-started-lessons/2-github-basics/README.md) | Floor | -| 03 | தொடக்கம் | அணுகல் சாத்தியம் | வலை அணுகல் சாத்தியத்தின் அடிப்படைகளை கற்றல் | [அணுகல் சாத்தியம் அடிப்படைகள்](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | -| 04 | JS அடிப்படை | JavaScript தரவு வகைகள் | JavaScript தரவு வகைகளின் அடிப்படைகள் | [தரவு வகைகள்](./2-js-basics/1-data-types/README.md) | Jasmine | -| 05 | JS அடிப்படை | செயல்பாடுகள் மற்றும் முறைமைகள் | பயன்பாட்டு தரிணை இயக்கக் கையேடுகளுக்கான செயல்பாடுகள் மற்றும் முறைமைகள் பற்றி கற்றல் | [செயற்பாடுகள் மற்றும் முறைமைகள்](./2-js-basics/2-functions-methods/README.md) | Jasmine மற்றும் Christopher | -| 06 | JS அடிப்படை | JS மூலம் முடிவெடுத்தல் | உங்கள் குறியீட்டில் முடிவெடுத்தல் முறைகள் பயன்படுத்தி நிபந்தனைகளை உருவாக்குவது எப்படி என்பதை கற்றல் | [முடிவெடுத்தல்](./2-js-basics/3-making-decisions/README.md) | Jasmine | -| 07 | JS அடிப்படை | வரிசைகள் மற்றும் வழுக்கல்கள் | JavaScript-ல் வரிசைகள் மற்றும் வழுக்கல்களுடன் தரவை பணியாற்றுவது | [வரிசைகள் மற்றும் வழுக்கல்கள்](./2-js-basics/4-arrays-loops/README.md) | Jasmine | -| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML பயிற்சி | ஆன்லைன் டெராரியம் உருவாக்க HTML கட்டமைக்கவும், அமைப்பை கட்டமைக்க கவனம் செலுத்துகின்றது | [HTML அறிமுகம்](./3-terrarium/1-intro-to-html/README.md) | Jen | -| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS பயிற்சி | ஆன்லைன் டெராரியம் அலங்கரிக்க CSS கட்டமைக்கவும், பக்கத்தை பதில் அளிக்கும் வகையில் அடிப்படைகளை கற்றல் | [CSS அறிமுகம்](./3-terrarium/2-intro-to-css/README.md) | Jen | -| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript மூடுகள், DOM கையாளுதல் | டெராரியம் ஒரு இழுத்து/விடும் இடைமுகமாக செயல்பட JavaScript உருவாக்கவும், மூடுகள் மற்றும் DOM கையாளுதலை கவனித்து | [JavaScript மூடுகள், DOM கையாளுதல்](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | -| 11 | [தட்டச்சு விளையாட்டு](./4-typing-game/solution/README.md) | தட்டச்சு விளையாட்டு உருவாக்குதல் | உங்கள் JavaScript செயலிக்கு விசைப்பலகை நிகழ்வுகளை பயன்படுத்தி மனசாட்சியை இயக்குவது எப்படி என்பதை கற்றல் | [நிகழ்வு இயக்க நிரலாக்கம்](./4-typing-game/typing-game/README.md) | Christopher | -| 12 | [பசுமை உலாவி நீட்டிப்பு](./5-browser-extension/solution/README.md) | உலாவிகளுடன் வேலை செய்தல் | உலாவிகள் எப்படி வேலை செய்கின்றன, அவற்றின் வரலாறு, உலாவி நீட்டிப்பின் முதல் கூறுகளை உருவாக்குவது எப்படி | [உலாவிகள் பற்றி](./5-browser-extension/1-about-browsers/README.md) | Jen | -| 13 | [பசுமை உலாவி நீட்டிப்பு](./5-browser-extension/solution/README.md) | படிவம் உருவாக்கல், API அழைப்பு மற்றும் உள்ளூர் சேமிப்பில் மாறிகள் சேமித்தல் | API அழைக்க உங்கள் உலாவி நீட்டிப்பிற்கான JavaScript கூறுகளை உருவாக்குதல், உள்ளூர் சேமிப்பில் உள்ள மாறிகளை பயன்படுத்தல் | [APIs, படிவங்கள் மற்றும் உள்ளூர் சேமிப்பு](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | -| 14 | [பசுமை உலாவி நீட்டிப்பு](./5-browser-extension/solution/README.md) | உலாவியில் பின்னணி செயலிகள், வலை செயல்திறன் | நீட்டிப்பின் அடையாளத்தை நிர்வகிக்க உலாவியின் பின்னணி செயல்களை பயன்படுத்தல்; வலை செயல்திறன் மற்றும் சில மேம்பாடுகள் பற்றி கற்றல் | [பின்னணி செயலிகள் மற்றும் செயல்திறன்](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | -| 15 | [வானில் விளையாட்டு](./6-space-game/solution/README.md) | JavaScript கொண்டு மேம்பட்ட விளையாட்டு உருவாக்கல் | கிளாஸ்கள் மற்றும் தொகுப்புகள் பயன்படுத்தி உட்புகுத்தல் மற்றும் Pub/Sub மாதிரியை கற்றல், விளையாட்டு கட்டுவதற்கான தயார் | [மேம்பட்ட விளையாட்டு உருவாக்கம் அறிமுகம்](./6-space-game/1-introduction/README.md) | Chris | -| 16 | [வானில் விளையாட்டு](./6-space-game/solution/README.md) | கேன்வாஸ் வரைச்சல் | திரையில் கூறுகளை வரைச்ச கேன்வாஸ் API பற்றி கற்றல் | [கேன்வாஸுக்கு வரைச்சல்](./6-space-game/2-drawing-to-canvas/README.md) | Chris | -| 17 | [வானில் விளையாட்டு](./6-space-game/solution/README.md) | திரையில் கூறுகளை நகர்த்துதல் | கார்டிசியன் ஒருங்கிணைப்புகள் மற்றும் கேன்வாஸ் API-ஐ பயன்படுத்தி கூறுகளை இயக்குவது எப்படி என்பதை கண்டுபிடிக்க | [குறிப்புகளை நகர்த்துதல்](./6-space-game/3-moving-elements-around/README.md) | Chris | -| 18 | [வானில் விளையாட்டு](./6-space-game/solution/README.md) | மோதல் கண்டறிதல் | விசையொத்துக்களை பயன்படுத்தி கூறுக்கள் மோதுதல் மற்றும் விளையாட்டு செயல்திறனை உறுதி செய்ய குளிர்ச்சிக் காரியத்தை வழங்குதல் | [மோதல் கண்டறிதல்](./6-space-game/4-collision-detection/README.md) | Chris | -| 19 | [வானில் விளையாட்டு](./6-space-game/solution/README.md) | மதிப்பெண் வைத்தல் | விளையாட்டின் நிலை மற்றும் செயல்திறன் அடிப்படையில் கணிதக் கணக்கீடுகளை செய்தல் | [மதிப்பெண் வைத்தல்](./6-space-game/5-keeping-score/README.md) | Chris | -| 20 | [வானில் விளையாட்டு](./6-space-game/solution/README.md) | விளையாட்டை நிறுத்தல் மற்றும் மீண்டும் தொடங்குதல் | விளையாட்டை நிறுத்துதல் மற்றும் மீண்டும் தொடங்குதல் பற்றி கற்றல், சொத்துக்களை சுத்தம் செய்தல் மற்றும் மாறிகள் மதிப்புகளை மீட்டமைத்தல் | [முடிவுநிலை](./6-space-game/6-end-condition/README.md) | Chris | -| 21 | [வங்கி செயலி](./7-bank-project/solution/README.md) | வலை பயன்பாட்டில் HTML வார்ப்புருக்கள் மற்றும் வழிகள் | ஒரு பலப்பக்க வலைதள கட்டமைப்பின் அடித்தளத்தை வழிசெலுத்தல் மற்றும் HTML வார்ப்புருக்கள் பயன்படுத்தி உருவாக்குவது எப்படி கற்றல் | [HTML வார்ப்புருக்கள் மற்றும் வழிகள்](./7-bank-project/1-template-route/README.md) | Yohan | -| 22 | [வங்கி செயலி](./7-bank-project/solution/README.md) | உள்நுழைவு மற்றும் பதிவு படிவத்தை உருவாக்குதல் | படிவங்களை உருவாக்கும் முறைகள் மற்றும் செல்லுபடிகள் சோதனை நடைமுறைகளை கற்றல் | [படிவங்கள்](./7-bank-project/2-forms/README.md) | Yohan | -| 23 | [வங்கி செயலி](./7-bank-project/solution/README.md) | தரவைப் பெற்றல் மற்றும் பயன்படுத்தும் முறைகள் | உங்கள் செயலியிலிருந்து தரவு எப்படி ஓடுபது, அதை எப்படிப் பெறுவது, சேமிப்பது மற்றும் அகற்றுவது | [தரவு](./7-bank-project/3-data/README.md) | Yohan | -| 24 | [வங்கி செயலி](./7-bank-project/solution/README.md) | நிலை மேலாண்மை கருத்துக்கள் | உங்கள் செயலி நிலையை எப்படி காப்பாற்றுகிறது மற்றும் அதை நிரலாக பராமரிப்பது எப்படி என்பதை கற்றல் | [நிலை மேலாண்மை](./7-bank-project/4-state-management/README.md) | Yohan | -| 25 | [Browser/VScode Code](../../8-code-editor) | VScode-இல் வேலை செய்தல் | குறியீட்டு தொகுப்பியலில் எப்படி வேலை செய்வது கற்றல்| [VScode குறியீடு தொகுப்பியலைப் பயன்படுத்துதல்](./8-code-editor/1-using-a-code-editor/README.md) | Chris | -| 26 | [AI உதவியாளர்கள்](./9-chat-project/README.md) | AI உடன் வேலை செய்தல் | உங்கள் சொந்த AI உதவியாளரை உருவாக்குவது எப்படி கற்றல் | [AI உதவியாளர் திட்டம்](./9-chat-project/README.md) | Chris | +| 01 | Getting Started | நிரலாக்க அறிமுகம் மற்றும் கருவிகள் | பெரும்பாலான நிரலாக்க மொழிகளின் அடிப்படைகளை அறிந்து, தொழில்முறை டெவலப்பர்களின் பணிக்கான மென்பொருட்களைப் பற்றி அறிதல் | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | Getting Started | GitHub அடிப்படைகள், குழுவுடன் பணியாற்றுதல் | உங்கள் திட்டத்தில் GitHub ஐ எப்படி பயன்படுத்துவது, மற்றவர்களுடன் குறியீட்டு தளத்தில் கூட்டிணைவது | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | Getting Started | அணுகல்திறன் | வலை அணுகல்திறன் அடிப்படைகளை கற்றுக்கொள்ளவும் | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | JS Basics | ஜாவாஸ்கிரிப்ட் தரவுகளின் வகைகள் | ஜாவாஸ்கிரிப்ட் தரவுகளின் அடிப்படைகள் | [Data Types](./2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS Basics | செயல்பாடுகள் மற்றும் முறைகள் | பயன்பாட்டின் காரியஒழுங்கை நிர்வகிக்கும் செயல்பாடுகள் மற்றும் முறைகள் பற்றி கற்றுக்கொள்ளவும் | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | +| 06 | JS Basics | JS ஆகிய மூலம் முடிவெடுத்தல் | உங்கள் குறியீட்டில் முடிவெடுத்தல் முறைகளைப் பயன்படுத்தி நிபந்தனைகளை உருவாக்குவது எப்படி என்பதைக் கற்றுக்கொள்ளவும் | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS Basics | வரிசைகள் மற்றும் மீண்டும் சுழற்சிகள் | ஜாவாஸ்கிரிப்ட் வரிசைகள் மற்றும் மீண்டும் சுழற்சிகளைப் பயன்படுத்தி தரவை கையாளவும் | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML நடைமுறை | ஆன்லைன் டெரேரியத்தை உருவாக்க HTML உருவாக்கு, அமைப்பை கட்டமைப்பதில் கவனம் செலுத்துக | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS நடைமுறை | ஆன்லைன் டெரேரியத்தை வடிவமைக்க CSS உருவாக்கு, அடிப்படைகள் மற்றும் பக்கத்தை பதிலளிக்கும் முறைகள் பற்றியும் கவனம் செலுத்துக | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [Terrarium](./3-terrarium/solution/README.md) | ஜாவாஸ்கிரிப்ட் மூடுபனிகள், DOM கையாள்தல் | டெரேரியத்தை ஒரு டிராக்/டிராப் இடைமுகமாக செயல்படுத்த ஜாவாஸ்கிரிப்டை உருவாக்கு, மூடுபனிகள் மற்றும் DOM கையாள்தலில் கவனம் செலுத்துக | [JavaScript Closures, DOM manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [Typing Game](./4-typing-game/solution/README.md) | தட்டச்சு விளையாட்டை உருவாக்கு | கீபோர்டு நிகழ்வுகளைப் பயன்படுத்தி உங்கள் ஜாவாஸ்கிரிப்ட் செயலியின் கோட்பாட்டை இயக்குவது எப்படி என்பதைக் கற்றுக்கொள்ளவும் | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher | +| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | உலாவிகளுடன் பணியாற்றுதல் | உலாவிகள் எப்படி செயல்படுகின்றன, அவற்றின் வரலாறு மற்றும் உலாவி நீட்சியின் முதல் கூறுகளை உருவாக்குவது எப்படி என்பதைக் கற்றுக்கொள்ளவும் | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | படிவம் உருவாக்கல், API அழைக்கல் மற்றும் உள்ளூர் சேமிப்பில் மாறிகள் சேமித்தல் | உள்ளூர் சேமிப்பில் சேமித்த மாறிகளைப் பயன்படுத்தி API அழைக்க உலாவி நீட்சியின் ஜாவாஸ்கிரிப்ட் கூறுகளை உருவாக்குங்கள் | [APIs, Forms, and Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | உலாவியில் பின்புல செயலிகள், வலை செயல்திறன் | நீட்சியின் ஐகானை நிர்வகிப்பதற்காக உலாவியின் பின்புல செயலிகளைப் பயன்படுத்தவும்; வலை செயல்திறன் மற்றும் சில மேம்பாடுகளை கற்றுக்கொள்ளவும் | [Background Tasks and Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [Space Game](./6-space-game/solution/README.md) | ஜாவாஸ்கிரிப்ட் மூலமாக மேம்பட்ட விளையாட்டு உருவாக்குதல் | வகுப்புகள் மற்றும் உருவாக்கலைப் பயன்படுத்தி ஒத்திசைக்கையாள்கையைப் பற்றியும் Pub/Sub மாதிரியைப் பற்றியும் கற்றுக்கொள்ளவும் | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris | +| 16 | [Space Game](./6-space-game/solution/README.md) | கேன்வாஸ் வரைபடம் | திரைக்கு கூறுகளை வரைய கண்வாஸ் API பற்றி கற்றுக்கொள்ளவும் | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [Space Game](./6-space-game/solution/README.md) | திரையில் கூறுகளை நகர்த்தல் | கார்டீசியன் இணைவரிசைகள் மற்றும் கேன்வாஸ் APIஐப் பயன்படுத்தி கூறுகள் எப்படி இயக்கம் பெறுகின்றன என்பதை அறிக | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [Space Game](./6-space-game/solution/README.md) | மோதல் கண்டறிதல் | முக்கிய அழுத்தங்களைப் பயன்படுத்தி கூறுகள் ஒருமொருவற்குப் பதிலளித்து மோதச் செய்க; விளையாட்டு செயல்திறனை உறுதி செய்ய ஒரு குளிர்ச்சி செயல்பாட்டைச் செய்க | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [Space Game](./6-space-game/solution/README.md) | மதிப்பெண் கண்காணித்தல் | விளையாட்டின் நிலை மற்றும் செயல்திறன் அடிப்படையில் கணிதக் கணக்கீடுகளைச் செய்க | [Keeping Score](./6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [Space Game](./6-space-game/solution/README.md) | விளையாட்டை முடித்தல் மற்றும் மீண்டும் துவக்கல் | விளையாட்டை முடித்தல் மற்றும் மீண்டும் துவக்குவது பற்றி கற்றுக்கொள்ளவும், சொந்தச் சொத்துகளை சுத்தம் செய்யவும் மற்றும் மாறி மதிப்புகளை மீட்டமைக்கவும் | [The Ending Condition](./6-space-game/6-end-condition/README.md) | Chris | +| 21 | [Banking App](./7-bank-project/solution/README.md) | வலை செயலியில் HTML மாதிரிகள் மற்றும் பாதைகள் | நெடுஞ்சாலைகளையும் HTML மாதிரிகளையும் பயன்படுத்தி பலப் பக்க வலைத்தள உருவமைப்பை உருவாக்குவது எப்படி என்பதைக் கற்றுக்கொள்ளவும் | [HTML Templates and Routes](./7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [Banking App](./7-bank-project/solution/README.md) | உள்நுழைவும் பதிவு படிவமும் உருவாக்கல் | படிவங்களை உருவாக்குவது மற்றும் சரிபார்ப்பு நடைமுறைகளை கையாள்வது பற்றி கற்றுக்கொள்ளவும் | [Forms](./7-bank-project/2-forms/README.md) | Yohan | +| 23 | [Banking App](./7-bank-project/solution/README.md) | தரவு பெற்றலும் பயன்பாடும் முறைகள் | உங்கள் செயலியில் தரவு எப்படி போகிறது, அதை எவ்வாறு பெறுவது, சேமிப்பது மற்றும் நீக்கும் முறைகள் | [Data](./7-bank-project/3-data/README.md) | Yohan | +| 24 | [Banking App](./7-bank-project/solution/README.md) | மாநில மேலாண்மை கருத்துக்கள் | உங்கள் செயலி மாநிலத்தை எவ்வாறு பராமரிக்கிறது மற்றும் அதை நிரலாக்க முறையில் எவ்வாறு நிர்வகிப்பது | [State Management](./7-bank-project/4-state-management/README.md) | Yohan | +| 25 | [Browser/VScode Code](../../8-code-editor) | VScode உடன் பணியாற்றுதல் | குறியீடு ஆசிரியரை பயன்படுத்துவது எப்படி கற்றுக்கொள்ளவும் | [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | +| 26 | [AI Assistants](./9-chat-project/README.md) | AI உடன் பணியாற்றுதல் | உங்கள் சொந்த AI உதவியாளரை உருவாக்குவது எப்படி கற்றுக்கொள்ளவும் | [AI Assistant project](./9-chat-project/README.md) | Chris | -## 🏫 கற்பித்தல் முறைகள் +## 🏫 கல்வி தத்துவம் -எங்கள் பாடத்திட்டம் இரண்டு முக்கியக் கல்விப்பார்வை தத்துவங்களையுடன் வடிவமைக்கப்பட்டுள்ளது: -* திட்ட அடிப்படையிலான கற்றல் -* அடிக்கடி க்வீஸ்கள் +எங்கள் பாடத்திட்டம் இரண்டு முக்கிய கல்வி தத்துவங்கள் மனதில் கொண்டு வடிவமைக்கப்பட்டுள்ளது: +* திட்ட அடிப்படையிலான கற்பித்தல் +* அடிக்கடி கேள்விகள் -இந்த நிரல் JavaScript, HTML, CSS அடிப்படைகளை பெற்றுத் தருகிறது, மற்றும் இன்றைய வலை டெவலபர்கள் பயன்படுத்தும் சமீபத்திய கருவிகள் மற்றும் முறைகளை கற்றுக் கொடுக்கிறது. மாணவர்கள் தட்டச்சு விளையாட்டு, மெய்நிகர் டெராரியம், சூழலின் நட்பு உலாவி நீட்டிப்பு, விண்வெளி வென்றுபோவது போன்ற விளையாட்டு, வணிக நிறுவனங்களுக்கு வங்கி செயலி போன்றவற்றை கட்டி அனுபவம் பெற வாய்ப்பு பெறுவர். தொடர் முடிவில், மாணவர்கள் வலை மேம்பாட்டு குறித்த உறுதியான அறிவைப் பெற்றிருக்கிறார்கள். +இந்தத் திட்டம் ஜாவாஸ்கிரிப்ட், HTML, CSS அடிப்படைகளை மற்றும் இன்றைய வலை டெவலப்பர்கள் பயன்படுத்தும் சமீபத்திய கருவிகள் மற்றும் நுட்பங்களை கற்பிக்கிறது. மாணவர்கள் தட்டச்சு விளையாட்டு, மெய்நிகர் டெரேரியம், பசுமை உலாவி நீட்டிப்பு, விண்வெளி தாக்குதல் பாணி விளையாட்டு மற்றும் வங்கி செயலியை உருவாக்கி செயல்பாட்டுக் கற்றல் வாய்ப்பைப் பெறுவார்கள். தொடரின் முடிவில், மாணவர்கள் வலை வளர்ச்சியில் மூலபொருளான கற்பிதலைப் பெறுவார்கள். -> 🎓 இந்த பாடத்திட்டத்தின் முதல் சில பாடங்களை மைக்ரோசாப்ட் லேர்னில் [கற்றல் பாதை](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) ஆக எடுத்துக்கொள்ளலாம்! +> 🎓 நீங்கள் இந்தப் பாடத்திட்டத்தில் ஆரம்ப சில பாடங்களை Microsoft Learn இல் [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) என்ற முறையில் எடுத்துக்கொள்ளலாம்! -உள்ளடக்கம் திட்டங்களுடன் இணைக்கப்படுவதன் மூலம் மாணவர்களுக்கு கற்றலின் ஆர்வம் அதிகரிக்கப்படும் மற்றும் கருத்துக்களின் நினைவாற்றல் மேம்படும். மேலும், JavaScript அடிப்படைகளை அறிமுகப்படுத்த சில முதன்மை பாடங்களை உருவாக்கியுள்ளோம், அவற்றுக்கு "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" வீடியோ திரட்டலின் காணொளி இணைக்கப்பட்டுள்ளது, இதில் சில ஆசிரியர்கள் இந்த பாடத்திட்டத்துக்காக உடனடியாக பங்களித்துள்ளனர். +திட்டங்களுக்கு உள்ளடடை ஒப்பிடுவதால், மாணவர்களுக்கு கற்றல் செயல்முறை சுவாரஸ்யமாகவும் கருத்துக்கள் நிலைத்திருக்கும் வகையாகவும் அமைக்கப்படுகிறது. நாங்கள் சில ஆரம்ப ஜாவாஸ்கிரிப்ட் அடிப்படை பாடங்களை உருவாக்கி, "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" என்ற வீடியோ பாட தொகுப்பில் இருந்து ஒரு வீடியோவுடன் இணைத்துள்ளோம், இதில் சில ஆசிரியர்கள் இதற்கான பாடத்திட்டத்தில் பங்களித்துள்ளனர். -மேலும், வகுப்புக்கு முன்பு குறைந்த மதிப்புள்ள க்விஸ் ஒரு தலைப்பைப் பற்றி கற்றல் நோக்கத்தை மாணவர்களில் உருவாக உதவுகிறது, வகுப்புக்குப் பிறகு இரண்டாவது க்விஸ் மேலும் நினைவாற்றலை உறுதி செய்யும். இந்த பாடத்திட்டம் நெகிழ்வானதும் ரசிக்கத்தக்கதுமானதும் ஆக வடிவமைக்கப்பட்டுள்ளது; அதை முழுமையாகவோ ஒரு குறிப்பிட்ட பகுதியை மட்டும் எடுத்துக்கொண்டு கற்றுக்கொள்ளலாம். திட்டங்கள் சிறியதாகத் துவங்கி, 12 வாரங்களுக்குப் பிறகு ஒழுங்குபடுத்தப்பட்ட மற்றும் சிக்கலானவையாக மாறும். +மேலும், வகுப்புக்கு முன்னர் குறைந்த மோசடியான வினாடி வினா மாணவரின் கற்கும் நோக்கத்தை நிறுவுவதாகும், வகுப்புக்குப் பிறகு இரண்டாம் வினாடி வினா கூடுதல் நினைவைக் உறுதி செய்கிறது. இந்த பாடத்திட்டம் நெகிழ்வுடையது மற்றும் வேடிக்கையாக வடிவமைக்கப்பட்டது; முழுவதும் அல்லது பகுதியாய் எடுத்துக்கொள்ளலாம். திட்டங்கள் சிறிது அளவில் துவங்கி, 12 வார காலக்கட்டம் முடிவில் progressively சிக்கலானவையாக மாறுகின்றன. -JavaScript வழிமுறைகளை அறிமுகப்படுத்தாமல், வலை டெவலப்பராக அடிப்படைக் கைவசமோடு செயல்பட முதலில் கவனம் செலுத்துவதை நாம் மேற்கொண்டுள்ளோம்; மேலும் இந்த பாடத்திட்டத்தை முடிப்பதற்கான அடுத்த நல்ல படி Node.js குறித்து "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)" மற்றொரு வீடியோ திரட்டலைக் கற்றுக்கொள்வதுதான். +நாங்கள் தயாராக ஜாவாஸ்கிரிப்ட் கட்டமைப்புகளை அறிமுகப்படுத்தாமல், ஒரு கட்டமைப்பை ஏற்குமாறு முன்னர் அடிப்படை திறன்களை கவனிக்கவுள்ளோம். இந்த பாடத்திட்டத்தை முடித்த பிறகு அடுத்த நல்ல படி Node.js பற்றி மற்றொரு வீடியோ தொகுப்பாகவும் "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)" கற்றுக்கொள்ளலாம். -> எங்கள் [நடத்தை அனுசரிப்பு](CODE_OF_CONDUCT.md) மற்றும் [ஆதரவு](CONTRIBUTING.md) வழிமுறைகளைப் பார்வையிடவும். உங்கள் கட்டுமான சுயவிவரத்தை எதிர்பார்க்கிறோம்! +> எங்கள் [Code of Conduct](CODE_OF_CONDUCT.md) மற்றும் [Contributing](CONTRIBUTING.md) வழிகாட்டிகளுக்கு பார்வையிடவும். உங்கள் கட்டுமான கருத்துக்களை வரவேற்கின்றோம்! -## 🧭 ஆப்லைன் அணுகல் +## 🧭 ஆஃப்லைன் அணுகல் -[Docsify](https://docsify.js.org/#/) கொண்டு இந்த அடிக்குறிப்பை ஆப்லைனில் இயக்கலாம். இந்த ரெப்போகை Fork செய்து, உங்கள் உள்ளூரில் [Docsify-ஐ நிறுவி](https://docsify.js.org/#/quickstart), பிறகு இந்த ரெப்போவின் ரூட் கோப்புறையில் `docsify serve` என தட்டவும். தளம் உங்கள் உள்ளூர் கணினியில் போர்ட் 3000-ல் இயக்கப்படும்: `localhost:3000`. +[Docsify](https://docsify.js.org/#/) ஐப் பயன்படுத்தி இந்த அறிக்கையை ஆஃப்லைனில் இயக்கலாம். இந்த களஞ்சியத்தை ஃபோர்க் செய்து, உங்கள் உள்ளூர் இயந்திரத்தில் [Docsify ஐ நிறுவி](https://docsify.js.org/#/quickstart), பின்னர் இக்களஞ்சியத்தின் அடிப்புற கோப்புறையில் `docsify serve` என்ற கட்டளையை தட்டுங்கள். இந்த வலைத்தளம் பங்கேற்பாளரின் உள்ளூரில் port 3000 இல் வழங்கப்படும்: `localhost:3000`. ## 📘 PDF +அனைத்துப் பாடங்களின் PDF இங்கே [இங்கே](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) காணப்படலாம். -அனைத்து பாடங்களின் PDF இங்கே கிடைக்கும் [இங்கே](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). +## 🎒 பிற பாடநெறிகள் -## 🎒 பிற பாடங்கள் -எங்கள் குழு மற்றபடி பாடங்களையும் உருவாக்குகிறது! இதைப் பார்த்து கொள்ளவும்: +எங்கள் குழு பிற பாடநெறிகளையும் உருவாக்குகிறது! பாருங்கள்: ### LangChain @@ -251,21 +260,21 @@ JavaScript வழிமுறைகளை அறிமுகப்படுத ## உதவி பெறுதல் -நீங்கள் சிக்கலில் இருந்தால் அல்லது AI பயன்பாடுகள் உருவாக்குவதில் கேள்விகள் இருந்தால். MCP பற்றி விவாதங்களில் மற்ற கற்றார்களுடன் மற்றும் அனுபவம் வாய்ந்த டெவலப்பர்களுடன் இணைக்கவும். இது ஒரு ஆதரவு சமூகமாகும், இங்கு கேள்விகள் வரவேற்கப்படுகின்றன மற்றும் அறிவு சுதந்திரமாக பகிரப்படுகின்றது. +நீங்கள் சிக்கிக்கொள்ளலா அல்லது AI செயலிகளை உருவாக்குவதில் ஏதேனும் கேள்விகள் உள்ளதா? MCP பற்றி fellow learners மற்றும் அனுபவித்துள்ள டெவலப்பர்களுடன் விவாதிக்க இணைகவும். இது கேள்விகள் கேட்கப்படக்கூடிய மற்றும் அறிவு சுதந்திரமாக பகிரப்பட்டு வருகிற ஒருங்கிணைந்த கருச்சுற்றுச்சூழல் ஆகும். [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -உங்கள் தயாரிப்பு பின்னூட்டம் அல்லது பிழைகள் இருக்கின் கட்டுமிடங்கள்: +உங்கள் தயாரிப்பு பின்னூட்டங்கள் அல்லது கட்டுமானத்தில் பிழைகள் இருந்தால் பார்வையிடவும்: [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) -## உரிமம் +## உரிமை -இந்த தொகுப்பு MIT உரிமத்தின் கீழ் உரிமம் பெற்றது. கூடுதல் தகவலுக்கு [LICENSE](../../LICENSE) கோப்பைப் பார்க்கவும். +இந்த அருங்கட்டமைப்பு MIT உரிமையளிப்பு மூலம் உரிமம் பெற்றது. மேலும் தகவலுக்கு [LICENSE](../../LICENSE) கோப்பை பார்க்கவும். --- -**பிரதி தெரிவிப்பு**: -இந்த ஆவணம் செயற்கை நுண்ணறிவு மொழி மாற்ற சேவையான [Co-op Translator](https://github.com/Azure/co-op-translator) மூலம் மொழிபெயர்க்கப்பட்டது. நிச்சயதார்த்தத்திற்கு முயற்சி செய்தாலும், தானாக இடமாற்றிய மொழிபெயர்ப்பு தவறுகள் அல்லது தவறான தகவல்களை கொண்டிருக்கும் வாய்ப்பு உள்ளது. துெழில் மொழியில் உள்ள ஒரிஜினல் ஆவணம் அதிகாரப்பூர்வ மூலமாக கருதப்பட வேண்டும். முக்கியமான தகவல்களுக்கு, தொழில்முறை மனித மொழிபெயர்ப்பு பரிந்துரைக்கப்படுகிறது. இந்த மொழிபெயர்ப்பின் பயன்பாட்டினால் ஏற்படும் எந்த தவறான புரிதல்கள் அல்லது தவறான விளக்கங்களுக்கு நாங்கள் பொறுப்பில்லை. +**குறிப்பு**: +இந்த ஆவணம் [Co-op Translator](https://github.com/Azure/co-op-translator) எனும் செயற்கை நுண்ணறிவு மொழி மாற்ற சேவையை பயன்படுத்தி மொழிமாற்றம் செய்யப்பட்டதாகும். துல்லியத்திற்காக முயலினாலும், தானாக உருவாகும் மொழிபெயர்ப்புகளில் பிழைகள் அல்லது தவறுகள் இருக்க வாய்ப்பு உள்ளதை நினைவில் கொள். அசல் ஆவணம் அதன் சொந்த மொழியில் அதிகாரப்பூர்வ ஆதாரமாக கருதப்பட வேண்டும். முக்கியமான தகவல்களுக்கு, தொழில்முறை மனித மொழிபெயர்ப்பை பரிந்துரைப்போம். இந்த மொழிபெயர்ப்பைப் பயன்படுத்தியதில் ஏற்படும் எந்த தவறான புரிதல்கள் அல்லது தவறான விளக்கங்களுக்கு நாங்கள் பொறுப்பாளர்கள் அல்ல. \ No newline at end of file