Opinto-opas

Tavoitteet

Opintojakson suoritettuaan opiskelija:
- osaa ohjelmoida JavaScripti-ohjelmointikielellä
- osaa hyödyntää React-sovelluskehystä
- osaa suunnitella moduuliperustaisia selainohjelmistoja
- tuntee selainohjelmoinnin erityispiirteet
- osaa hyödyntää tehokkaita ja nykyaikaisia ohjelmointityökaluja

Sisältö

- JavaScript-kielen perusteet
- JavaScript-kielen modernit ominaisuudet
- React-kirjaston perusteet
- selainohjelmistojen suunnittelu ja modularisointi
- selainohjelmoinnin erityispiirteet
- kehitystyökalut

Oppimateriaalit

JavaScript-osuus:

Eloquent JavaScript, 3rd Edition: A Modern Introduction to Programming
by Marijn Haverbeke | Dec 4, 2018

Tenttien ajankohdat ja uusintamahdollisuudet

Ei tenttiä

Sisällön jaksotus

I. JavaScript (Luennot ja henkilökohtaiset harjoitustehtävät)

- Perusteet
- Merkkijonot
- Oliot, destrukturointi
- Taulukot ja niiden operaatiot
- Operaatioiden ohjelmointi
- Poikkeustilanteiden käsittely
- DOM, tapahtumien käsittely
- Moduulit
- Asynkroninen ohjelmointi
- Työkalut

II. React (Luennot ja ryhmätyö)

- Perusteet
- JSX
- Komponentit
- Modularisointi
- Työkalut
- Tilan hallinta
- Koukut

III. Ryhmätyö: Yksinkertainen yhden sivun sovelluksen ohjelmointi React-kirjastoa hyödyntäen (ei taustajärjestelmän ohjelmointia)

7 henkilökohtaista JavaScript-harjoitustehtävää.
React-perustainen ryhmätyö

Arviointiasteikko

H-5

Arviointimenetelmät ja arvioinnin perusteet

7 henkilökohtaista harjoitustehtävää: 70 pistettä.
Ryhmätyö: 30 pistettä.

Harjoitustehtävät tulee palauttaa ilmoitettaviin määräaikoihin mennessä. Myöhästyneistä palautuksista hyvitetään vain puolet pisteistä.

Demotunneilla on oltava läsnä. Poissaolosta demotunnilla vähennetään 25 prosenttia silloin tarkastettavien harjoitustehtävien pisteistä.

Ryhmätyöhön osallistuminen ei ole pakollista. Hyvän arvosanan saavuttaminen edellyttää kuitenkin ryhmätyöhön osallistumista.

Arvosteluskaala (pistettä -> arvosana):

40 -> 1
55 -> 2
70 -> 3
80 -> 4
90 -> 5

Esitietovaatimukset

WWW-perusteet (HTML5, CSS)

Tavoitteet

Opintojakson suoritettuaan opiskelija:
- osaa ohjelmoida JavaScripti-ohjelmointikielellä
- osaa hyödyntää React-sovelluskehystä
- osaa suunnitella moduuliperustaisia selainohjelmistoja
- tuntee selainohjelmoinnin erityispiirteet
- osaa hyödyntää tehokkaita ja nykyaikaisia ohjelmointityökaluja

Sisältö

- JavaScript-kielen perusteet
- JavaScript-kielen modernit ominaisuudet
- React-kirjaston perusteet
- selainohjelmistojen suunnittelu ja modularisointi
- selainohjelmoinnin erityispiirteet
- kehitystyökalut

Pedagogiset toimintatavat ja kestävä kehitys

Harjoitusten ja opetusajan jakaantuminen:
• JavaScript 40 %
• React 40 %
• Muut 20 %
• Lisäksi omalla ajalla tehtävä React-perustainen ryhmätyö

Sisällön jaksotus

- JavaScript-kielen perusteet
- JavaScript-kielen modernit ominaisuudet
- React-kirjaston perusteet
- selainohjelmistojen suunnittelu ja modularisointi
- selainohjelmoinnin erityispiirteet
- kehitystyökalut: ohjelmointiympäristö, selaimen kehitystyökalut, babel-kääntäjä, moduulipaketoija, create react app

Arviointiasteikko

H-5

Arviointikriteerit, tyydyttävä (1-2)

- tietää mihin JavaScriptiä ja React-kirjastoa voidaan selainohjelmoinnissa käyttää
- osaa ohjelmoida yksinkertaisia JavaScript-skriptejä ja kykenee osallistumaan React-projekteihin
- tuntee keskeisiä selainohjelmoinnissa käytettäviä työkaluja
- tuntee selainohjelmointiympäristön erityispiirteitä

Arviointikriteerit, hyvä (3-4)

- osaa ohjelmoida JavaScript-pohjaisia sovelluksia ja hyödyntää React-kirjastoa
- osaa toteuttaa moduuliperustaisia selainohjelmistoja
- osaa käyttää selainohjelmoinnin työkaluja
- tuntee keskeiset selainohjelmoinnin piirteet

Arviointikriteerit, kiitettävä (5)

