• Kursuseprogramm: IFI6211
• Õpetaja: Romil Rõbtšenkov, [email protected]
• Testserver: lin2.tlu.ee, greeny.cs.tlu.ee
• Tunni näited: ~romil/ea17k

• Windows | VIDEO

  • Guide to create tunnel (in estonian, but with screenshots)

• Mac OS | VIDEO

1. open Terminal app

2. write:
ssh [email protected] -L 5555:greeny.cs.tlu.ee:80
3. then write TLU password

    Now you can access greeny from browser localhost:5555

3. open new tab in Terminal (cmd+t) and write:
ssh [email protected] -L 2222:greeny.cs.tlu.ee:22
4. then write TLU password

5. now open FTP client (CyberDuck, FileZilla, Coda) for example and connect to greeny via SFTP
    host: localhost or some require 127.0.0.1 (127.0.0.1 = localhost)
    port: 2222
    username: your_greeny_username
    password: your_greeny_username

6. choose one Terminal tab and connect to greeny via ssh, write:
ssh [email protected]
7. then enter your Greeny username password
    ls             – to view files and folders in current path
    cd folder_name - to enter folder
    cd ..          – to exit folder to previous path

• 1. kodutöö
• 2. kodutöö
• 3. kodutöö
• projekt

Kodused tööd peavad olema lõplikult valmis eksamiajaks. Pikendust pärast eksamiaega paranduste tegemiseks ei saa!

1. Fork'i ülesande/projekti repositoorium (leiab https://github.com/eesrakenduste-arendamine-2017k/).
2. Clone'i see repositoorium enda arvutisse/serverisse ja määra repositooriumi URL kuhu edaspidi muudatusi salvestad.

git clone https://[email protected]/USERNAME/REPOSITORY.git

1. Lisa ka oma nimi ja email repositooriumi omanikuks (Setting your username)
2. Muuda faile ülesande lahendamiseks ja Commit'i iga olulisem muudatus, kasutades kahte käsku.

git add .

git commit -m "Added this functionality to the app"

1. Veendu, et kogu kood on Commit'itud.

git status

1. Push/sync'i GitHub'i.

git push origin

1. Ava pull request ülesande originaalses repositooriumis. Ülesannete tähtajaks on 24h enne järgmise tunni algust, kui pole teisiti kirjas.
2. Muudatusi ja täiendusi võib push'ida repositooriumisse, kuni ette antud kuupäevani.

Tagasisidet saab otse pull request'i millele ootan Sinupoolseid kommentaare/mõtteid/küsimusi. Võid julgselt avada pull request'i kohe kui hakkad kodutöö kallal tegelama ja siis kui hätta jääd võid esitada sinna küsimuse. Maini kommentaaris minu kasutajat @romilrobtsenkov siis jõuan sellele kiiremini vastata.

Need rakenduvad ka päris elus!

• Peab järgma "head programmeerimise stiili"
  • Muutujate nimed peavad kirjeldama muutujat ning peavad olema inglise keeles
  • Funktsiooni nimi peab olema "lühike"
  • Optimeeri koodi lugemiseks
  • Projektide jaoks tuleb kasutada objektorienteeritud lähenemist
  • Laenatud koodile tuleb viidata
• Boonuspunktid:
  • Loomingulisus (NB! nõuded peavad olema täidetud)

1. Sissejuhatus
   • Veebiprogrammeerimise aine kokkuvõte
   • Arutleme, mis antud kursus endas hõlmab
2. Ajalugu
   • ECMAScript
   • iframe > XMLHttpRequest > AJAX
3. JS kasutusvaldkonnad
   • Lehtede interaktiivseks muutmine (awwwards, cssdesignawards)
   • Võrgu koormuse vähendamine
   • AJAX
   • Vormide valideerimine
   • WebSocket (Chat)
   • Mängud ja meelelahutus (threeJS)
   • Brauserite lisateegid
4. JS piirangud
   • Andmete kirjutamine serverisse
   • Ligipääs andmebaasidele
   • Ligipääs failisüsteemile
   • Akende sulgemine
   • Lõimtöötlus
   • Ligipääs teistele veebilehtedele
   • Browserite erinevused
5. Turvalisus
   • JS koodile ligipääs
   • window.opener näide (On the security implications of window.opener.location.replace() by julio)
6. Tunnis kasutatavad tööriistad
7. Javascript'is programmeerimine, näidisrakenduse loomine
   • muutujad, funktsioonid, aeg, sündmuste kuulamine, dokumendi muutmine
8. 1. kodutöö
9. Kohustuslik järgmiseks korrasks!
   • Vaata kuidas ja mis järjekorras JS ning brauser koostööd teevad What the heck is the event loop anyway? by Philip Roberts
   • Singleton muster Learning JavaScript Design Patterns by Addy Osmani

1. JS rakenduse ülesehitus (objektorienteeritud kood)
   • JS "use strict" – w3schools, ECMAScript 5 Strict Mode
   • single-page-application artikli põhjal Reimagining Single-Page Applications With Progressive Enhancement
   • Kasutame Singleton mustrit (Loe kindlasti mustrite kohta lähemalt Learning JavaScript Design Patterns by Addy Osmani)

1. kodutöö lõpetamine + küsimused

• Atom, lisad emmet, jshint(aegunud), linter, linter-jshint, atom-beautify
• koodi valideerimine JSLint / JSHint
• debug:
  • Chrome Developer Tools
    • Official debugging tutorial
    • õpetus JavaScript Diagnosis
  • Firefox Developer Edition

Välja toodud tundide loetelu juures vastavalt igale tunnile.

• Kliendipoolsed veebirakendused
• Google JavaScript Style Guide
• JavaScript Garden
• Mozilla's Introduction to Object-Oriented Javascript
• Mozilla Developer Network
• Learn JavaScript
• w3schools
• What’s so great about JavaScript Promises?
• Front-end Job Interview Questions
• JavaScript Best Practices
• JavaScript Patterns
• Learning Advanced JavaScript slides
• Static Web Apps
• The JavaScript Interpreter, Interpreted (video)
• Classical Inheritance in JavaScript
• Partial Application in JavaScript
• Learning JavaScript Design Patterns
• JS: The Right Way
• Code School
• Javascript Trail Map
• How To Learn JavaScript Properly
• Superhero.js
• Teach Yourself to Code

• PHP Coding Style Guide
• Veebirakenduste loomine PHP ja MySQLi abil
• PHP with MySQL Essential Training

• JS Bin
• CodePen
• JSFiddle

• Become a git guru.

Käesolev leht ja kõik teised https://github.com/veebiprogrammeerimine-2015s materjalid on Creative Commons Attribution 4.0 International Litsensiga.