Хорошие способы организации большого проекта Vue.js

Рассмотрим руководство по организации крупных проектов на Vue.js. В статье несколько методов для организации проекта, включая использование архитектурных шаблонов, настройку сборки и общие советы по организации файлов и структуре проекта.

👉 @sWebDev

​​🖥Использование адаптивных изображений в веб-разработке

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

Читать...

iOS Build fail in Script "[CP] Embed Pods Frameworks" with invalid path

https://github.com/flutter/flutter/issues/123852

#coding
#xcode

Архитектура frontend

В отличие от бека, инфы про архитектуру фронта очень мало.
Но все-таки есть хорошие материалы.

Мне очень нравиться цикл статей https://khalilstemmler.com/articles/client-side-architecture/introduction//
Он поможет разобраться в принципах, философии и реализации архитектуры на фронте.

Так же могу посоветовать https://feature-sliced.design/ но там есть свои нюансы, о которых постараюсь написать позже.

#frontend #architecture #ddd

Киллер фича Vue Devtools и IDE

Хочу поделится крутым возможностями которую я недавно обнаружил в Vue Devtools

По умолчанию есть возможность из dev tools перейти прямо к Dom компонента в инспекторе Chrome, что уже очень удобно при отладке разметки и стилей. <> Inspect DOM

Но есть еще более восхитительная возможность переходить в код компонента из браузера прямо в IDE. Можно настроить любой редактор (у меня получилось с VSCode и PHPStorm, другие не пробовал)

Обычно работает из коробки в vue-cli, nuxt, но если нет читайте этот док https://devtools.vuejs.org/guide/open-in-editor.html

Так же эта кнопка появляется только если вы выбираете ваш компонент, а не компонент из Vuetify например.

#vue #devtools #советы

Фронтед-разработчик Илья Туев делится опытом комплексной оптимизации проекта SPA, написанном на Vue 3, с использованием Vuetify для части UI компонентов и Firebase для авторизации.

Читать

Removing duplicates in an Array of Objects in JS with Sets

https://dev.to/marinamosti/removing-duplicates-in-an-array-of-objects-in-js-with-sets-3fep

#coding
#javascript

How to know if your application is running in cordova or a web browser

https://ourcodeworld.com/articles/read/390/how-to-know-if-your-application-is-running-in-cordova-or-a-web-browser

#coding
#javascript
#cordova
#mobile

Set up a Node.js App with ESLint and Prettier

https://dev.to/devland/set-up-a-nodejs-app-with-eslint-and-prettier-4i7p

#coding
#node
#eslint
#prettier

How to set up TypeScript with Node.js and Express

https://blog.logrocket.com/how-to-set-up-node-typescript-express/

#node
#express
#typescript

Using ESLint and Prettier in a TypeScript Project

https://dev.to/robertcoopercode/using-eslint-and-prettier-in-a-typescript-project-53jb

#typescript
#node
#eslint

A Complete Guide to Using TypeScript in Node.js

https://betterstack.com/community/guides/scaling-nodejs/nodejs-typescript/#step-8-linting-typescript-with-eslint

#coding
#node
#typescript

Reset Auto-Increment IDs in Postgres

https://brianchildress.co/reset-auto-increment-in-postgres/

#coding
#databases
#postgresql

Представляем вам Vue 3.3

В этом посте представлен обзор основных возможностей версии 3.3. Для получения полного списка изменений, пожалуйста, ознакомьтесь с полным журналом изменений на GitHub.

https://habr.com/ru/articles/735086/

#js #vue #ru

💬 Чат фронтендеров

Как yarn v3 и философия Zero Installs помогли нам сократить длительность ci/cd пайплайна в 3 раза

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

https://habr.com/ru/companies/kts/articles/735104/

#js #ru

💬 Чат фронтендеров

Что такое доступность
Часть 6

#html #формы

💛 Frontend || Vollex

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

Читать