zhenkondrat/kpp-2018

Крос-платформне програмування (весна 2018)

Звіти до лабораторних подаються через сайт.

Налаштування proxy у ВНТУ.

Розділ 1: Термінал (shell)

Лабораторнi

• Лабораторна 0: Реєстрація в системі
• Лабораторна 1: Консольна аплікація

Тиждень 1: Основи

Лекція 1.1: Основи JavaScript

• Теми:
  • Вирази, оператори, змінні;
  • Масиви, об'єкти;
  • Умови, цикли;
  • Функції.
• Слайди
• Конспект

Лекція 1.2: Основи Node.js

• Теми:
  • Основи node.js;
  • Менеджери пакетів npm, yarn;
  • Маніфест аплікації package.json.
• Слайди

Лекція 1.3: Типи

• Теми:
  • Типи, typeof;
  • Приведення типів.
• Слайди

Практика 1: Javascript

• Теми:
  • Оболонка node;
  • Звневаджування програм (debugger).

Тиждень 2: Функції

Лекція 2.1: Область визначення (scope)

• Теми:
  • Область визначення;
  • Декларація змінних (var, let, const);
  • Вспливання змінних (hoisting).
• Слайди

Лекція 2.2: Функції

• Теми:
  • Функції;
  • Параметри і аргументи;
  • Функції вищого порядку (map, reduce);
  • Зворотні виклики (callbacks). Замикання.
• Слайди

Практика 2: Розробка термінальної аплікації

Тиждень 3: Об'єктно-орієнтоване програмування

Лекція 3.1: Об'єкти

• Теми:
  • Об'єкти;
  • Властивості;
  • this.
• Слайди

Лекція 3.2: Прототипи і Конструктори

• Теми:
  • prototype;
  • class.
• Слайди

Лекція 3.3: ECMAScript

• Теми:
  • Стандарт ECMAScript;
  • Історія;
  • Нововведення. Стандарт. Історія.
• Слайди

Практика 3: Контроль версій

• Теми:
  • Системи контролю версій;
  • Git (init, commit);
  • Галудження (branch, checkout, reset, merge, rebase).
• Слайди

Розділ 2: Server

Лабораторнi

• Лабораторна 2: Серверна аплікація

Тиждень 4: Web

Лекція 4.1: Протоколи та стандарти Web

• Теми:
  • WWW;
  • URI (URL/URN);
  • HTTP (request, response, method, header).
• Слайди

Лекція 4.2: express.js

• Теми:
  • Роутинг;
  • Шаблонізатори;
  • Ресурси.
• Слайди

Практика 4: Розробка модульної аплікації

Тиждень 5: Дані

Лекція 5.1: HTML Форми

• Теми:
  • form;
  • input/textarea/select;
  • Валідація.
• Слайди

Лекція 5.2: Обіцянки

• Теми:
  • Promise;
  • Ланцюжки;
  • Групування.
• Слайди

Лекція 5.3: Збереження даних

• Теми:
  • Бази даних (CAP);
  • Документна база MongoDB;
  • Драйвер доступу (mongo, mongoose).
• Слайди

Практика 5: Розробка веб аплікації за допомогою express.js

• Код

Тиждень 6: Production

Лекція 6.1: Тестування

• Теми:
  • Тестування (mocha, chai);
  • Контроль якості коду (eslint);
  • Моніторинг в реальному часі.
• Слайди

Лекція 6.2: Асинхронність (Генератори)

• Теми:
  • Ітератори;
  • Генератори.
• Слайди

Лекція 6.3: Асинхронність

• Теми:
  • Асинхронні функції;
  • Асинхронні ітератори;
  • koa.js.
• Слайди

Практика 6: Розгортування

• Теми:
  • Хмарні сервіси (Heroku);
  • Системи керування мікросервісами (foreman, pm2).
• Слайди
• Код

Розділ 3: Browser

Лабораторнi

• Лабораторна 3: Браузерна аплікація

Тиждень 7: Браузерне оточення

Лекція 7.1: Браузерні технології

• Теми:
  • HTML, DOM;
  • CSS, селектори;
  • Bootstrap.
• Слайди

Лекція 7.2 JavaScript HTML5 API

• Теми:
  • Інтеграція JavaScript із браузером;
  • HTML5 APIs (geolocation, canvas, history).
• Слайди

Практика 7: Робота у браузерному оточенні

• Код

Тиждень 8: AJAX

Лекція 8.1: API

• Теми:
  • API (Види, формати);
  • REST;
  • GraphQL.
• Слайди

Лекція 8.2: Маніпуляція DOM

• Теми:
  • Інструменти браузера;
  • jQuery (Пошук, маніпуляція, анімація).
• Слайди

Лекція 8.3: AJAX

• Теми:
  • Історія;
  • Інструменти (jQuery.ajax, fetch);
  • Автентифікація;
  • CORS.
• Слайди

Практика 8: Розробка клієнт-серверної аплікації

• Код

Тиждень 9: Асинхронна взаємодія з сервером

Лекція 9.1: Websocket

• Теми:
  • Websocket протокол
  • Підтримка на сервері та у браузері
• Слайди

Лекція 9.2: Синхронізація мікросервісів

• Теми:
  • Брокер повідомлень Redis
  • Організація черг
• Слайди

Практика 9: Розробка серверної аплікації з асинхронною взаємодією

• Код

Лабораторна 3: Розробка браузерної аплікації

Розділ 4: Single Page Applications (SPA)

Лабораторнi

• Лабораторна 4: Односторінкова аплікація (SPA)

Тиждень 10: React

Лекція 10.1: React

• Теми:
  • React
  • JSX
• Слайди
• Демо (код)

Лекція 10.2: Архітектура Fiber

• Теми:
  • Fiber
• Слайди
• Демо (код)

Лекція 10.3: -

Практика 10: Розробка react аплікації

create-react-app.

Тиждень 11: Структура аплікації React

Лекція 11.1: Управління станом

• Теми:
  • Flux;
  • Redux;
  • Побічні ефекти (Redux Thunk).
• Слайди
• Демо (код)

Лекція 11.2: -

Практика 11: Розробка аплікації з Redux

• Код

Тиждень 12: Інструментарій

Лекція 12.1: Роутинг

• Теми:
  • Роутинг (react-router);
  • Історія браузера.
• План

Лекція 12.2: Інструменти

• Теми:
  • Контроль якості (eslint);
  • Тестування (jest, enzyme);
  • Server Side Rendering (next.js);
  • Збірка ресурсів (webpack).
• План

Лекція 12.3: Інтерфейсні фреймворки для React

• Теми:
  • Інтерфейсні фреймворки (Material-UI, reactstrap, blueprint).
• План

Практика 12: Розробка React аплікації з роутингом

• Код

Розділ 5: Mobile

Лабораторнi

• Лабораторна 5: Мобільна аплікація

Тиждень 13: Cordova

Лекція 13.1: Apache Cordova

• Теми:
  • Apache Cordova
• Слайди

Практика 13: Розробка аплікації за допомогою Apache Cordova

Тиждень 14: React Native

Лекція 14.1: React Native

• Теми:
  • React Native
  • Expo
• Слайди
• Демо (код)

Лекція 14.2: React Native Navigation

• Теми:
  • React Native Navigation
• Слайди
• Демо
• Демо (код)

Практика 14: Розробка аплікації за допомогою React Native

Розділ 6: Desktop

Лабораторнi

• Лабораторна 6: Настільна аплікація

Тиждень 15: Electron

Лекція 15.1: Electron

• Теми:
  • Electron
• Слайди

Практика 15: Розробка настільної аплыкації

Література