До окончания набора на онлайн-курс "Разработчик Node.js" осталось совсем чуть-чуть! Успейте пройти вступительный тест и записаться на курс со скидкой 20%: https://otus.pw/wZ9D/

За 4 месяца вы научитесь:
🧷разрабатывать бэкенд любой сложности на Node.js с использованием Express, Passport, Jest, GtaphQL, Next.js;
🧷работать с базами данных MongoDB и PostgreSQL;
использовать и настраивать CI/CD для своего проекта;
🧷конфигурировать приложения для production и деплоить на сервер;
🧷работать с Web Sockets (Socket.IO);
🧷писать понятный и чистый код на TypeScript.

Курс рассчитан на frontend-разработчиков или backend-разработчиков со знанием Javascript.

Почему пора перестать использовать IIFE?

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

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

#javascript #bestpractices

Красивый hover-эффект для кнопки

Код: https://prglb.ru/37lv6

#interface #snippets #code

​ТОП-6 JS фреймворков в 2020

Необычная подборка JavaScript-фреймворков, в которой нет React 😳

Посмотреть: https://prglb.ru/25w5v

#tools #frameworks #digest

Физическая симуляция на JavaScript и Canvas

Анимация цепочки шариков с полным погружением в физику.

Читать и повторять: https://prglb.ru/2v8tv

#animation #canvas

Как настроить отладчик для Chrome extension в Visual Studio Code

Отладка веб-приложений с помощью Visual Studio Code значительно повышает эффективность работы, помогает сэкономить много времени и сохранить чистоту кода.

Настроить: https://prglb.ru/xqmu

#tools #editor #debugger

Уроки для джуна

У джуниор-разработчиков особый взгляд на мир и отрасль. Со временем многие вещи переоцениваются.

7 абсолютных истин, в которые я верил джуниор-разработчиком
https://prglb.ru/3xbly

25 уроков для начинающего разработчика
https://prglb.ru/13pdh

#advices

Cutestrap

Компактный (2.7KB) CSS фреймворк с необычным синтаксисом, приятным дизайном и удобной кастомизацией на CSS-переменных.

Попробовать: https://prglb.ru/5uinx

Почему не стоит использовать LocalStorage

Локальное хранилище браузера - отличное решение для хранения небольших и не приватных фрагментов данных. Однако в некоторых случаях его использование категорически не рекомендуется:

Узнать, в каких: https://prglb.ru/4z35j

#browser #api

Ребята из Тинькофф Старт открывают регистрацию на онлайн-трансляцию посвященную летней программе!

26 марта в 19:00 расскажут об открытых направлениях и как подготовиться к вступительным испытаниям для каждого из них. А еще обсудят внутреннюю кухню, особенности обучения и истории ребят, которые когда-то начинали с Тинькофф Старт, а теперь строят карьеру в Тинькофф.

Для участия в трансляции зарегистрируйтесь и ищите письмо-подтверждение со ссылкой на трансляцию в указанной почте: https://prglb.ru/49n03

Напоминаем: у ребят есть телеграм-канал, где удобно следить за всеми новостями Тинькофф Образования: @tinkoff_fintech

Как установить местоположение пользователя через JavaScript

Использование Geolocation API на вашем сайте

Читать: https://prglb.ru/dl6g

#browser #api

​hover, focus и active - правильная стилизация

hover, focus и active - это разные состояния интерактивного элемента, поэтому и стилизовать их нужно по-разному. Это важно для обеспечения доступности вашего приложения.

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

А вот при навигации с помощью клавиши TAB, текущий активный элемент (focus) совсем неочевиден, поэтому его надо заметно выделить.

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

Подробнее: https://prglb.ru/2ts69

#css #interface

Гибридная ленивая загрузка

Атрибут loading для изображений и фреймов пока имеет ограниченную поддержку в браузерах.

К сожалению, для него нельзя создать адекватный JavaScript-полифилл. Но можно сочетать loading и привычную нам ленивую  загрузку через data-src.

