Как организовать конфигурационные параметры в приложении?

Наиболее удобна, имхо, следующая конфигурация конфигов.

Есть, грубо говоря, .env, .env.staging, .env.local

Локально используется .env.local, он в гитигноре, и у каждого разработчика свой. Если работаешь один, или у всех локально одна конфигурация - .env.local не нужен.

При CI/CD .env.staging заменяет .env. При этом используются / добавляются в конфиг (для бэка) нужные секреты. У CI/CD свой конфиг.

Есть два варианта распределения параметров по конфиг файлам.
- Первый - .env хранит основные параметры, а .env.local и .env.staging только переопределяют нужные (merge).
- Второй - в каждом из них хранится полная конфигурация.

У обоих свои плюсы и минусы. Первый - удобней, можно легко добавлять общие конфигурационные параметры и не просить всех разработчиков обновить свой .env.local. Второй - наглядней, при CI/CD можно просто заменять файлы.

Данная система позволяет, например, легко переключиться и поработать на локальном фронтенде со staging бэкендом вместо локального. Можно просто написать скрипт для этого в package.json.

В такой системе никто случайно не запушит свой конфиг в репозиторий, никто не имеет доступа к секретам и чужим параметрам.

env / dotenv - довольно старая штука и недостаточно гибка для реализации удобных конфигов, поэтому я храню конфиги в json / js файлах. Их легко объединять в коде и, вообще, закладывать нужную тебе логику. Ну и древовидная система конфигурационных параметров намного читабельней и удобней в работе в коде.

Доступ к конфигу в приложении:
import { config } from "@/app-config"

#tip #cicd

Дележка личным опытом прохождения Vue сертификации

#certification

Не всегда только Safari и Firefox тормозят прогресс в веб деве. В последнем Chrome появилось то, что в них было давно - CSS свойство font-size-adjust.

Оно позволяет корректировать размер шрифта. Для чего это нужно?

Представим, у вас основной шрифт, и фолбэк шрифт. Даже если они одного размера (font-size), визуально они могут сильно отличаться, и при загрузке основного шрифта могут происходить дёргания экрана. Чтобы этого не было можно подогнать font-size-adjust фолбэк шрифта.

#css

В GitHub решили обновить инфраструктуру базы данных и положили на час свой сервис для всего мира

#github #qa

В третьей стадии находится пропозал о декораторах в JavaScript

Если его примут, задание реактивных переменных возможно "упростится" до:

@reactive
let count = 0;

@shallowReactive
let messages = [];

Правда, после этого js перестанет быть js-ом...

#js #tc39 #decorators

Может кому надо

Красивая природа, бесплатное жилье, немного денег на покушать и 4 года времени, чтобы не торопясь вползти в айти

#offtop

Много лет Google Tasks был таким сирым и убогим отпрыском в семействе продуктов Google. Из плюсов в нём был доступный API.

Из-за чрезмерной упрощенности Google Tasks ранее не пригождался, и для небольших напоминаний я давно использовал Google Calendar события + Google Keep или TickTick (который на телефоне постоянно выгружается из памяти), но тут обнаружил, что Google Tasks сильно переделали и привели в соответствующий эпохе вид. Даже в "канбан" доску засунули.

Выглядит удобоваримо. И семантика поправилась: "Позвонить Маше" - это, всё-таки, задача, а не событие.

Используя их API можно, кстати, сделать свои Задачи, и, с моей точки зрения, это намного более полезный пет-проект для фронтендера, нежели стандартный магазин. Потому что магазин ты слабал и выкинул, при собеседовании на них даже не смотрят, понимая, что 99% это просто чужая копия. А вот хорошо сделанными Задачами можно пользоваться самому или распространять их для других. Мне такие качественные приложения встречались.

#google #tasks #pet

Если человек самостоятельно и добровольно выбрал Vue.js - у него есть хороший вкус. А вкус - это абсолютная мера, она не бывает только в каком-то одном направлении. Значит и кино он любит правильное.

"Большой Лебовский" - культовый фильм братьев Коенов. У них хватает культовых фильмов, и на первых местах в них выступают диалоги, поэтому Коэнов надо смотреть в оригинале, пусть и с субтитрами. Дубляж (перевод голосом) убивает половину впечатлений от любого фильма.

Большинство фильмов Коенов символичны и наполнены метафизикой. Если вы её не видите, значит, вы её не видите.

Еще один шедевр братьев - "Фарго" (фильм, не сериал). Но их жемчужиной однозначно является "Старикам здесь не место".

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

#movie #offtop

Проджект менеджер объясняет джуну, что надо сделать

(осторожно, мат)

#humor #offtop

Vue реализовала систему непрерывных релизов pkg.pr.new

Теперь можно локально поставить любой еще неопубликованный на NPM коммит для тестирования нового функционала фреймворка

pnpm add https://pkg.pr.new/vue@7a6c665

#vuejs

Тут еще один вариант портировать через WebView своё веб-приложение на мобильные и десктопные платформы нарисовался - Socket Runtime

Выглядит пока малоизведано

#mobile #desktop

Очень интересное интервью ведущего разработчика Yandex Cloud Андрея Мелихова о состоянии дел с Node.js.

Поговорили о том, полезен ли Node.js на бэкенде, нужна ли сквозная типизация между фронтом и бэком, мёртв ли PHP и многом другом.

Кратко: Node.js только для Next.js (BFF), для бэкенда есть много других более подходящих языков, включая PHP

#nodejs #interview #video

FormKit добавил AI себе в KickStart

Впечатляет.

Сейчас как раз экспериментирую с AI на проекте - им можно довольно сильно расширить функционал и повысить UX приложения самым разным образом.

#forms #formkit #ai

Nuxt славится своей агрессивной маркетинговой политикой, Vue на фоне его идет тихой сапой.

Но если посмотреть на NPM статистику скачивания пакетов для того и другого, то видно, что проектов на Vue где-то в 6-7 раз больше, чем проектов на Nuxt

#nuxt #vuejs #stats

Еще один вариант для "умного" бэкенда как альтернатива Firebase и Supabase - Convex

Open source, можно сделать self-hosted, есть бесплатный тарифный план, но реализует все по-своему (= сильная привязка)

П.С. Попробовав разные `BaaS` решения пришел к выводу, что баловство всё это. Для сколь-нибудь серьезного продукта нужен свой сервер, своя база и свой бэк.

#baas #firebase #supabase #convex

Если говорить о действительно маст-хэвных скиллах фронтендера, то это никакие не VueUse-ы, а, например, UML.

Умение читать и составлять 3-4 основных типа диаграмм сильно помогает в описании структуры программы, потоков выполнения кода, умении сформулировать и выполнить задачу.

Визуальное представление очень облегчает понимание и декомпозицию сложных систем.

#uml #architevture

К Дурову можно по-разному относиться, но людей, у которых руки растут не из жопы, он умеет находить

Chrome DevTools -> Memory -> Total JS heap size

#benchmark #telegram #nuxt

Web WhatsApp - 170MB
Slack - 125MB
VK.com - 120MB
Dzen.ru - 70MB
Nuxt.com - 40MB
Google Calendar - 40MB
Google.com (пустой) - 30MB
Web Telegram - 25MB
Vuejs.org, vue-faq.org - 5-10MB

Этого человека убили сразу после интервью

Жуткая правда о js мета-фреймворках...

#video #vercel