💡 Встроенный редактор на Vue.js

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

Демо на CodePen.

Продолжение следует...

WebDEV #советы #web #Vue

💡 Подборка советов

▫️ Методы shift/unshift

▫️ Не торопитесь: это марафон, а не спринт

▫️ Немного о «length»

▫️ Двигайтесь медленно, но уверенно

▫️ Немного о «length»

▫️ Умейте быстро находить решения

WebDEV #подборка #советы

🔥 Лучшее на канале за неделю

1. Что такое Front-end и Back-end?.

2. Google Sites — простой, удобный и бесплатный сервис от Google для быстрого создания сайтов на бесплатном хостинге.

3. Меню навигации на Vue.js.

💡 Встроенный редактор на Vue.js

...Еще одна вещь, которую следует отметить в приведенном коде, - это атрибут v-if. Он показывает или скрывает целый элемент в зависимости от состояния переменной. Прочитать о нем больше можно здесь.

WebDEV #советы #web #Vue

WebDEV #test #HTML

Выберите правильный вариант 👇🏼

🛠 Spirit — инструмент для создания анимации, который поможет вам создавать и управлять анимацией в браузере в реальном времени.

WebDEV #инструменты

📖 Web Coding and Development For Beginners
🖋 Michаеl Dаvid, 2021

Чтобы стать веб-разработчиком, вы должны разбираться в HTML, CSS и JavaScript. Также рекомендуется ознакомиться c фреймворками CSS. Развитие этих фундаментальных навыков веб-разработки даст вам основу и логику для общения с языками программирования.

💾 Скачать книгу

WebDEV #book #JavaScript #web #CSS #HTML

💡 Форма заказа на Vue.js

В этом примере показан список услуг и суммарная стоимость выбранных. Так как наши услуги хранятся в массиве, мы можем использовать директиву v-for для перебора всех записей и их отображения. Если в массив добавлен новый элемент или изменен любой из старых, Vue автоматически обновит данные и покажет новые.

Демо на CodePen.

Продолжение следует...

WebDEV #советы #Vue

🔥 Лучшее на канале за неделю

1. Web Coding and Development For Beginners.

2. Spirit — инструмент для создания анимации, который поможет вам создавать и управлять анимацией в браузере в реальном времени.

3. Встроенный редактор на Vue.js.

WebDEV #test #CSS

Выберите правильный вариант 👇🏼

💡 Форма заказа на Vue.js

Первая часть.

Чтобы отобразить цены в правильном формате, нам необходимо определить простой фильтр валюты. Фильтры позволяют изменять или фильтровать данные модели. Чтобы определить настраиваемый фильтр, используем следующий синтаксис:

// Определяет пользовательский фильтр "валюта"
Vue.filter('currency', function (value) {
    return '$' + value.toFixed(2);
});

Фильтр довольно прост – он добавляет знак доллара и правильную цифровую дробь.

WebDEV #советы #web #Vue

Что знает крутой Junior Frontend разработчик?

Знаете, что отличает крутого Junior веб-разработчика от обычного? Чёрные очки... А ещё его навыки в разработке приложений.

Автор рассказывает, что стоит подучить Junior Frontend разработчику, чтобы выделяться на фоне остальных и стать по-настоящему востребованным.

📺 YouTube

WebDEV #видео #web

🛠 Coderbyte — платформа с более 200 задачами, которые вы можете решать напрямую в режиме онлайн на одном из 10 языков программирования.

WebDEV #инструменты

💡 Мгновенный поиск на Vue.js

Теперь создадим приложение, в котором будут представлены некоторые статьи-примеры. Приложение также будет иметь текстовое поле поиска, позволяющее фильтровать, какие статьи будут отображаться. Все статьи будут храниться в массиве, и те из них, что соответствуют поисковому запросу, будут в попадать в массив filteredArticles.

Демо на CodePen.

Продолжение следует...

WebDEV #советы #Vue

🔥 Лучшее на канале за неделю

1. Что знает крутой Junior Frontend разработчик?.

2. Coderbyte — платформа с более 200 задачами, которые вы можете решать напрямую в режиме онлайн на одном из 10 языков программирования.

3. Форма заказа на Vue.js.

WebDEV #test #js

Выберите правильный вариант 👇🏼

💡 Мгновенный поиск на Vue.js

Перед прочтением рекуомендуем ознакомиться с первой частью.

...Поле ввода привязано к модели searchString. Когда текст вводится, модель мгновенно обновляется, и массив filteredArticles генерируется снова. Таким образом, мы можем создать поиск в реальном времени, не заботясь о рендеринге или настройке прослушивателей событий.

WebDEV #советы #Vue