Должен ли фронтенд разработчик уметь писать бэкенды?

Автор этой статьи считает, что должен. Ведь чем большим количеством инструментов владеет разработчик, тем эффективнее он сможет решать проблемы заказчика: https://tprg.ru/3Olm

А вы как считаете? Читайте статью и присоединяйтесь к обсуждению этой темы в комментах.

#фронтенд #бэкенд

Просто лучший клиент для докера

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

Простая библиотека для создания разных графиков на React: https://react-charts.js.org/examples/line

Документация и инструкция по установке здесь: https://github.com/tannerlinsley/react-charts

#фронтенд #react

Использование микросервисной архитектуры на практике

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

Своим кейсом разработки и доставки микросервисов поделился программист из 2ГИС. Он рассказал про архитектурные решения, деплой, возможности масштабирования, трендовые и просто удобные инструменты для работы: https://tprg.ru/cYdA

#devops #архитектура

Подробное иллюстрированное руководство по CSS Grid

Заменит ли CSS Grid flex-box? В чём между ними разница? Почему не использовать Bootstrap вместо всего этого? И как работать с CSS Grid, если решили, что это именно то, что вам нужно? Обо всём этом читайте в статье: https://dev.to/mustapha/css-grid-illustrated-introduction-52l5

#фронтенд #css

Исходники музыкального стримингового сервиса: https://github.com/mallorybulkley/stratus-sound

Бэкенд написан на Ruby on Rails и PostgreSQL, а фронтенд — на React и Redux.

#фронтенд #ruby #react #redux

Как заранее подгрузить страницы, на которые перейдёт пользователь

Типичный путь человека в интернете: просмотр страницы, переход по ссылке, загрузка новой страницы. На сайтах-одностраничниках этапа загрузки новой страницы нет — все изменения происходят на единственной странице приложения. Всё ради того, чтобы пользователь как можно быстрее увидел контент.

А что если бы можно было загрузить новую страницу ещё до того, как человек перейдёт по ссылке? Есть 2 инструмента, которые могут помочь в этом:

quicklink — ищет на странице видимые ссылки и, если браузер в данный момент не занят какими-то тяжеловесными операциями, подгружает страницы, на которые эти ссылки ведут: https://github.com/GoogleChromeLabs/quicklink

instant.pаgе — если пользователь наводит курсор мыши на ссылку и держит его там 65 мс, то страница, на которую ведёт ссылка, подгружается: https://instant.page/2

#фронтенд #инструменты

Полный переход на HTTPS в Chrome

Google опубликовала расписание изменений в Chrome, которые должны привести к полному переходу на HTTPS-протокол: https://tprg.ru/KoEa

Сейчас некоторые HTTPS-ресурсы продолжают передавать часть данных по менее защищённому и безопасному HTTP. Гугл хочет положить конец смешанному трафику.

— В Chrome 79 появится кнопка, отменяющая автоблокировку смешанного контента на конкретных сайтах. Так можно будет получать по HTTP данные, которые Chrome сейчас блокирует.

— Chrome 80 начнёт автоматически передавать весь аудио- и видеоконтент по HTTPS. Если передача по HTTPS будет невозможна, браузер просто заблокирует этот контент. Разблокировать его можно с помощью функции, описанной в предыдущем абзаце.

— Chrome 81 будет весь смешанный контент либо передавать по HTTPS, либо блокировать.

#chrome #https

Drag-&-Drop-компоненты для слепых пользователей

Что объединяет Trello, Gmail, Aviasales, Google Keep? В каждом из них есть Drag-&-Drop-компоненты, которые можно перетаскивать мышкой. Это делает сайты по-настоящему удобными, потому что в реальной жизни мы часто используем этот паттерн. Передвигать вещи для нас естественно, поэтому и в вебе мы хотим перемещать элементы по экрану с одного места на другое, как стикеры на доске или магнитики на холодильнике. Сортировка todo-списков, организация дашбордов, загрузка файлов — очень сложно представить все эти события без перетаскивания элементов на странице.

