Front-end в фреймворке Laravel: локализация JS-скриптов

Front-end в фреймворке Laravel: локализация JS-скриптов

От автора: привет, друзья! Продолжаем разбираться в особенностях разработки front-end в фреймворке Laravel. На прошлом уроке была рассмотрена передача информации по описанным маршрутам во front-end приложение. Казалось бы, этого достаточно. Но есть еще немаловажные параметры, которые также желательно передать — это локализация или статические данные, отображаемые в представлениях как фреймворка, так и front-end приложений. Поэтому с помощью данной статьи давайте научимся локализовать отображаемую информацию в скриптах JavaScript.

скачать исходники

Вообще, задача сегодняшнего урока довольно типична и встречается весьма часто при разработке веб-проектов. А это значит, что, скорее всего, есть готовое расширение с неким встроенным функционалом. И это действительно так — более того, подобных «помощников» написано очень много, поэтому сегодня рассмотрим один из них.

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

Фреймворк Laravel. Быстрая разработка с фреймворком №1

Узнай тонкости современной веб-разработки с помощью фреймворка Laravel

Узнать подробнее

Пакет, который сегодня задействуем, именуется следующим образом: Laravel-JS-Localization. Ознакомиться с ним вы можете по ссылке. Его установка довольно тривиальна. Все, что нужно — это выполнить команду:

Помимо этого, установим еще пакет под названием Lang.js от автора предыдущего расширения, но только во front-end часть.

По большому счету, это логика, которая необходима для возвращения конкретной строки из выбранной локализации. Как ни странно, она уже есть в установленном ранее пакете laravel-js-localization. Вы можете спросить: зачем же будем устанавливать ее повторно? Дело в том, что логика-то есть, но она добавляется в структуру файла с данными по локализации, а это не совсем хорошо и неудобно в работе. Поэтому будем использовать модуль Lang.js и отдельно от него информацию о выбранной локализации.

Фреймворк Laravel. Быстрая разработка с фреймворком №1

Узнай тонкости современной веб-разработки с помощью фреймворка Laravel

Узнать подробнее

После установки в консоли можем выполнить команду:

При этом файл translation.js будет содержать в себе информацию по доступным файлам локализации и их содержимому.

Далее необходимо создать модуль, который будет предоставлять интерфейс для работы со сформированным файлом translation.js.

По сути, этот модуль считывает содержимое файла translation.js и создает объект Lang (он описан в пакете Lang.js, установленном ранее), который содержит в себе методы по работе с локализациями. В качестве параметров конструктору необходимо передать массив данных локализации (в нашем случае это содержимое файла translation.js), локализацию по умолчанию и альтернативную локализацию.

Далее для выбора некоторой строки по соответствующему ключу локализации достаточно вызвать на исполнение метод get():

Собственно, на этом текстовая версия урока завершена. В видеоверсии вы найдете более подробную информацию и пояснения к каждой написанной строке кода. Поэтому ждем вас там. Всего вам доброго и удачного кодирования!

Фреймворк Laravel. Быстрая разработка с фреймворком №1

Узнай тонкости современной веб-разработки с помощью фреймворка Laravel

Узнать подробнее

Фреймворк Laravel: теория и первая практика

Овладейте азами фреймворка Laravel!

Получить

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

Я не робот.

Spam Protection by WP-SpamFree