Всем привет! Если что, я не забросил канал 🧘🏼‍♂️
С марта изучаю Vue.js.

В качестве старта для себя выбрал курс Владилена Минина по 3 версии.
И вот что получилось в качестве результата прохождения:
https://youtu.be/9BMlz-WUjUY

Покликать:
https://vue-online-bank-69ae3.web.app/
admin@mail.ru 123456

Использовались: vuex, vue router, axios, vee validate, yup, firebase hosting, firebase realtime database, composition api

В планах пройти еще несколько материалов по Vue.js, финальные результаты по ним буду фиксировать в таком же видео-формате.
После обучения расскажу, что хочу попробовать реализовать, конечно же в связке с 1С.

В целом очень крутой фреймворк, проще в освоение чем конкуренты (react, angular).
Подтягивайтесь в изучение Vue.js !🔥

#vue

⭐️ Быстрый старт во Vue.js
Составил начальную программу обучения на основе бесплатных материалов.

Блок Основной:
1) Изучаем основы https://youtu.be/p059z-0JTFg
2) Практика. Разбор задачи на собеседование по VueJS (создание SPA)
https://youtu.be/Ez5_CITkg24
3) Читаем переведенную документацию
https://ru.vuejs.org/v2/guide/index.html

Блок Composition api:
1) Composition API на Практике https://youtu.be/Ix8wcwrnPns
2) Чем крут Composition API? Vue 3 практические примеры
https://youtu.be/IVkI90LlBA8
3) Переписываем практику из второго пункта основного блока на сomposition api
4) Не забываем про документацию
https://v3.vuejs.org/guide/composition-api-introduction.html

Блок дополнительный:
1) Все о Vuex за 30 минут. Что такое Vuex. Как работает Vuex (getters, actions, mutations)
https://youtu.be/c2SK1IlmYL8

Блок практика:
1) Практика Vue JS - создание CRM системы (21 урок, 8 часов практики)
https://youtube.com/playlist?list=PLqKQF2ojwm3njNpksFCi8o-_c-9Vva_W0
Рекомендую усложнить себе задачу и попробовать реализовать с помощью composition api

#vue #избранное

https://youtu.be/rl7rz71BU4w
Закончил последнюю практику "Cоздание CRM системы" из последнего поста https://t.me/ovmst/86.
Усложнил задачу использовав Vue 3 + Composition Api.
Из-за усложения некоторым библиотекам из уроков пришлось искать аналоги и где-то реализовывать функционал самостоятельно.

После собрал пожелания по функционалу в комментариях к урокам и реализовал следующий функционал:
1) Фильтр записей по категории и типу
2) Сортировка записей по сумме/дате
3) Загрузка фото профиля
4) Адаптивная версия
5) Удаление записи
6) Модальное окно подтверждения при удалении категории и ее удаление
7) Восстановление пароля
8) Чат и количество новых сообщений

#vue

Quasar framework. Почему я выбрал именно его?
https://www.youtube.com/watch?v=I4bU0hQN-0o

- Большое количество UI компонентов
- Позволяет с помощью одной команды собрать приложение на 1 из 6 платформ (ios, android, windows, linux, mac oc,
расширение для браузера)
- Есть собственный CLI
- Удобная структура проекта
- Поддержка SSR
И многое другое...

Начал разработку приложения с использованием данного инструмента. На данный момент реализована регистрация, авторизация, восстановления пароля, настройки пользователя и основные заготовки для будущего функционала.
#quasar #vue

Продолжаю разработку приложения q-blog с использованием Quasar.
Добавлено следующее:
1) На главную страницу добавлен блок с тегами, по которому в дальнейшем можно будет фильтровать посты
2) Таблица топ 5 авторов
3) Страница пользователя. Реализована шапка.
4) Управление пользователями. Назначение администраторов. Поиск, сортировка таблицы
5) Управление тегами. Добавление нового тега. Удаление тегов. Изменение название тега. Управление видимостью тегов. Поиск, сортировка таблицы
6) Страница добавления нового поста с выбором тегов.
Весь добавленный функционал адаптирован под мобильные устройства. В качестве базы данных используется firebase realtime database.

Пока одно удовольствие разрабатывать на связке Vue + Quasar. Очень часто вижу запросы от 1Сников: разработать личный кабинет контрагента, создать кабинет сотрудника (вывод данных из ЗУПа). Данная связка выручит вас. Vue позволит быстро начать разрабатывать веб приложения, Quasar снимет головную боль с формами, таблицами и т.д. Вы будете сосредоточены на получение-выводе-отправке данных.

https://youtu.be/sdcPdPlzYsQ
#vue #quasar