Vue Nuxt | IT Libs | RU
13 subscribers
201 photos
197 links
Плагины, пакеты и примеры на Vue.js
Download Telegram
Панель администратора для платформы GetTalim с vue.js

Этот пакет на GitHub представляет собой административную панель для проекта "GetTalim". В нем есть страница категорий с возможностью создания и обновления категорий на трех языках: узбекском, английском и русском. Есть также страницы для просмотра и управления данными студентов, наставников и курсов. Кроме того, пакет позволяет установить необходимые зависимости и скомпилировать код с возможностью горячей перезагрузки на этапе разработки.

Github
Компонент range vue, поддерживающий один или несколько thumb

Vue Range Multi - это компонент Vue для выбора диапазона значений с поддержкой одной или нескольких ползунков. Он автоматически определяет тип модели и отображает соответствующие ползунки. Компонент поддерживает динамическое добавление или удаление ползунков, а также предотвращает появление дубликатов. Он имеет настраиваемый стиль и тему, поддерживает темный режим и позволяет отобразить контент над или под ползунком.

Github
Приложение Cloudflare Domains Manager, созданное с использованием Vue.js

Этот пакет из Github представляет собой приложение Cloudflare Domains Manager, которое позволяет управлять доменами в Cloudflare. Оно построено на фронтенде Vue.js и бэкенде Python Flask. Для установки и настройки данного приложения необходимо установить несколько зависимостей, а также указать настройки окружения. Затем можно запустить разработческий сервер и получить доступ к приложению по локальному адресу. Участие в вызове, подробные инструкции и шаблоны запросов на исправления также предоставляются.

Github
Инструмент для обработки PDF-файлов, созданный с помощью Vue.js

PDF InBrowser.App - это инструмент для работы с PDF-файлами, полностью функционирующий в браузере без отправки данных на сервер. Быстрый, безопасный и работающий в офлайн-режиме. Особенности представленного пакета: все операции выполняются в браузере без риска для конфиденциальности, работа в офлайн-режиме с использованием PWA, совместимость с современными браузерами и устройствами, отсутствие необходимости в серверной части благодаря статическим файлам. Для разработки предоставляются команды npm run dev для запуска сервера разработки и npm run build для сборки в папку dist/.

Github
Стабильный веб-интерфейс генератора диффузионных изображений с использованием сети Crynux

Этот пакет из GitHub представляет собой веб-приложение, которое позволяет пользователям генерировать изображения в браузере с помощью Stable Diffusion. Приложение подключается к Crynux Network для использования удаленных графических процессоров, так что пользователи могут использовать приложение на любых устройствах без наличия собственных ГПУ. Все блокчейн и токен операции обрабатываются на сервере, для конечных пользователей это просто традиционное и удобное веб-приложение.

Github
Автономное решение для размещения ваших плагинов и расширений для игровых серверов cs2

Пакет ResourceMod content registry представляет собой решение для хостинга плагинов и расширений для игровых серверов cs2. В данном пакете предусмотрена возможность хранения контента в репозиториях Git, в частности на GitHub. С помощью веб-интерфейса пользователи могут создавать учетные записи, управлять пользователями, добавлять плагины и расширения, а также управлять интеграцией с Git. Разработчики также могут вносить свой вклад в развитие пакета, создавая задачи, форкая репозиторий и создавая pull-запросы.

Github
Настраиваемый компонент Vue для ввода ползунка диапазона

Этот пакет из GitHub представляет собой настраиваемый Vue-компонент для ползунка ввода диапазона. Он предоставляет возможность использовать статические или динамические шаги, а также дополнительные визуальные правила для лучшего пользовательского опыта. Пакет установить можно при помощи yarn или npm. Далее нужно импортировать компонент в файл Vue и зарегистрировать его. Компонент можно использовать в шаблоне, указывая необходимые значения атрибутов. Компонент также поддерживает различные события и слоты для настройки внешнего вида и стиля.

Github
Приложение IP InBrowser, созданное с помощью Vue.js

