EСМАScript 6. Блочная видимость

Традиционно, объявление переменных было одной из необычных особенностей JavaScript. В большинстве C-подобных языков, создание переменной происходит в том месте, где она объявлена. Однако, в JavaScript это не так. Где Ваши переменные будут созданы, зависит от того, как Вы их объявили, и ECMAScript 6 предлагает возможности, что бы сделать контроль области видимости проще. В этой статье показано, почему классический var может ввести в заблуждение, вводится понятие блочной видимости в ECMAScript 6, а также приведены некоторые практические советы.

Читать дальше

Шаблонные строки ES6

Строки в JavaScript были исторически функционально ограничены, не хватает возможностей, которые можно встретить в таких языках, как Python или Ruby. Шаблонные строки ES6 (доступно в Chrome 41+), вносят существенные изменения. Они представляют способ определения строк с помощью domain-specific languages (DSL), добавляя улучшения:

  • Интерполяция строк
  • Встроенные выражения
  • Многострочный текст без хаков
  • Форматирование строк
  • Тегирование строк, для безопасного экранирования HTML, локализации и т.д.

Вместо того, чтобы добавлять еще одну функциональность к объекту String, шаблонные строки предлагают совершенно иной подход для решения этих проблем.

Читать дальше

Основные принципы Material Design

material/material

Цели

Создать визуальный язык, который объединит классические принципы хорошего дизайна с инновациями и технологическими возможностями

Разработать единую среду, которая позволит унифицировать опыт взаимодействия пользователя с приложениями не зависимо от платформы и размеров устройства. Особенности мобильной среды являются основополагающими, но касания, голос, мышь и клавиатура это основные способы ввода.

Читать дальше

Переосмысление работы с DOM

В веб-разработке, как в жизни, иногда мы создаем шаблоны в которых решаем общие задачи. Это необходимо, иначе можно потратить впустую много умственных сил на тривиальные проблемы, которые мы уже когда-то решили. Однако от этих шаблонов бывает трудно отказаться, даже когда, возможно, они уже не являются оптимальным решением.

Одна из наиболее распространенных задач, с которыми может встречаться фронтенд-разработчик, работа с DOM (Объектная Модель Документа). Обычно она заключается в определении расположения элемента DOM и затем управление им и/или его содержимым. Многие из нас использовали jQuery для этой задачи в течение последних семи или восьми лет, поскольку это - одна из основных задач, с которыми jQuery отлично справляется.

Для интернета семь лет это очень много. Вернемся в 2006 год, когда появился jQuery, Flash был очень популярен и интернет-приложения, разрабатывались на Flex или Silverlight, или даже Laszlo казалось, что они могли бы быть будущим веба. Кому нужен DOM, когда плагины были будущим веб-разработки.

С того момента, много изменилось. Браузер теперь поддерживает работу с DOM способами, которые не были возможны, когда jQuery только появился. Плюс, появились новые библиотеки, которые предлагают абсолютно другой подход к работе с DOM, чем тот, к которому мы привыкли. Итак, настало время спросить, нужен ли нам все еще jQuery для работы с DOM?

Читать дальше

Основные понятия

Компонент и объект

Классы Yii обычно наследуются от одного из двух базовых классов yii\base\Object или yii\base\Component. Эти классы предоставляют полезный функционал, который автоматически добавляется во все классы, наследуемые от них.

Класс Object предоставляет функционал конфигурации и свойств. Класс Component наследуется от класса Object и добавляет обработку событий и поведения.

Object обычно используется для классов, которые представляют собой простые структуры данных, в то время как Component используется в компонентах приложения и других классах реализующих более сложную логику.

Читать дальше

Паттерны для масштабируемых JavaScript-приложений ч.7

