ebSkola

1.3 Salīdzini spēles lapas un nosūti darbu uz GitHub

Šodien: Izvēlies saprotamu spēles pogu un nosūti savu lapu uz GitHub.

Īsā teorija

Pogas teksts pasaka, kas notiks pēc klikšķa. Raksti konkrētu darbību: Sākt spēli , Mēģināt vēlreiz .

Salīdzinot divus risinājumus, izmēģini vienu un to pašu darbību abos.

Publish to GitHub pirmoreiz nosūta projektu uz GitHub. Pēc tam lieto Commit un Sync Changes .

<button>Sākt spēli</button>

Sākuma kods un darba vieta

Vide: mācību lapa → VS Code

  1. VS Code ar File → Open Folder atver Desktop/datorika9-tema1 . Ja mapes nav, izveido to darbvirsmā.
  2. Šajā mācību lapā nospied Kopēt sākuma kodu .
  3. VS Code nospied Ctrl+N un ielīmē kodu ar Ctrl+V .
  4. Saglabā ar Ctrl+Shift+S tēmas mapē kā 13.html .
Lejupielādēt 13.html

Atvērt pilno sākuma kodu
<!DOCTYPE html>
<html lang="lv">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mana spēle</title>
<style>
body { font-family: Arial, sans-serif; max-width: 680px; margin: 24px auto; padding: 16px; line-height: 1.6; }
button, input { font: inherit; padding: 10px; margin: 4px; }
button { cursor: pointer; }
img { max-width: 100%; height: auto; }
[hidden] { display: none !important; }

</style>
</head>
<body>
<h1>Divi spēles pogas varianti</h1>
<section>
  <h2>A variants</h2>
  <button onclick="document.getElementById('atbilde').textContent='Spēle sākta!'">Spied šeit</button>
</section>
<section>
  <h2>B variants</h2>
  <button onclick="document.getElementById('atbilde').textContent='Spēle sākta!'">Sākt spēli</button>
</section>
<p id="atbilde">Izmēģini abas pogas.</p>
<h2>Mana izvēle</h2>
<p>Manai spēlei būs poga:</p>
</body>
</html>

1. uzdevums

Izmēģini divus variantus

Vide: VS Code → pārlūks

  1. Sāc ar failu 13.html . Atver to pārlūkā.
  2. Nospied katru pogu. Nosaki, kuras pogas teksts skaidrāk pasaka darbību.
  3. Pasaki savu izvēli klasesbiedram.

Gatavs, kad: Esi izmēģinājis abas pogas.

2. uzdevums

Izveido savu pogas variantu

Vide: VS Code

  1. Sadaļā Mana izvēle rindkopā ieraksti savas spēles nosaukumu.
  2. Nokopē visu B varianta <button>...</button> rindu un ielīmē zem šīs rindkopas.
  3. Nomaini jaunās pogas tekstu atbilstoši savai spēlei, piemēram, Sākt zvaigžņu medības .

Gatavs, kad: Lapā ir trešā poga ar paša izvēlētu, skaidru tekstu.

3. uzdevums

Publicē projekta failus

Vide: VS Code / Source Control → pārlūks

  1. Pārbaudi savu pogu pārlūkā: pēc klikšķa redzams Spēle sākta! .
  2. VS Code veic Stage Changes (+) un Commit ar ziņu Pievienota spēles poga .
  3. Spied Publish to GitHub . Pārlūkā pieslēdzies savam kontam un apstiprini VS Code piekļuvi, ja to prasa.
  4. VS Code izvēlies Publish to GitHub public repository un nosaukumu datorika9-tema1 . Ja parādās failu atlase, atstāj savus mācību failus. Ja projekts jau publicēts, lieto Sync Changes .
  5. GitHub atver savu projektu un tajā 13.html . Pārbaudi, vai kodā ir jaunās pogas teksts.

Gatavs, kad: GitHub projektā ir tavs 13.html ar darbojošos pogu.

Iesniedz 3. uzdevuma rezultātu

Iesniedz pabeigto 13.html skolotāja norādītajā vietā. Šo pašu versiju saglabā arī GitHub.

Stunda ir ieskaitīta, ja 3. uzdevuma rezultāts atbilst visiem šiem punktiem:

  • Saglabāti abi salīdzināmie varianti.
  • Paša izveidotās pogas teksts nosauc darbību, un poga parāda ziņu.
  • GitHub projektā redzams atjaunotais fails.

1. un 2. uzdevums sagatavo šo rezultātu. Papildu uzdevums nav vajadzīgs ieskaitei.

Saglabā un nosūti uz GitHub — pogu atgādne

Vide: VS Code / Source Control → GitHub pārlūkā

  1. Ar File → Save All saglabā failus. Atver Source Control ar Ctrl+Shift+G .
  2. Pie Changes nospied + (Stage All Changes). Pārbaudi, ka vajadzīgie faili pārvietojas uz Staged Changes .
  3. Ziņas laukā ieraksti īsu izmaiņu, piemēram, Pabeigts 1.3 darbs . Spied Commit .
  4. Ja šī tēmas mape vēl nav GitHub, spied Publish to GitHub un izveido publisku projektu datorika9-tema1 . Jau publicētam projektam spied Sync Changes . Ja pogas nav, atver … → Push .
  5. Pārlūkā atver savu GitHub projektu un pārbaudi faila pēdējās izmaiņas.

Ja Source Control rāda Initialize Repository , vispirms nospied to. Ja parādās kļūda vai sapludināšanas pieprasījums, izmanto palīdzību un palūdz skolotāja atbalstu.

Papildu uzdevums: Uzlabojums abiem variantiem

Sāc, kad 3. uzdevums ir gatavs un iesniegts. Ja vēlies paturēt obligāto versiju, saglabā kopiju ar citu nosaukumu.

  1. Nomaini arī A varianta pogas tekstu uz konkrētu darbību.
  2. Pārbaudi, vai abas pogas joprojām darbojas.
Ja kaut kas neizdodas

Palīdzība Git, kontam un darba atvēršanai

Skolotājam: sasniedzamo rezultātu saistība

Šajā nodarbībā vingrina šādu rezultātu daļas no 9. klases saraksta . Piesaiste pati par sevi nenozīmē visa rezultāta apguvi.

Kursa nosacījumi un satura pārklājums