IP InBrowser.App - это набор мощных IP-инструментов, работающих полностью в вашем браузере без использования серверного кода. Приложение обрабатывает всю информацию в браузере, что исключает риск утечки конфиденциальных данных. Оно полностью функционирует без подключения к сети и поддерживается на всех современных браузерах и устройствах. Все файлы статичны, и для работы приложения не требуются серверные ресурсы.

Github
Групповой интерфейс с меню вкладок для переключения видимости полей внутри группы

Этот пакет из Github представляет собой интерфейс группировки вкладок с возможностью переключения видимости полей внутри группы. Он может использоваться в качестве альтернативного решения для интерфейса перевода. Вы можете использовать этот интерфейс для переключения видимости полей индивидуально, частично или все поля сразу, по вашему усмотрению. Например, вы можете переключать видимость полей title_de и title_en.

В настройках вашего интерфейса вы можете использовать поле JSON для указания, какая кнопка отображает какие поля. Также есть возможность настройки стилей с помощью классов .tab-group, .tab-group .menu и .tab-group .menu .menu-item. Например, вы можете отключить вертикальную линию с помощью следующего CSS кода: .tab-group::before { content: none !important; }

Github
Инструмент Laravel Nova для создания адаптивных таблиц

Laravel Nova ResponsiveTable - инструмент для Nova, который улучшает ваши таблицы Nova, позволяя скрывать и показывать столбцы в зависимости от изменения размера экрана. Это делает таблицы адаптивными и более удобными для пользователя. Он включает в себя такие функции, как адаптивность таблиц, интуитивное переключение видимости столбцов и не требует использования внешних библиотек. Установка производится с использованием Composer, регистрируется в файле NovaServiceProvider, а затем настраивается в ваших ресурсах Nova. Лицензия MIT, поддержка и дополнительные возможности предоставляются через GitHub.

Github
Сгенерируйте и загрузите счет-фактуру с помощью Vue.js

Пакет Invoice Generator (invoice-generator) - это инструмент для создания и загрузки счетов. Он обладает следующими функциями: темная и светлая темы, многоязычность, печать в формате PDF и возможность редактирования деталей счета. Для работы с пакетом необходимо установить зависимости, запустить приложение в режиме разработки и провести линтинг и форматирование файлов. Пакет также предлагает возможность настройки конфигурации.

Github
Сокращайте и увековечивайте ваши ссылки, текст и файлы в сети с помощью zkSync Era

Этот пакет из GitHub представляет собой платформу EraLink, которая позволяет сокращать и хранить анонимно на блокчейне zkSync ссылки, тексты и файлы, делая их доступными навсегда. Он предлагает несколько применений, таких как проверка подлинности документов, сохранение оригинальных идей с отметкой времени и постоянное совместное использование контента. Пакет состоит из двух основных директорий - contracts, где находятся смарт-контракты, и frontend, где разрабатывается пользовательский интерфейс. К сожалению, в данный момент в нем нет тестов, но он вдохновлен другими проектами и использует ресурсы zksync-cli и zkSync Era Tutorials. Весь проект распространяется под лицензией MIT.

Github
Forwarded from Душный Вуй
#vue

Тут про Vue паттерны написали

https://www.patterns.dev/vue
Знаете ли вы, что в vuejs вы можете деструктурировать с помощью v-for?

Michael Thiessen
Более широко известно, что вы можете извлечь индекс из v-for, используя кортеж, подобный этому:

Michael Thiessen
При использовании объекта вы также можете захватить ключ:

Michael Thiessen
Также возможно объединить эти два метода, захватив ключ, а также индекс свойства:

Michael Thiessen
Nuxt острова

Вы когда-нибудь задумывались о возможности полного отображения вашего компонента на сервере? JS на стороне клиента отсутствует. Компонент предоставляет эту возможность, позволяя вам отображать части вашего приложения на сервере. Подробнее об этом читайте в этом блоге.

Читать полностью
Чит-лист по методам манипулирования строками

Краткая шпаргалка
Я только что узнал, что вы можете деструктурировать в v-for