if ('loading' in HTMLImageElement.prototype) {
  el.src = el.dataset.src;
}

Подробнее о гибридной загрузке: https://prglb.ru/3kf53
+бонус - скрипт vanilla-lazyload

#performance #html #javascript

Говоришь на JavaScript?

Тогда HolyJS 2020 Piter 16-17 июня для тебя!
2 дня, 3 десятка технических докладов от опытных разработчиков, море общения с коллегами, возможность обсудить наболевшее с матёрыми экспертами JavaScript или вовсе выступить в роли докладчика!

Программа HolyJS включает важные области JavaScript: от тем про управление базами данных на бэкенде до связки JS c ML и IoT.

Одно из новшеств конференции — добавление онлайн-трека: один зал будет специально оборудован для того, чтобы мы могли проводить доклады и дискуссионные зоны с удаленными спикерами. Будем держать вас в курсе.
На случай продления карантина и ограничений мы активно прорабатываем разные форматы участия в конференции (онлайн и смешанные). Билеты подлежат и обмену, и возврату.  

Промокод единомышленникам: proglib2020pc
Билеты и актуальная информация на сайте: http://bit.ly/2xx72a2

8 CSS фильтров для изображений

У дизайнеров есть множество продвинутых инструментов для работы с изображениями: различные фильтры, маски и прочие эффекты. Но часто разработчику приходится обходиться без всего этого богатства. К счастью, CSS предоставляет нам широкие возможности для манипуляций с изображениями.

Подробнее: https://www.cat-in-web.ru/8-css-filters/

#css

Что объединяет фотохостинг Pinterest и приложение для планирования Trello? Оба они написаны на JavaScript.
Если английский — это основной язык современного мира, то JS — это основной язык современного интернета, ведь на нем написано большинство сайтов, которые вы посещаете каждый день.

Для тех, кто хочет погрузиться в разработку сайтов и веб-приложений SkillFactory запустили курс «Frontend-разработчик». За 6 месяцев обучения вы освоите HTML, CSS, кроссбраузерную и адаптивную верстку, JavaScript и React и добавите в своё портфолио 6 проектов; дополнительный модуль про soft skills поможет подготовиться к собеседованиям.

За время обучения вы создадите собственный сайт-визитку, разработаете аналог канбан-доски Trello и немного погрузитесь в backend.

🚀Давно откладывали обучение? Самое лучшее время – сейчас! Получите курс со скидкой: https://clc.to/k8S7cQ

Паттерны проектирования в JavaScript

22 самых важных паттерна, реализованных на JS. На каждый паттерн - по одному коротенькому видео.

Смотреть: https://prglb.ru/3ryzc

#video #javascript #bestpractices

Как работает reduce() в JavaScript, когда его нужно применять и какие крутые вещи можно с ним делать

В этой статье вы узнаете про метод reduce() и какие клевые штуки можно вытворять с его помощью, выйдя за рамки его общеизвестного применения.

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

#javascript #core

Переплетение элементов на CSS

Пара слоев, режим наложения - вуаля! - получился очень симпатичный эффект переплетения.

Интересно-интересно: https://prglb.ru/505fr

#css

Ловите скидку на онлайн-курсы по JS и не только:

✔️Онлайн-курс «Fullstack разработчик JavaScript» - рассмотрим cоздание веб-приложений целиком на самых востребованных Javascript-фреймворках: Node.js, React.js, Angular.js и Vue.js, а также узнаем современные возможности Javascript: https://otus.pw/KpoE/

✔️Онлайн-курс «React.js разработчик» - авторский курс по самому популярному JS-фреймворку для Frontend-разработки: https://otus.pw/QY99/

✔️Онлайн-курс «Разработчик Node.js» - научимся разрабатывать бэкенд любой сложности на Node.js с использованием Express, Passport, Jest, GtaphQL, Next.js: https://otus.pw/wcaH/

Выберите интересующий именно вас курс, пройдите вступительный тест и учитесь у профессионалов со скидкой 20%!