Принципы SOLID в JavaScript

SOLID-принципы - это набор из пяти правил для создания качественного кода.

👉 S- Single Responsibility. Класс (Функция) должен делать только одну вещь. Например, не стоит смешивать логику и представление.
👉 O - Open-Closed. Классы нужно проектировать так, чтобы для добавления новой функциональности не нужно было изменять уже написанный код.
👉 L - Liskov Substitution. Дочерние классы всегда и везде могут замещать родительские.
👉 I - Interface Segregation. В интерфейсе должны быть лишь те методы, которые клиент действительно использует.
👉 D - инверсия зависимостей. Все в проекте должно зависеть только от абстракций, а не от конкретных реализаций.

Смотреть: https://prglb.ru/562ve

В видео - подробный разбор каждого принципа, а также их применение на практике в JavaScript.

#bestpractices #solid

#vue

Сможет ли Vue.js превзойти React в 2020 году?
(вряд ли)

https://nuancesprog.ru/p/7064/

Юнит-тестирование фронтенда без фреймворка

Модульные тесты своими руками.

Читать: https://prglb.ru/4c1ph

#testing

#css #tools

Крутой генератор разделителей секций на чистом CSS, который сэкономит вам минуты, а возможно и часы вёрстки -)

https://wweb.dev/resources/css-separator-generator

Нужно что-то сделать с помощью Git, но не знаете, какую команду написать? Попробуйте сервис Git Explorer. Вбиваете туда задачу, которую вам нужно решить, а сервис подсказывает нужную команду:

https://tprg.ru/GLPW

#git #инструменты

#vuejs #tools

Валидация форм с помощью Vuelidate

Простая проверка пользовательского ввода в приложениях на Vue.js.

Читать: https://prglb.ru/3wkru

#tools #frameworks #library #vue

#vuejs #tips

Vue.js: Lazy load routes with Webpack dynamic comments.

https://dev.to/baumannzone/vue-js-lazy-load-routes-webpack-dynamic-comments-51nf

Сокращаем код

Читать

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

#frontend #js

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

8 сервисов и сайтов, чтобы сделать клёвую обложку для статьи

Ситуация: статья написана, но у компании нет собственного дизайнера или иллюстратора. Статью выпускать без обложки нельзя, а уже сроки горят. Виталий Вебер собрал несколько сервисов, которые помогут сделать обложку для статьи:

Screely. Если в статье упоминается сервис, окно, документ или что-то ещё: лучше положить изображение на подложку с тенью. Через Screely это можно сделать быстро: загружаете скриншот, включаете тень, ставите поисковую строку или убираете и готово.

8 Icon Vector. Если нужно сделать обложку как у иллюстратора — этот сервис подойдёт. Внутри есть собственный редактор с кучей стилей и изображений.

Open Doodles. Сайт с кучей нарисованных изображений. Можно скачать всё и после составить свою композицию в Фотошопе.

unDraw. Сайт с нарисованными людьми и сайтами. Идеально подойдут для лендинга сервиса или услуги.

Get Cover. Если нужно накинуть сайт или документ в мокап техники — это идеальный вариант. Загружаете изображение и выбираете на какое устройство поместить. Всё готово за три минуты.

Remove.bg. Если нужно вырезать из картинки человека или предмет — попробуйте этот сервис. Вырезает практически идеально и можно не мучиться в Фотошопе с выделением.

Absurd Design. Если нужен креатив-креативный, здесь собраны скетчи, которые не подходят под простые определения фотостоков.

Gratisography. Если вы устали от картинок в фотостоке — этот сайт выручить. Здесь куча нестандартных фотографий и композиций.

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

#js #tips #english

Шпаргалка по window.location

https://dev.to/samanthaming/window-location-cheatsheet-4edl

#frontend #tips #typescript

Чистая архитектура.
The Clean Architecture на TypeScript и React.

https://habr.com/ru/post/499078/

#js #book #english

Beginning Functional JavaScript

Автор: Anto Aravinth
Год издания: 2017

Скачать книгу

#JavaScript #es6 #english

#js #tips

Понимание (всех) «модульных» форматов и инструментов JavaScript
https://habr.com/ru/post/501198/

RoughJS — это графическая JS-библиотека, которая позволяет в рукописном стиле рисовать на <canvas> и с помощью SVG.

Здесь сама библиотека: https://tprg.ru/7d3j

А здесь её создатель рассказывает, как это работает и какие алгоритмы используются под капотом: https://tprg.ru/2riI

#фронтенд #javascript

#css #tips

Создайте красивый input range только с CSS

https://dev.to/christo_pr/create-a-nice-looking-input-range-with-only-css-4oa2