Веб-страница
23.9K subscribers
1.77K photos
535 videos
1 file
3.97K links
Всё по фронтенду, бэкенду и девопсу в одном месте

Разместить рекламу: @tproger_sales_bot

Правила общения: https://tprg.ru/rules

Другие каналы: @tproger_channels

Сайт: https://tprg.ru/site

Регистрация в перечне РКН: https://tprg.ru/64ai
Download Telegram
GoAdmin — это небольшой Go-фреймворк, с помощью которого за несколько минут вы сможете создать админку для визуализации многих типов данных.

Быструю демку можно потыкать здесь: https://tprg.ru/XvcL

А посмотреть код здесь: https://tprg.ru/vziF

#фронтенд #go
Консольные команды для отладки в браузере

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

Вот подборка таких команд с пояснениями по применению:

https://tprg.ru/tU7o

#фронтенд #инструменты
Эффект перемещения частиц по гексагональной сетке

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

В конце получится несколько интересных анимаций. Вот их код:
https://tprg.ru/tAHi
https://tprg.ru/0mjW
https://tprg.ru/4DRk
https://tprg.ru/mYt8
https://tprg.ru/QG8L
https://tprg.ru/vEb3
https://tprg.ru/kUdz

Другие уроки по анимации:
анимация волнистых колец;
эффект притяжения и отталкивания частиц;
эффект электроразряда.

#фронтенд #javascript
Подборка из 10 фишек JavaScript

Т.к. React построен на основе чистого JS, то с помощью этих фишек можно будет писать более качественный код на этом фреймворке:

https://tprg.ru/sAOb

#javascript #react
Учебники по веб-разработке

Сайт, на котором собрана теория по многим темам веб-разработки — JS, PHP, Node.js, Vue.js, React.js, Laravel, WordPress, AJAX:

https://tprg.ru/vesT

#javascript #php
Онлайн-инструмент, с помощью которого можно сгенерировать CSS-стиль для Material Design компонента:

https://tprg.ru/xV5L

#фронтенд #css
Баг у Let's encrypt. Возможно, вам нужно перевыпустить сертификат

У Let's encrypt обнаружился баг в коде CAA, который появлялся во время выпуска сертификата. Баг уже исправлен, но некоторые сертификаты будут отозваны уже завтра, 4 марта.

Подробности бага описаны на официальном форуме: https://tprg.ru/aCzK

А проверить, нужно ли перевыпускать сертификат для своего домена можно здесь: https://tprg.ru/Adix

#безопасность
Чистый PHP

Репозиторий, в которой собраны принципы написания читабельного, переиспользуемого и пригодного для рефакторинга кода, адаптированные для PHP:

https://tprg.ru/VHyI

Взяты из книги «Чистый код» Роберта Мартина.

#php
Изучаем CSS вместе

.window:nth-child(3) { transform: rotate(45deg); }
Подборка из 5 бесплатных курсов для IT-Администраторов от Microsoft

1. Microsoft 365: модернизация корпоративного развертывания с использованием Windows 10 и Office 365: https://tprg.ru/A2Hu

2. Администрирование ресурсов инфраструктуры в Azure: https://tprg.ru/J4W3

3. Управление ресурсами в Azure: https://tprg.ru/FO4w

4. Основы Microsoft 365: https://tprg.ru/kHtR

5. Администрирование контейнеров в Azure: https://tprg.ru/Z7Ul

#devops
Paint времён Windows 95 реализовали на JavaScript

Для тех, кто хочет поностальгировать, порисовать можно прямо в браузере: https://jspaint.app/

25 лет назад можно было работать только с BMP, PCX или MSP форматами файлов (вы, наверное, даже и не знаете два последних!), а также сохранять и загружать цветовые палитры. Позже последнюю функцию убрали, зато добавили поддержку популярных и сейчас форматов вроде JPEG и PNG.

Интерфейс даже в Windows XP оставался таким же, просто в другом цвете. В то время Paint научился работать через GDI+ с большинством современых типов изображений, но всё ещё без поддержки прозрачности.

Значительные изменения пришли с Windows 7 и Ribbon-интерфейсом. А из десятки Paint вообще хотят убрать и перенести в Windows Store.
Влияют ли теги H1 на ранжирование в Google?

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

— «Поместите заголовок страницы в теги H1»;
— «Используйте только один заголовок H1 на страницу».

Сейчас вроде как Google более комплексно анализирует контент на странице, и эти правила уже не так и важны. Или нет?

Эксперт по SEO решил провести эксперимент и получить ответ на этот вопрос. Вот, что у него получилось:

https://tprg.ru/TZhW