Собираем все вместе

  • Модули содержат специфичные части функциональности вашего приложения. Они публикуют уведомления, информирующие приложение о том, что случилось что-то интересное. Это их главная забота. Как я поясню в FAQ, модули могут зависеть от различных вспомогательных методов для работы с DOM, но идеальным бы было отсутствие любых зависимостей от других компонентов системы. Модули не должны иметь отношение к тому:
    • какие объекты или модули подписаны на их сообщения,
    • где находятся эти объекты (на клиенте или на сервере),
    • какое количество объектов подписано на уведомления.

Читать дальше

Паттерны для масштабируемых JavaScript-приложений ч.6

Паттерн «Медиатор»

Объяснить, что представляет собой паттерн «медиатор» достаточно просто на примере следующей аналогии — представьте себе контроль траффика в аэропорте: все решения о том, какие самолеты могут взлетать или садиться, принимает диспетчер. Для этого, все сообщения, исходящие от самолетов, поступают в башню управления, вместо того, чтобы пересылаться между самолетами напрямую. Такой централизованный контроллер — это и есть ключ к успеху нашей системы. Это и есть «медиатор».

Медиатор применяется в системах, где взаимодействие между модулями может быть весьма сложными, но, в то же время, хорошо определенными. Если вы полагаете, что связи между модулями вашей системы будут постоянно расти и усложняться, то, возможно, вам стоит добавить центральный элемент управления. Паттерн «медиатор» отлично подходит для этой роли.

Читать дальше

Паттерны для масштабируемых JavaScript-приложений ч.5

Модули CommonJS

Возможно, вы что-то слышали о CommonJS за последние пару лет. CommonJS — это добровольная рабочая группа, которая проектирует, проектирует и стандартизирует различные JavaScript API. На сегодняшний день они ратифицировали стандарты для модулей и пакетов — CommonJS определяют простой API для написания модулей, которые могут быть использованы в браузере с помощью тега <script>, как с синхронной, так и с асинхронной загрузкой. Реализация паттерна «модуль» с помощью CommonJS выглядит очень просто, и я нахожу это уверенным шагом на пути к модульной системе, предложенной в ES Harmony (следующей версии JavaScript).

В структурном плане, CommonJS-модуль представляет собой готовый к переиспользованию фрагмент JavaScript-кода, который экспортирует специальные объекты, доступные для использования в любом зависимом коде. CommonJS все чаще используется как стандартный формат JavaScript-модулей. Существует большое количество хороших уроков по написанию CommonJS-модулей, но обычно они описывают две главных идеи: объект exports, содержащий то, что модуль хочет сделать доступным для других частей системы, и функцию require, которая используется одними модулями для импорта объекта exports из других.

Читать дальше

Создание структуры Вашего приложения

Хотя шаблоны простого и продвинутого приложения подойдут для большинства Ваших потребностей, вы можете создать свой собственный шаблон приложения для использования в своих проектах.

Шаблоны приложений являются репозиториями, содержащими composer.json и зарегистрированы в качестве Composer пакетов, так что вы можете создать любой пакет репозитория, и он может быть установлен командой create-project.

Поскольку это немного трудоемко, для создания своего шаблона с нуля, то лучше использовать один из встроенных шаблонов, в качестве основы. Давайте возьмем шаблон простого приложения.

Читать дальше

Шаблон продвинутого приложения

Этот шаблон предназначен для больших проектов, разрабатываемых в группах, где бекэнд отделен от фронтэнда, приложение разворачивается на нескольких серверах и т.д. Этот шаблон приложения дает больше чем просто структуру и предоставляет из коробки базу данных, механизм регистрации и восстановления пароля.

Установка

Установка с помощью Cjmposer

Если в Вашей системе еще не установлен Composer, можете скачать его по ссылке http://getcomposer.org/, или выполните следующую команду в ОС Linux/Unix/MacOS:

curl -s http://getcomposer.org/installer | php

Вы можете установить шаблон приложения следующей командой:

php composer.phar create-project --prefer-dist --stability=dev yiisoft/yii2-app-advanced /path/to/yii-application

Читать дальше

Авторизация