មូលដ្ឋានគ្រឹះ JavaScript និង TypeScript

រៀន variable, function, array និង object, DOM, async code ហើយបន្ទាប់មកបន្ថែម type របស់ TypeScript — រួចប្រើវាដើម្បីធ្វើឲ្យទំព័រប្រវត្តិរូបមានអន្តរកម្ម។

HTML ផ្តល់រចនាសម្ព័ន្ធដល់ទំព័រ ហើយ CSS ផ្តល់រូបរាង ប៉ុន្តែទាំងពីរមិនអាច ធ្វើ អ្វីបានទេ។ ប៊ូតុងដែលត្រងបញ្ជី form ដែលពិនិត្យអ្វីដែលអ្នកវាយ ទំព័រដែលទាញទិន្នន័យថ្មីដោយមិនចាំបាច់ reload — ឥរិយាបថទាំងនោះគឺ JavaScript។ វាជាភាសាសរសេរកម្មវិធីតែមួយគត់ដែល browser ទាំងអស់ដំណើរការ ហើយជាមួយ Node.js វាក៏ដំណើរការ server, ឧបករណ៍ command-line និង (តាមរយៈ framework) app លើទូរស័ព្ទ និង desktop ផងដែរ។ ការរៀនវាម្តងបើកទ្វារស្ទើរតែទាំងអស់នៅក្នុង roadmap នេះ ចាប់ពី React ដល់ NestJS។

TypeScript គឺជា JavaScript ដែលបន្ថែម type៖ អ្នកពណ៌នាថា variable នីមួយៗផ្ទុកតម្លៃប្រភេទអ្វី ហើយ compiler នឹងចាប់កំហុសជាច្រើនប្រភេទមុនពេលកូដដំណើរការ។ ឥឡូវនេះវាជាជម្រើសលំនាំដើមសម្រាប់គម្រោងធ្ងន់ធ្ងរ ហើយងាយរៀនបន្ទាប់ពីអ្នកចេះ JavaScript — ដូច្នេះហើយបានជាស៊េរីនេះបង្រៀនទាំងពីរ តាមលំដាប់នោះ។

ដប់ជំពូកដំបូងគ្របដណ្តប់ JavaScript ផ្ទាល់៖ អ្វីជា JavaScript និងដំណើរការនៅឯណា តម្លៃ និង variable លក្ខខណ្ឌ loop, function និង scope, array និង object, module និង npm, DOM និង event, asynchronous code ជាមួយ fetch និងកំហុស និងការ debug។ ពីរជំពូកចុងក្រោយបន្ថែម TypeScript៖ ដំបូងជាមូលដ្ឋានគ្រឹះនៃប្រព័ន្ធ type បន្ទាប់មកជាការបំប្លែងគម្រោងពិតប្រាកដទៅជា TypeScript រួច compile វា។

អ្នកនឹងមិនត្រឹមតែអានអំពីវាទេ។ ពេញមួយស៊េរី អ្នកពង្រីក ទំព័រប្រវត្តិរូបរបស់ Dara Sok ពី មូលដ្ឋានគ្រឹះ HTML & CSS។ ជំពូកនីមួយៗបន្ថែមផ្នែកមួយ៖ បញ្ជីគម្រោងដែលអាចត្រងបាន ប៊ូតុងបិទបើក dark mode ឧបករណ៍ផ្ទៀងផ្ទាត់ contact form និងបញ្ជី GitHub repository ដែលទាញពី API ពិតប្រាកដ។ នៅចុងបញ្ចប់ អ្នកមាន site ដែលមានអន្តរកម្មដំណើរការបាន ហើយអ្នកបានផ្លាស់ទីតក្កវិជ្ជារបស់វាទៅក្នុង TypeScript ដែលមាន type និងត្រូវបាន compile។

