ember.js. init
TRANSCRIPT
![Page 1: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/1.jpg)
![Page 2: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/2.jpg)
Тимур Болотюх
![Page 3: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/3.jpg)
Що таке новий веб?
• Односторінковий веб (SPA) • Мобільні додатки • Веб додатки не відрізняються від нативних • Дані на клієнті
![Page 4: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/4.jpg)
Чому ?
![Page 5: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/5.jpg)
![Page 6: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/6.jpg)
![Page 7: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/7.jpg)
Yehuda KatzTom Dale
Історія Ember.js
![Page 8: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/8.jpg)
Хто використовує Ember.js?
![Page 9: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/9.jpg)
Що дає нам Ember.js
• Допомагає будувати архітектуру десктопного рівня• Формує архітектуру додатку• Робить багато того, що другі фреймворки не роблять• Ember страється звільнити час для вирішення ваших проблем• Забезпезпечити вас інструментами• Дозволяє писати код асинхронно
![Page 10: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/10.jpg)
![Page 11: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/11.jpg)
Router
![Page 12: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/12.jpg)
Route
![Page 13: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/13.jpg)
Model
![Page 14: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/14.jpg)
![Page 15: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/15.jpg)
Controller
![Page 16: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/16.jpg)
![Page 17: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/17.jpg)
View
![Page 18: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/18.jpg)
![Page 19: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/19.jpg)
Templates
![Page 20: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/20.jpg)
Chris Wanstrath - Mustache.rb Jan Lehnardt - Mustache.js
<h1>Hello, {{username}}</h1>
Logic-less Templates
![Page 21: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/21.jpg)
Основні концепції &
Feature
![Page 22: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/22.jpg)
Кодогенерація
![Page 23: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/23.jpg)
Кодогенерація
![Page 24: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/24.jpg)
Convention over configuration
App.PostRouteApp.PostControllerApp.PostModelApp.PostViewpost.hbs
url: /post
![Page 25: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/25.jpg)
Promise — об'єкт або функція з методом then поведінка якого відповідає специфікації (Promises/A+).
АсинхронністьPromises
![Page 26: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/26.jpg)
Promises
![Page 27: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/27.jpg)
Є Dependency Injection container Routes, Controllers, Views створюються автоматично по правилам вказаним в Resolver (PostController, PostRoute, PostView)
Dependency Injection
![Page 28: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/28.jpg)
Dependency Injection
![Page 29: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/29.jpg)
Run Loop
![Page 30: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/30.jpg)
Об'єктна модель• Має ООП модель схожу на Ruby • Класи • Наслідування • Класи можна перевідкривати • Міксін • Можна підписуватися на зміну властивостей • Проксі об’єкти • Геттери-сеттери • Залежні атрибути • Аліаси
![Page 31: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/31.jpg)
Mixin
![Page 32: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/32.jpg)
Component
![Page 33: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/33.jpg)
Computed properties
![Page 34: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/34.jpg)
![Page 35: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/35.jpg)
![Page 40: Ember.js. Init](https://reader033.vdocuments.site/reader033/viewer/2022042514/55b943b5bb61eb576f8b45a9/html5/thumbnails/40.jpg)
?