| ... | |
| render () { | |
| ... | |
| return <div className={{styles.root}}> | |
| <div className={{styles.wrap}}> | |
| <this.Cover/> | |
| </div> | |
| <this.Description/> | |
| </div> |
| import Ember from 'ember'; | |
| export default Ember.Controller.extend({ | |
| appName: Ember.computed.alias('model.firstObject.bar.foo.name'), | |
| bar: Ember.computed.alias('model.firstObject.bar'), | |
| test: Ember.computed('bar', function () { | |
| return this.get('bar.foo').then(function (d) { | |
| console.log(d.get('name')) | |
| }) | |
| }) |
| var Uploader = Ember.Object.extend(Ember.Evented, { | |
| url: null, | |
| paramNamespace: null, | |
| paramName: 'file', | |
| isUploading: false, | |
| /** | |
| * ajax request type (method), by default it will be POST | |
| * | |
| * @property type |
Николай Беличук: Карты и картографические сервисы
http://belichuk.github.io/odessajs2016/
Артем Тритяк: Forward to the Past or data fetching in React.js
https://medium.com/@ArtyomTrityak/forward-to-the-past-or-data-fetching-in-react-js-9f4ccfa29c10#.b4lxxf9f5
Юрий Шевцов: Internet of things в офисе
https://docs.google.com/presentation/d/1nhCQQTHeKGXuMMGOyYXDS2z0J7xP6ee8xUGZ0EM22do/edit?usp=sharing
Вадим Макеев: Grid Layout
blia Dec 22 14:43
форкни фетч еба
Iurii Plugatariov @strangeworks Sep 18 22:09
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Bluetooth Web API</title> | |
| </head> | |
| <body> | |
| <input class="range" id="r" value="255" max="255" type="range"/> | |
| <input class="range" id="g" value="255" max="255" type="range"/> | |
| <input class="range" id="b" value="255" max="255" type="range"/> |
##Избавляемся от презентационных классов
###CSS: with modules & nesting(PostCSS/Sass/Less/Stylus)
Как происходит сейчас. Обычно мы используем презентационные классы. Популярная, но не лучшая практика.
Довольно частый кейс - добавить какое-то состояние компоненту. Мы в css создаем класс-модификатор is-active.
style.css
.action {
| let price = 234 | |
| , tax = price * 0.05; | |
| function currency(strings, ...expressions) { | |
| const regExp = /^:c(\((.+),(.+)\))?/; | |
| const local = (string, value) => { | |
| const [currency, locale] = regExp.exec(string).slice(2); | |
| return value.toLocaleString(locale, { style: 'currency', currency }); | |
| } |
| var previewWidth = 320, // ширина превью | |
| previewHeight = 240, // высота превью | |
| maxFileSize = 5 * 1024 * 1024, // (байт) Максимальный размер файла (2мб) | |
| selectedFiles = {},// объект, в котором будут храниться выбранные файлы | |
| queue = [], | |
| image = new Image(), | |
| imgLoadHandler, | |
| isProcessing = false, | |
| errorMsg, // сообщение об ошибке при валидации файла | |
| previewPhotoContainer = document.querySelector('#preview-photo'), // контейнер, в котором будут отображаться превью |