Course එකට ආපසු

Matrix එක කියවන්න

30 මිනිත්තු📖Lecture

Reading the Matrix (කෝඩ් කියවන කලාව)

ඊළඟ level එකට Welcome! Course 1 එකේදී ඔයා AI එක්ක create කරන්න ඉගෙන ගත්තා. දැන් AI create කරන දේවල් තේරුම් ගන්න time එක.

🎯 පාඩමේ Objectives

මේ lesson එක ඉවර වෙද්දී ඔයාට:

  • Code එක deeply තේරුම් ගන්න ඕනේ ඇයිද කියලා වැටහෙයි
  • Course 1 ඉඳන් Course 2 ට වෙන progression එක පේනවා
  • මේ module එකෙන් හදාගන්න skills මොනවද කියලා දැනගන්නවා
  • Code anatomy ඉගෙන ගන්න motivated වෙනවා

Perspective එක වෙනස් වෙන හැටි

Course 1: තේරුම් නොගෙන Creation

Course 1 එකේදී අපි AI එක්ක create කරන්න ඉගෙන ගත්තා:

  • ඔයාට ඕනේ දේ describe කළා
  • AI එක code එක generate කළා
  • Result එක දැක්කා
  • ඒක work කළා (mostly!)

මේක intentionally කළ දෙයක්. Syntax barrier එක remove කරලා ඉක්මනට creation experience එක දුන්නා.

ඒත් limitation එකක් තියෙනවා...

"Black Box" Problem එක

ඔයාට code එක තේරෙන්නේ නැති වුනාම වෙන්නේ මේකයි:

Text
┌─────────────────────────────────────────────────────────────┐
│ │
│ ඔයාගේ Prompt → [ AI BLACK BOX ] → Working Code │
│ │
│ ඔයා ඇහුවේ මොකක්ද වෙන්නේ මොකක්ද Work වෙනවා පේනවා │
│ කියලා දන්නවා කියලා පේන්නේ නෑ ඒත් ඇයිද දන්නේ නෑ │
│ │
└─────────────────────────────────────────────────────────────┘

මේකෙන් එන Problems:

Situation එක
නොදැන කරනකොට
Bug එකක් ආවම
"AI එකෙන් fix කරන්න" (maybe works)
Modify කරන්න ඕනේ වුනාම
"AI එකට ආයේ කියනවා" (context නැති වෙනවා)
මොකක් හරි wrong වගේ
"ඇයි කියලා දන්නේ නෑ"
Code එක work නැත්තම
"වෙන prompt එකක් try කරනවා"

Course 2: තේරුම් අරගෙන Better වෙලා Create කරන එක

Goal එක

මෙතැනින්:

"කොහොම හරි work වෙනවානේ"

මෙතැනට transform වෙන්න:

"මේක work වෙන්නේ මේ නිසා..."

අපි Build කරන Skill එක

Text
Code දකිනවා → Purpose එක තේරුම් ගන්නවා → Confidently Modify කරනවා

මේකට කියන්නේ code literacy — English/Sinhala කියවනවා වගේ code එක කියවලා තේරුම් ගන්න ability එක.


Transformation එක

Before (Course 1)
After (Module 2)
"AI මොකක් හරි ලිව්වා"
"AI එක total calculate කරන function එකක් ලිව්වා"
"මේක කොහොම හරි work කරනවා"
"Click කළාම event listener trigger වෙන නිසා work වෙනවා"
"AI එකෙන්ම fix කරගන්නවා"
"Bug එක පේනවා — count start වෙන්න ඕනේ 0 ඉඳන්, undefined නෙමෙයි"
"Style එක off"
"Margin එක 20px, ඒක 10px කළා නම් better spacing"
"මේකෙන් මොකද වෙන්නේ මන්දා"
"මේ CSS එකෙන් flexbox use කරලා content center කරනවා"

Analogy එක: Driving ඉගෙන ගන්නවා වගේ

Code Mastery එකේ Stages 4ක්