Но есть нюанс. При создании таких компонентов разработчик думает, что пользователи физически видят экран и элементы, могут зацепиться за них мышкой и перетащить. Часто так и есть, но существует сегмент пользователей с проблемами зрения. Как сделать так, чтобы им тоже были доступны Drag-&-Drop-компоненты?

Рекомендуем рассказ разработчика о создании Drag-&-Drop-компонентов для тех, кто не видит экран и пользуется другими устройствами для взаимодействия с браузером. Текстовая версия: https://tprg.ru/YG27

#фронтенд #css #javascript

Чек-лист, в котором собраны основные пункты, связанные с безопасностью приложения: https://tprg.ru/eoJr

#безопасность

15 кастомных директив для Vue.js: https://tprg.ru/vPa1

#фронтенд #vuejs

Правильно настроенный с точки зрения безопасности nginx-конфиг: https://gist.github.com/plentz/6737338

#бэкенд #nginx #безопасность

⁠InfluxDB и базы данных временных рядов

Знакомы ли вы с базами данных временных рядов? Их основное преимущество перед другими типами БД — оптимизация для быстрого приёма данных. Это означает, что скорость загрузки не уменьшается со временем и остаётся достаточно стабильной (чего нельзя сказать про реляционные базы данных, например).

Читайте статью, которая даст вам общее представления о базах данных такого типа. А на примере конкретной БД InfluxDB вы увидите, как это всё работает в реальном мире: https://tproger.ru/translations/influxdb-guide/

#бэкенд #базыданных

Квиз из 20 вопросов по основам JavaScript: https://quiz.typeofnan.dev/

После каждого вопроса следует подробное объяснение правильного ответа, поэтому дополнительно гуглить ничего не придётся.

#javascript

Большой набор шпаргалок для bash-скриптов: https://devhints.io/bash

Сохраняйте и пользуйтесь.

#bash #шпаргалки

Заходят как-то два браузера в скроллбар… и начинают обсуждать особенности использования скроллбаров в веб-приложениях: https://tprg.ru/jBSc

#фронтенд #css #javascript

Опубликована новая стабильная ветка СУБД PostgreSQL 12

Основные новшества:
— поддержка «генерируемых столбцов»;
— возможность выполнения запросов данных из JSON-документов при помощи Path-выражений;
— включено по умолчанию применение JIT-компилятора для ускорения выполнения некоторых выражений во время обработки SQL-запроса;
— увеличена производительность индексирования.

О других новшествах читайте здесь: https://tprg.ru/CfEt

О том, как мигрировать на новую версию: https://tprg.ru/hZLS

#бэкенд #базыданных #postgresql

Конференции в Липецке и Воронеже

11 октября в Липецке пройдёт бесплатная конференция IT-подразделения «Спортмастера» — SM Lab 2019. Будут рассказывать о поддержке сайтов, мобильных приложений и серверов международной сети спортивных магазинов. Для участия нужно просто зарегистрироваться: https://tproger.ru/events/sm-lab-2019/

А 12 октября в Воронеже пройдёт GDG DevFest Voronezh 2019. 18 спикеров из Avito, DILETTANT, Студии Артемия Лебедева и других компаний будут говорить про разработку, дизайн, машин лёнинг. Вход на эту конференцию будет платный — от 350₽ (для студентов) до 600₽: https://tproger.ru/events/gdg-devfest-voronezh-2019/

#ивенты

Всё, что вы хотели знать о PornHub, но боялись спросить: https://davidwalsh.name/pornhub-interview

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

#фронтенд

Мнение: HTML-карты больше не нужны

Аналитик из Google Джон Мюллер согласился с мнением о том, что сайтам больше не нужны HTML-карты: https://tprg.ru/3obg

Говорит, что с точки зрения SEO, от них нет никакой пользы. А если и приходится обращаться к HTML-карте, то на сайте, скорее всего, плохая навигация и внутренний поиск.

#seo

Набор гайдов от Mozilla по созданию безопасных веб-приложений: https://infosec.mozilla.org/guidelines/web_security

#безопасность #шпаргалки