- osaa soveltaa JavaScriptiä ja React-kirjastoa monipuolisesti uusien selainsovellusten tuotannossa
- osaa suunnitella ja toteuttaa moduuliperustaisia selainohjelmistoja
- osaa soveltaa ohjelmointityökaluja tehokkaasti ja etsiä tarvittaessa uusia
- tuntee keskeiset selainohjelmoinnin piirteet

Esitietovaatimukset

WWW-perusteet (HTML5, CSS)

Tavoitteet

Opintojakson suoritettuaan opiskelija:
- osaa ohjelmoida JavaScripti-ohjelmointikielellä
- osaa hyödyntää React-sovelluskehystä
- osaa suunnitella moduuliperustaisia selainohjelmistoja
- tuntee selainohjelmoinnin erityispiirteet
- osaa hyödyntää tehokkaita ja nykyaikaisia ohjelmointityökaluja

Sisältö

- JavaScript-kielen perusteet
- JavaScript-kielen modernit ominaisuudet
- React-kirjaston perusteet
- selainohjelmistojen suunnittelu ja modularisointi
- selainohjelmoinnin erityispiirteet
- kehitystyökalut

Oppimateriaalit

The course books
*
Eloquent JavaScript
Marijn Haverbeke
No Starch Press; 3 edition (December 4, 2018)
Available on the Net: http://eloquentjavascript.net
*
Learning React : Modern Patterns for Developing React Apps
2nd edition
Alex Banks and Eve Porcello
Available in ProQuest EBook Central
*
Only selected chapters will be read from the books.
*
In the React-based teamwork some tutorial project will be utilized as an example or as a starting point.

Sisällön jaksotus

Contents

I. JavaScript (Lectures and personal exercises)

- Basics
- Strings
- Objects, destructuring
- Arrays, array operations
- Programming functions
- Error handling
- DOM, event handling
- Modules
- Asynchronous programming
- Tools

II. React (Lectures and a teamwork)

- Basics
- JSX
- Components
- Modularization
- Tools
- Managing state
- Hooks

III. Teamwork: A simple single page web application with React (without backend)

7 personal JavaScript exercises.
React-based Teamwork.

Arviointiasteikko

H-5

Arviointimenetelmät ja arvioinnin perusteet

7 personal assignments: 70 points
The group project work: 30 points.

The assignments must be returned by the deadline to get the points.The assignments returned after the deadline will give you only half of the points.

Please note that it is not compulsory to participate in the teamwork. However, then the best grades are not reachable.

The grading scale (points b -> grade):

40 points -> 1
55 points -> 2
70 points -> 3
80 points -> 4
90 points -> 5

Esitietovaatimukset

WWW-perusteet (HTML5, CSS)

Tavoitteet

Opintojakson suoritettuaan opiskelija:
- osaa ohjelmoida JavaScripti-ohjelmointikielellä
- osaa hyödyntää React-sovelluskehystä
- osaa suunnitella moduuliperustaisia selainohjelmistoja
- tuntee selainohjelmoinnin erityispiirteet
- osaa hyödyntää tehokkaita ja nykyaikaisia ohjelmointityökaluja

Sisältö

- JavaScript-kielen perusteet
- JavaScript-kielen modernit ominaisuudet
- React-kirjaston perusteet
- selainohjelmistojen suunnittelu ja modularisointi
- selainohjelmoinnin erityispiirteet
- kehitystyökalut

Pedagogiset toimintatavat ja kestävä kehitys

Harjoitusten ja opetusajan jakaantuminen:
• JavaScript 40 %
• React 40 %
• Muut 20 %
• Lisäksi omalla ajalla tehtävä React-perustainen ryhmätyö

Sisällön jaksotus

- JavaScript-kielen perusteet
- JavaScript-kielen modernit ominaisuudet
- React-kirjaston perusteet
- selainohjelmistojen suunnittelu ja modularisointi
- selainohjelmoinnin erityispiirteet
- kehitystyökalut: ohjelmointiympäristö, selaimen kehitystyökalut, babel-kääntäjä, moduulipaketoija, create react app

Arviointiasteikko

H-5

Arviointikriteerit, tyydyttävä (1-2)

- tietää mihin JavaScriptiä ja React-kirjastoa voidaan selainohjelmoinnissa käyttää
- osaa ohjelmoida yksinkertaisia JavaScript-skriptejä ja kykenee osallistumaan React-projekteihin
- tuntee keskeisiä selainohjelmoinnissa käytettäviä työkaluja
- tuntee selainohjelmointiympäristön erityispiirteitä

Arviointikriteerit, hyvä (3-4)

- osaa ohjelmoida JavaScript-pohjaisia sovelluksia ja hyödyntää React-kirjastoa
- osaa toteuttaa moduuliperustaisia selainohjelmistoja
- osaa käyttää selainohjelmoinnin työkaluja
- tuntee keskeiset selainohjelmoinnin piirteet

Arviointikriteerit, kiitettävä (5)

- osaa soveltaa JavaScriptiä ja React-kirjastoa monipuolisesti uusien selainsovellusten tuotannossa
- osaa suunnitella ja toteuttaa moduuliperustaisia selainohjelmistoja
- osaa soveltaa ohjelmointityökaluja tehokkaasti ja etsiä tarvittaessa uusia
- tuntee keskeiset selainohjelmoinnin piirteet

Esitietovaatimukset

WWW-perusteet (HTML5, CSS)