karambafe

vue-click-outside
vue-on-click-outside
v-click-outside
vue-clickaway

CI/CD (Continuous Integration/Continuous Delivery) сервер ответ на ваши проблемы. Например, bitbucket pipelines, circle ci, gitlab pipelines, jenkins и т.д. Работает так:

• сервер отслеживает пуши в определенные ветки, например, в master.
  
• если в master пришли коммиты, то запускается определенный скрипт, который вызывает сборку (обычно еще перед этим запускаются тесты, если есть).
  
• если сборка прошла успешно, то результат этой сборки кладется в отдельную папку -- это называется build artifact
  
• этот build artifact тем или иным образом загружается на хостинг -- у всяких там AWS/Azure и т.п. облак обычно есть API для этого, можно передавать файлы через scp или sftp.
  

Если вся инфраструктура локальная, то и CI/CD сервер обычно ставят локально, например, Jenkins или TeamCity. Но без выделенного админа/девопса проще в облаках настроить, наверное.

P.S. это, конечно, годится не только для проектов на vue, а вообще для любого веба, включая бэкенд.

Вы же можете конвертнуть 0/1 в false/true:

Boolean(0) // false
Boolean(1) // true

Давным давно (года 2-3 назад) заварилась тема рисования с помощью CSS. Я тогда даже небольшую заметку на хабр писал по этому поводу. В те времена мы делали простые картинки вроде таких:

Это было интересно и познавательно. С одной стороны это челлендж, с другой - способ самообразования. На тот момент картинки были не очень сложными для понимания и тема людям понравилась. Время шло, народ постепенно изучал основы CSS (правда как всегда не у нас, у нас это дело в основном критиковали со словами "фигней маятесь, зачем это нужно" или "ну я же фронтенд-сеньер-реакт-помидор-разработчик, зачем мне нужно знать CSS"), но так или иначе картинки становились все более интересными, появлялись новые квесты и на данный момент можно сказать, что это своеобразный вид искусства с практически полезной составляющей. Понятное дело, что в продакшен такие картинки делать долго - проще взять SVG, но для обучения они хорошо подходят. Магии там нет.

Это может быть SVG с элементами-чекбоксами и белой линией, поверх которой отрисовывается жёлтая линия по вот такому сценарию: Scroll to draw



Вот пример похожий: le-mugs.com (см раздел La Carte) в работе и пример на codepen https://codepen.io/proweb1991/pen/GNxYaR

Самый нормальный вариант который я нашел
chrisarasin.com/frosted-glass-css/draggable-window

https://www.npmjs.com/package/bem-validate

например

сделайте набор микросервисов и посадите их за проксик ( nginx / traefik ) для удобства можно все упаковать в докер и будет легкая доставка и легкое обновление :)

SVG поддерживает добавление классов и id для элементов, и на них можно писать css. Правда свойства и значения свои, например fill, stroke...

Предложение больше не по месту проверки, а по файловой структуре.
Можно завести файл вроде jwtTokenChecker.js, поместить туда функцию для проверки (чтобы не смешивать ее с другим файлом):

import jwt_decode from 'jwt-decode';

import store from './redux/store';
import { setCurrentUser, refresh } from './redux/actions/authActions';

export default () => {
	if (localStorage.getItem('jwtToken')) {
	    const decoded_jwt = jwt_decode(localStorage.getItem('jwtToken'));
	    store.dispatch(setCurrentUser(decoded_jwt));

	    const current_time = Date.now() / 1000;

	    if (current_time > decoded_jwt.exp) {
	        store.dispatch(refresh())
	    }
	}
}

Потом где-нибудь при ините, например, в index.js, когда стор уже готов, сделать так:

import checkJwtToken from './jwtTokenChecker';

checkJwtToken();

Что касается расположения, я бы поместил в index или в инит стора, потому что кажется, что без этих данных еще нет смысла рендерить приложение.

localStorage.setItem('items', JSON.stringify(this.items)); // записать
this.items = JSON.parse(localStorage.getItem('items')) || []; // получить