#seo
В нашем конкурсе Tproger Gamify появилось ещё два задания: за прохождение тестов и прочтение статей. До подведения итогов осталась ещё неделя, так что вы тоже можете довести дело до конца.

Успевайте набрать баллы и поучаствовать в розыгрыше нашего мерча: https://tprg.ru/gamify21
HTTP/3 уже почти здесь. Поддержка в популярных браузерах реализована, но выключена по умолчанию, разработчики Nginx обещают присоединиться к веселью уже в текущей ветке 1.17, а CloudFlare в своём стиле просто добавила одну галку — тыкнул и всё работает.

Поиграться и провести тесты можно уже сейчас:

Собираем Nginx по инструкции (https://tprg.ru/yTiU) или берём готовый docker image (https://tprg.ru/1Rkr).

Выпускаем сертификат через Let's Encrypt, правим конфиги (https://tprg.ru/QbLu), запускаем контейнер.

Проверяем как всё работает:
— В онлайне: https://www.http3check.net/
— Через curl (собираем из исходников https://tprg.ru/Qqe2 или берём готовый контейнер https://tprg.ru/zOJe)

Включаем в браузерах:
— Chrome: chrome://flags/#enable-quic
— Firefox: about:config => network.http.http3.enabled

Мы должны получить уменьшение latency и в целом ускорение, потому что в теории в HTTP/3:
– Быстрее handshake (1 или 0-RTT)
— Нет проблемы с HOL (https://tprg.ru/Z6lF)
— Переключение сети проиходит без потерь

Узнать больше как работает HTTP/3 можно тут, например: https://tprg.ru/TmEi
Вдогонку к посту про HTTP/3

Команда Node.js сообщает, что экспериментальную поддержку QUIC (это транспортный протокол, лежащий в основе HTTP/3) для всех разработчиков добавят уже в Node.js v14, а полноценная поддержка QUIC и HTTP/3 появится в Node.js v15

Подробнее : https://www.nearform.com/blog/a-quic-update-for-node-js/

По ссылке также есть код для реализации QUIC клиента и сервера, чтобы вы могли сами всё попробовать и провести замеры.
Если ещё не знали, то у DigitalOcean есть весьма удобный конфигуратор для Nginx, который покрывает большинство стандартных кейсов:

https://tprg.ru/paQG

#бэкенд #nginx #инструменты
Поговорим немного о JIT в PHP 8

Новая мажорная версия PHP ожидается уже в конце 2020 года, так что сейчас ведётся активная разработка. Что-то может поменяться перед релизом, но в целом общий список изменений можно глянуть тут, например: https://tprg.ru/Ocoy

Одна из наиболее обсуждаемых фишек — Just In Time (JIT) компилятор. Он будет реализован как часть расширения Opcache. Суть в том, что некоторые участки кода будут компилироваться в инструкции CPU на лету. Это значит, что в некоторых случаях можно будет пропустить виртуальную машину Zend и выполнить код напрямую в процессоре.

На практике же ожидать серьёзного прироста производительности не стоит, потому что основной затык в PHP-коде обычно не в CPU, а в потоках ввода-вывода. Ускорение инструкций не ускорит обращения к диску или сетевые запросы.

Больше подробностей можно глянуть тут: https://tprg.ru/f67m

Ждём первые сборки, будем проверять на практике.

#бэкенд #php
This media is not supported in your browser
VIEW IN TELEGRAM
GoScan — сканер сети, основанный на nmap, но с большим уровнем абстракции. Умеет в автодополнение команд.

Обнаружение хостов, сканер портов, поиск запущенных сервисов через интеграции с другими утилитами — вот это всё.

Но самое интересное, что GoScan хорошо работает в нестабильном окружении с потерями связи. Все процессы запускаются в фоне и сохраняют состояние в SQLite. Если что-то пойдёт не так, можно будет продолжить с предыдущей точки или вообще получить результаты асинхронно.

Подробнее на гитхабе: https://github.com/marco-lancini/goscan

#сеть
Вышла новая версия Memcached 1.6.0

Авторы говорят, что добавили много крутых фич и исправили кучу ошибок, которые надо было давно пофиксить: https://github.com/memcached/memcached/wiki/ReleaseNotes160

Если кто уже пробовал — поделитесь в комментариях, как работает и есть ли ускорение или снижения загрузку CPU в этой версии.
Где и как мониторить скорость загрузки веб-сайта, чтобы понимать как можно всё улучшить — годная подборка инструментов от команды Tproger

https://tproger.ru/articles/tproger-performance-monitoring-and-improving-tools/

#мониторинг #инструменты