JS-kurssi
  • JavaScript-kurssi
  • Kurssin aiheet
  • Mihin kannattaa panostaa
  • Mihin ei kannata panostaa
  • 1. JavaScriptin sisäänrakennetut toiminnot
    • Sisältö
    • Miksi JavaScript
    • JavaScriptin historiaa
    • Tyypit
    • Viittaukset ja kopiot
    • Yhtäsuuruusvertailut
    • Truthy ja falsy
    • Loogiset operaattorit && ja ||
    • Objektit ja prototyyppiketju
    • Näkyvyysalueet
    • Funktion määritys ja "nosto" (hoisting)
    • This-arvo (1/3)
    • This-arvo (2/3)
    • This-arvo (3/3)
    • Sisäänrakennetut ominaisuudet
    • Esimerkkejä sisäänrakennetuista ominaisuuksista
    • Linkkejä
    • Tehtävä
  • 2. DOM, jQuery, JSON, Fetch API
    • Sisältö
    • Document Object Model
    • Muokkaus
    • Events
    • jQuery
    • JSON
      • Esimerkkejä
    • Fetch API
    • Tehtäviä
  • 3. Polyfill, selainyhteensopivuus, syntaksin uudet ominaisuudet, Babel
    • Sisältö
    • Polyfill
      • Periaate
      • Hyödyt, haitat ja muita huomioita
      • Käyttöönotto
    • Havaintoja selainyhteensopivuudesta
    • Syntaksin uudet ominaisuudet
      • Arrow (“nuolifunktio”)
      • Class
      • Template strings
      • Destructuring (taulukoiden ja objektien “purku”)
      • Objektimäärityksen lyhenne
      • Rest spread (“muut”-operaattori)
    • Babel
    • Linkkejä
    • Tehtävä
      • Valmistelut
      • Tehtävä
  • 4. Modularisointi ja kirjastojen käyttö, npm, Webpack
    • Sisältö
    • Kirjastot ja modularisointi
    • Lodash (kirjastoesimerkki)
    • Moduulisyntaksi
    • npm
      • Käyttö
      • Paketit
        • Versiointi
    • Webpack
      • Toiminta
        • Livereload
    • Linkkejä
    • Tehtävä
  • 5. React – taustaa, JSX, hyvä tietää / yleisimmät ongelmat
    • Sisältö
    • React
      • Komponenttimalli skaalautuu kaikenkokoisiin sovelluksiin
      • Komponentit voivat olla joko tilattomia tai tilallisia
      • Data liikkuu yhteen suuntaan
      • JSX
      • Huomioita
    • Linkkejä
    • Tehtävä
  • 6. React – lisää komponenteista, patterneja ja harvemmin tarvittavia ominaisuuksia, kirjastoja
    • Sisältö
    • Komponentin metodit ja this-arvo
    • Utility-funktiot
    • Patterneja
      • Render props
      • HOC – Higher-Order Components
    • Harvemmin tarvittavia ominaisuuksia
      • Context
      • Refs
    • Kirjastoja
      • React Router
      • React-Bootstrap
      • React Intl
      • react-jsonschema-form
    • Linkkejä
    • Tehtävä
  • 7. Reaaliaikasovellukset, CouchDB
    • Sisältö
    • Vuorovaikutteisten web-sovellusten historiaa
      • Ennen Ajaxia
      • Ajax
      • Ajax:lla “tehostetut” perinteiset sovellukset (1/2)
      • Ajax:lla “tehostetut” perinteiset sovellukset (2/2)
    • CouchDB
      • Esimerkkitapaus
      • Yhteenveto
    • Yksinkertainen mutta tehokas arkkitehtuuri
    • Tehtävä
Powered by GitBook
On this page
  • SockJS / Socket.IO
  • React
  • Fetch API / SockJS / Socket.IO
  • Tietokanta
  • Palvelin
  1. 7. Reaaliaikasovellukset, CouchDB

Yksinkertainen mutta tehokas arkkitehtuuri

PreviousYhteenvetoNextTehtävä

Last updated 6 years ago

SockJS / Socket.IO

  • Data-liikenne palvelin → selain

React

  • Data ruudulle

Fetch API / SockJS / Socket.IO

  • Data-liikenne selain → palvelin

  • Fetch API:n asynkronisuus ja virhekoodit 👍

Tietokanta

  • CouchDB / PouchDB / RethinkDB tms. joka tukee muutosten kuuntelua

Palvelin

  • Node.js