Stage 1: Passenger (Course 1 ට කලින්)

  • ඔයා car වල යනවා, වෙන කෙනෙක් drive කරනවා
  • Work වෙන විදිහ ගැන දන්නේ නෑ

Stage 2: Magic Driver (Course 1)

  • යන්න ඕනේ තැන කියනවා
  • Car එක තනියම යනවා (AI)
  • ඒත් problems fix කරන්න බෑ

Stage 3: Understanding Driver (Course 2) ← ඔයා දැන් මෙතන!

  • Engine එක work වෙන හැටි දන්නවා
  • AI තාමත් help කරනවා, ඒත් manually drive කරන්නත් පුළුවන්
  • Basic issues ඔයාම fix කරන්න පුළුවන්

Stage 4: Expert Driver (Course 3+)

  • Complete understanding
  • Cars හදන්න පුළුවන් (complex software)

මේ Module එකේදී ඉගෙන ගන්න දේවල්

1. HTML Anatomy

  • Document structure එක
  • Essential tags සහ ඒවායේ purposes
  • Attributes work වෙන හැටි

2. CSS Anatomy

  • Selector types
  • Common properties
  • Box Model එක
  • Layout basics

3. JavaScript Anatomy

  • Variables සහ data types
  • Functions සහ conditionals
  • DOM manipulation
  • Event handling

4. DevTools Mastery

  • ඕනෑම website එකක් inspect කරන්න
  • Live editing
  • Debugging basics

ඇයි දිගටම AI ම Use කරන්නේ නැත්තේ?

හොඳ question එකක්! Understanding matter වෙන්නේ ඇයිද:

Code Understanding එකේ Benefits

1. Better Prompts

❌ "Fix the thing that's broken" ✅ "onClick handler එකේ issue එකක් — count variable update වෙන්නේ නෑ, ඒක fix කරන්න"

2. Faster Debugging

  • Understanding එක්ක: Seconds 30 (line එකක් change)
  • AI එක්ක: Minutes 5 (explain, wait, verify, repeat)

3. Job Readiness Professional developers ලා write කරනවට වඩා code read කරනවා.

4. Independence AI එකට understand නොවුනොත් ඔයා stuck වෙන්නේ නෑ.

5. Confidence ඔයාගේ code එකේ වෙන්නේ මොකද කියලා දන්න එක empowering.


ඔයාගේ New Superpower එක

මේ module එක ඉවර වෙද්දී ඔයාට පුළුවන් වෙනවා:

ඔයාට ලැබෙන Skills

0/5

Formula එක:

Text
AI ගේ Code Generation Power + ඔයාගේ Code Understanding = 10x Effectiveness

මේ Module එකට Approach කරන හැටි

Success වෙන්න Tips

  1. Actively Read කරන්න — නිකන් read කරන්න එපා — examples ඔයාම type කරන්න. Modify කරන්න, break කරන්න, fix කරන්න.

  2. DevTools Use කරන්න — Daily use කරන websites inspect කරන්න. ඒවා build කරලා තියෙන හැටි බලන්න.

  3. හැම දේම Memorize කරන්න එපා — Patterns understand කරන්න. Specifics always look up කරන්න පුළුවන්.

  4. AI එක Connect කරගන්න — Understand නොවෙන code තිබුනොත් AI ගෙන් explain කරන්න කියලා අහන්න.


Lesson Summary

Journey එක:

  • Course 1: Understanding නැතුව create කළා (proof of concept)
  • Course 2: Better create කරන්න understand කරනවා (මේ module එක)
  • Course 3: Full confidence එක්ක complex systems build කරනවා

Matter වෙන්නේ ඇයි:

Code understanding ඔයාව AI tools use කරන කෙනෙක් ඉඳන් effectively wield කරන කෙනෙක් බවට transform කරනවා.

ඔයාගේ Mindset එක:

"මට හැම දේම memorize කරන්න ඕනේ නෑ, ඒත් dangerous වෙන්න ඕනේ තරම් understand කරන්න ඕනේ."


Next Up

Lesson 2.2: HTML Deep Dive
හැම webpage එකකම skeleton එක dissect කරමු!