Моделирование с Vue.js

 

 

 

  1. Познакомиться с Vue.JS (обращая внимание на модельную сторону структуры, формы и содержания предлагаемых материалов и вашего "путешествия" по ним).

  1. Создать каталог Фамилия-Vue.

  2. Открыть страницу с vue-слайдером, проверить работоспособность, изучить код. Скопировать страницу и скрипты (открытьваются по ссылкам к коде) в каталог Фамилия-Vue. На основе скопированных файлов создать страницу Фамилия-SL со слайдером в каталоге Фамилия-Vue, в котором ФИО Орловой Евы Адамовны будет должны быть заменены Вашими ФИО, содержать Ваш развернутый ответ на вопрос (заданный от Вашего имени). Редактируем только странику!

  3. Открыть страницу с мгновенным vue-поиском, опробовать его.

Теперь создадим приложение, в котором будут представлены некоторые статьи-примеры. Vue-приложение c мгновенным поиском имеет текстовое поле ввода поискового запроса. Поле ввода привязано к модели searchString. Когда текст вводится, модель мгновенно обновляется, и массив filteredArticles генерируется снова. Фреймворк позволяет фильтровать материалы на основании соответствия поисковому запросу - те из них, что соответствуют, попадают в массив filteredArticles и будут отображаться на странице. Модель данных предполагает передачу их с помощтю технологии AJAX, но в данном простом учебном локальном случае они просто описаны в скриптовом файле model-oae

Сохранить страницу и все файлы со скриптами (открываем их по ссылкам в коде) в каталоге Фамилия-Vue. Переименовать все файлы (заменив данные Орловой Евы Адамовны -oea, на свои. Исправить код страницы поиска (для новых имен файлов со скриптами).  Добавить в один из текстовых блоков свои  Фамилию Имя Отчество + краткую (авто)характеристку (редактируем файл model-???). Проверить работоспособность поиска, осуществить поиск блока со своими  с ними и сделав скрин (образец) сохранить его в каталоге Фамилия-Vue под именем Фамилия-поиск

  1. Открыть страницу с vue-редактором, познакомиться с его работой и устройством

    Возможность ввода и редактирования пользовательских данных на странице реализована на основе модели двусторонней привязки данных и объединия поля ввода со свойством модели. Когда вводится текст, он автоматически сохраняется в модели text_content, которая затем вызывает обновление для представления. Атрибут v-if показывает или скрывает целый элемент в зависимости от состояния переменной. Подробнее здесь).

    Ввести свои Фамилию Имя Отчество, сделав скрин (образец) сохранить его в каталоге Фамилия-Vue под именем Фамилия-edit

  2. Открыть страницу с vue-тестом и выполнить тест.

  3. В каталог  Фамилия-Vue сохранить страницу с тестом и библиотеку (используемую тестом) vue-oea . Переименовать библиотеку в vue-фио (с Вашими данными) и отредактировать код.

  4. На основании пройденного Вами теста создать свой собственный тест, который:

    • везде (в т.ч. в заголовке страницы) предъявлять Вашу Фамилию, вместо фамилии Орловой.

    • будет проверять знания по теме нашего учебного курса.

    • будет состоять из 10 заданий (в каждом два варианта ответа: верный и неверный)

    число заданий следует увеличить.
    Модуль с отдельным (не первым и не последним!) заданием имеет вид:

    {
    text: "Вопрос 2 Когда представлен первый релиз Vue.js",
    responses: [
    {text: 'в феврале 2014', correct: true},
    {text: 'в феврале 2015'},
    ]
    },

    • будет использовать библиотеку vue-фио (с Вашими данными, для чего следует переименовать Vue-kmp в Vue-фио и, соответственно, отредактировать код на странице с тестом)

  5. Отослать письмо с с отзывом о работе строго по форме об отзыве и архивом каталога Фамилия-Vue (в архиве должно быть два графических файла со скринами, три страницы, необходимые CSS-файлы и файлы скриптов).

 


 

  1. Посмотреть видео визуализации разработки 550+ репозиториев команды SEMrush
    Моделирование проведено с  помощью сервиса
     Gource

 kmp