К основному контенту

Vue.js

Друзья, я - динозавр! Много лет моим хобби была WEB разработка и, зачастую, я останавливался на классике. Крайне долго ждал, прежде чем перейти на тот же Bootstrap. Одно время пробовал SAPUI5, показалось очень неплохим продуктом. Да, я сейчас сделаю это - сравню фреймворк от SAP с Vue.js. Ну и что, что корпоративный сегмент!
Короче - на мой взгляд SAPUI5 достаточно сложный продукт. Сильно заточен под OData. Vue.js мне дался намного легче. Все интуитивно понятно, всегда знаешь когда какой метод работает.
Установка и запуск проекта
Хотел сделать мелкую статью сравнения, но подумал, что каждый выбирает для себя сам. По этому зафиксирую процесс установки и создания нового приложения.
Для установки Vue.js должен быть установлен Node.js и npm. Переходим по ссылке https://vuejs.org/v2/guide/installation.html#CLI и выполняем блок команд. Для ленивых - выполняем команду: 

npm install --global vue-cli

Это запустит установку Vue.js CLI. Теперь давайте создадим проект. В командной строке при помощи команды cd меняем расположение на папку, в которой хотим создать свой проект, например, C:\Projects\.Для создания проекта со всеми необходимыми файлами выполняем команду:

vue init webpack vueproject

На выходе мы получим папку с проектом, расположенную в C:\Projects\vueproject. По умолчанию там уже будет компонент HelloWorld.
Запустить проект тоже не составляет труда: в командной строке идем в папку с проектом и выполняем команду:

npm run dev

После всех манипуляций открываем в браузере адрес проекта (по умолчанию это http://localhost:8080/)

Комментарии

Популярные сообщения из этого блога

Прямые ссылки на файлы Google диска

В предыдущей статье я рассказал, как подключить свой JavaScript файл к блогу BLOGSPOT . Но для того, что бы их подключить нужны прямые ссылки на файл, а Google диск при предоставлении общего доступа к файлу выдает ссылку на предварительный просмотр, которая никак напрямую не ссылается на файл. Для Google диска прямая ссылка на файл - это ссылка на скачивание. Ниже описаны два способа создания ссылки на скачивание на примере файла prism.js.

События для ведения таблиц

Как и всегда, в пылу проекта внезапно родилась Z табличка. Главный нюанс был в том, что она должна была хранить пароли для авторизации на стороннем сервере. Естественно, никто не хотел хранить пароли в открытом виде, а двустороннее шифрование SAP не умеет без сторонних пакетов и надстроек. Далее, все как обычно - придумали алгоритм, сделали табличку. Дело осталось за малым - нужно шифровать пароли, которые вводит пользователь. Делать отдельную программу нет смысла, поскольку ее функционал мало чем будет отличаться от сгенерированного. Вот здесь на помощь приходят события! С их помощью можно, наверное, все. По крайней мере, я не нашел чего-либо, что нельзя сделать с данными через события.

OOP ALV GRID с HTML шапкой

В этой статье хочу постараться подробно описать и привести пример, как можно создать ALV отчет с таблицей на весь экран и с HTML шапкой вверху. Я не буду описывать начальный этап, где пишется селекционный экран или делается выборка данных. Будем считать, что основа у нас есть и нам нужно просто вывести данные. Главной изюминкой является то, что нужно вывести ALV GRID на экран без использования каких-либо дополнительных элементов на экране. Step-By-Step Шаг 1. Создание окна Создаем самое простое окно с номером 100. На него не нужно кидать никаких контейнеров. Оно нам нужно только для модулей PAI и PBO и вывода на него ALV GRID.