អ្នកត្រូវការកុំព្យូទ័រដែលប្រើ Windows, macOS ឬ Linux, browser ទំនើបមួយដែលមាន DevTools (Chrome, Edge ឬ Firefox), code editor (Visual Studio Code ឥតគិតថ្លៃ ហើយត្រូវបានប្រើពេញមួយស៊េរី) និង Node.js (កំណែ LTS ដែលដំឡើងដោយ nvm ឬ installer ផ្លូវការ)។ Command line ពី មូលដ្ឋានគ្រឹះ Command Line និងការរៀបចំ Git ពី Git និង GitHub សម្រាប់អ្នកចាប់ផ្តើម ត្រូវបានប្រើពេញមួយស៊េរី។ គ្មានអ្វីត្រូវចំណាយលុយទេ។

  1. 01អ្វីជា JavaScript និង TypeScriptកន្លែងដែល JavaScript ស្ថិតនៅក្បែរ HTML និង CSS, engine និង runtime (browser ទល់នឹង Node), console, ការដំណើរការ script ដំបូងរបស់អ្នក និងការមើល TypeScript ជាលើកដំបូង។
  2. 02តម្លៃ Variable និង Typeការរក្សាទុកទិន្នន័យជាមួយ const និង let, primitive type, template string, typeof, null ទល់នឹង undefined និងភាពភ្ញាក់ផ្អើលនៃ type coercion ដែលអ្នកចាប់ផ្តើមគ្រប់គ្នាជួប។
  3. 03Operator និងលក្ខខណ្ឌនព្វន្ត និងការប្រៀបធៀប, === ទល់នឹង ==, តម្លៃ truthy និង falsy, if/else, switch, &&, ||, ??, ?. និង ternary operator — ប្រើដើម្បីស្វាគមន៍ភ្ញៀវតាមពេលវេលាក្នុងថ្ងៃ។
  4. 04Loop និងការធ្វើម្តងទៀតការធ្វើការងារម្តងទៀតដោយ for, for...of, while និង do/while, ការគ្រប់គ្រង loop ដោយ break និង continue, ការដើរតាម string និងទិន្នន័យដែលនៅក្នុងគ្នា និងការជៀសវាង infinite loop — ដោយប្រើបញ្ជីគម្រោងរបស់ Dara ជា array ដំបូងរបស់អ្នក។
  5. 05Function និង ScopeDeclaration, expression និង arrow function; parameter, default និង rest; return value; pure function ទល់នឹង side effect; block, function និង global scope; hoisting; closure; និង callback ជាគំនិតមួយ។
  6. 06Array និង Objectបញ្ជី និងកំណត់ត្រា៖ array និង object literal, method map, filter, find, some, every, reduce និង sort, destructuring, spread និង rest, optional chaining, Object.keys និង entries, JSON និងភាពខុសគ្នារវាងការចម្លង និងការយោង។
  7. 07Module, Node និង npmការបំបែកកូដជាច្រើនឯកសារដោយប្រើ ES module, import និង export, ការដំណើរការ JavaScript ក្រៅ browser ដោយប្រើ Node និងការដំឡើង package ដោយប្រើ npm និង package.json។
  8. 08DOM និង Eventការជ្រើសរើស និងផ្លាស់ប្តូរ element នៃទំព័រដោយ JavaScript, ការឆ្លើយតបនឹងការ click និងការ submit form, និងការសាងសង់បញ្ជី project ដែលអាចត្រង និងប៊ូតុង dark mode ដែលចងចាំជម្រើសរបស់អ្នក។
  9. 09Asynchronous JavaScriptហេតុអ្វីកូដដែលត្រូវរង់ចាំត្រូវការឧបករណ៍ពិសេស៖ event loop, setTimeout, callback, promise, async/await, Promise.all និងការផ្ទុក repository GitHub របស់ Dara ដោយ fetch។
  10. 10កំហុស និងការ Debugការអានសារកំហុស និង stack trace, ប្រភេទកំហុសសំខាន់ៗ, try/catch/finally, ការ throw កំហុសផ្ទាល់ខ្លួន, ការ validate ទម្រង់ទំនាក់ទំនងរបស់ Dara, method របស់ console និងការដើរមើលកូដម្តងមួយជំហានជាមួយ DevTools debugger។
  11. 11មូលដ្ឋានគ្រឹះ TypeScriptបញ្ហាដែល TypeScript ដោះស្រាយ, ការដំឡើង compiler, type annotation និង inference, type មូលដ្ឋាន, array និង tuple, type ប្រៀបធៀប interface, union និង literal type, unknown ប្រៀបធៀប any, type របស់ function, generic បន្តិចបន្តួច, tsconfig.json និងការអានកំហុសរបស់ compiler។
  12. 12TypeScript ក្នុងការអនុវត្តជាក់ស្តែងបំប្លែងគម្រោងរបស់ Dara ទៅជា TypeScript៖ type Project, narrowing ជាមួយ typeof, in និង discriminated union, ការកំណត់ type ឲ្យ DOM query និង fetch response, ហេតុអ្វី type មិនមែនជា runtime validation, ការ compile ទៅ dist/ និងកន្លែងត្រូវទៅបន្ត។