21 рекомендация по HTML
Нашёл материал для тех, кто решил погрузиться в мир фронтенд-разработки. Здесь собраны довольно базовые советы. Тем не менее, они будут крайне полезны тем, кто только начинает свой путь. Вы найдёте рекомендации по семантической вёрстке, правильному использованию базовых тегов и многому другому.
Подробнее в материале.
#html #веб
Нашёл материал для тех, кто решил погрузиться в мир фронтенд-разработки. Здесь собраны довольно базовые советы. Тем не менее, они будут крайне полезны тем, кто только начинает свой путь. Вы найдёте рекомендации по семантической вёрстке, правильному использованию базовых тегов и многому другому.
Подробнее в материале.
#html #веб
🔥9👍3❤1
Как понять, ты Boy, Teen или Man в CSS на примере одного бургер-меню?
Попробуйте «тест Кнута для фронтенда» и узнайте, какой у вас уровень в CSS:
Boy: бургер как Unicode-символ — быстро, но без контроля пропорций и анимаций;
Teen: три
Man: один псевдоэлемент
В статье можете также посмотреть живые примеры каждого решения, а также как растёт «чистота» разметки и глубина владения CSS.
#css #фронтенд
Попробуйте «тест Кнута для фронтенда» и узнайте, какой у вас уровень в CSS:
Boy: бургер как Unicode-символ — быстро, но без контроля пропорций и анимаций;
Teen: три
div ‑а, flex‑контейнер и полный контроль над геометрией и анимацией;Man: один псевдоэлемент
::after + box-shadow для трёх полосок, плюс скрытая подпись ради доступности.В статье можете также посмотреть живые примеры каждого решения, а также как растёт «чистота» разметки и глубина владения CSS.
#css #фронтенд
❤9👍3🤯1
Свежайший курс по Git и GitHub от freeCodeCamp
Изучите Git и GitHub с нуля на наглядных примерах и в реальных рабочих процессах. Идеально подходит для новичков, которым нужна прочная основа.
#git #github #курс
Изучите Git и GitHub с нуля на наглядных примерах и в реальных рабочих процессах. Идеально подходит для новичков, которым нужна прочная основа.
#git #github #курс
YouTube
Git & GitHub Crash Course for Beginners [2026]
Learn Git and GitHub from scratch with clear examples, real workflows, branching, merging, stashing, rebase, pull requests, and more. Perfect for beginners who want strong foundations.
📚Resources
🔗 Git/GitHub Cheatsheet - https://www.facebook.com/share/p/17sW4f865u/…
📚Resources
🔗 Git/GitHub Cheatsheet - https://www.facebook.com/share/p/17sW4f865u/…
🤣9👍1
Forwarded from Zen of Python
pyreqwest — новый HTTP-клиент на Rust для Python. GIL-free, HTTP/2 из коробки, sync и async с одинаковым API. Автор — тот же разработчик, который открыл issue #3215 в httpx о 10x просадке производительности при конкурентных запросах.
Зачем переходить с httpx
httpx/httpcore имеют давние проблемы с connection pooling — при 20 конкурентных запросах httpx в 10+ раз медленнее aiohttp. Эти баги висят годами. pyreqwest решает их на уровне архитектуры, потому что connection pool реализован на Rust.
➡️ Если httpx работает — можно не трогать. Но в высоконагруженных системах он станет бутылочным горлышком.
Фичи
🔘 HTTP/1.1 и HTTP/2 (у aiohttp нет HTTP/2)
🔘 Автодекомпрессия: zstd, gzip, brotli, deflate
🔘 TLS через rustls
🔘 Connection pooling, стриминг, multipart
🔘 Куки, прокси, редиректы, таймауты
🔘 Полные type hints, zero Python-зависимостей
🔘 Встроенный мок для тестов + подключение к ASGI напрямую
Быстрый старт:
📎 Код на GitHub
@zen_of_python
Зачем переходить с httpx
httpx/httpcore имеют давние проблемы с connection pooling — при 20 конкурентных запросах httpx в 10+ раз медленнее aiohttp. Эти баги висят годами. pyreqwest решает их на уровне архитектуры, потому что connection pool реализован на Rust.
Фичи
Быстрый старт:
# uv add pyreqwest
from pyreqwest.client import ClientBuilder, SyncClientBuilder
async def example_async():
async with ClientBuilder().error_for_status(True).build() as client:
response = await client.get("https://httpbun.com/get").query({"q": "val"}).build().send()
print(await response.json())
def example_sync():
with SyncClientBuilder().error_for_status(True).build() as client:
print(client.get("https://httpbun.com/get").query({"q": "val"}).build().send().json())
@zen_of_python
Please open Telegram to view this post
VIEW IN TELEGRAM
🤩3👎2
Можете не открывать вишлист программиста — мы уже знаем, что там
Cобрали большую и удобную подборку из 65 новогодних подарков для айтишников, разбитую по категориям и бюджету.
Внутри есть идеи для всех: джунов, мидлов, сеньоров и даже тимлидов.
От подставок, мышей и ламп до дронов, консолей, трекеров сна и умного дома.
А ещё — отдельный бонус-раздел с неудачными подарками, чтобы точно не промахнуться и не прослыть тем самым человеком из офиса.
Cобрали большую и удобную подборку из 65 новогодних подарков для айтишников, разбитую по категориям и бюджету.
Внутри есть идеи для всех: джунов, мидлов, сеньоров и даже тимлидов.
От подставок, мышей и ламп до дронов, консолей, трекеров сна и умного дома.
А ещё — отдельный бонус-раздел с неудачными подарками, чтобы точно не промахнуться и не прослыть тем самым человеком из офиса.
❤5👍3
Снимайте треники — Новый год вы отмечаете в ОТПадном луке!
OTP Tech принес вам timeless образ того самого квотербека, который скоро станет королем школы.
+2026 очков к удаче в грядущем году, если отправите этот скин трём друзьям и с первого раза поймаете его в нашей виртуальной примерочной!
Реклама
OTP Tech принес вам timeless образ того самого квотербека, который скоро станет королем школы.
+2026 очков к удаче в грядущем году, если отправите этот скин трём друзьям и с первого раза поймаете его в нашей виртуальной примерочной!
Реклама
❤3👍1🤩1
Что такое WebRTC — как работает, преимущества и примеры использования
Web Real-Time Communications — относительно новая технология, которая вывела онлайн-коммуникации на принципиально новый уровень. Она имеет открытый исходный код и отвечает за потоковую передачу данных с использованием API JavaScript для связи между браузерами и приложениями в формате peers-to-peers (точка-точка).
WebRTC применяется в таких секторах как образование, управление персоналом и HR, банкинг, страхование, здравоохранение и многих других.
Подробнее о технологии и её особенностях, рассказали в статье.
#webrtc #веб
Web Real-Time Communications — относительно новая технология, которая вывела онлайн-коммуникации на принципиально новый уровень. Она имеет открытый исходный код и отвечает за потоковую передачу данных с использованием API JavaScript для связи между браузерами и приложениями в формате peers-to-peers (точка-точка).
WebRTC применяется в таких секторах как образование, управление персоналом и HR, банкинг, страхование, здравоохранение и многих других.
Подробнее о технологии и её особенностях, рассказали в статье.
#webrtc #веб
👍6❤3
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🤣24😁5👍2❤1
В CSS появилась функция if() — наконец-то условная логика прямо в значениях свойств
До этого приходилось использовать Sass,
Как это работает, где поддерживается и когда использовать — в статье.
#css #фронтенд
До этого приходилось использовать Sass,
@media, @supports или раскидывать стили по разным селекторам. Теперь можно писать инлайн:color: if(style(--theme: dark): white; else: black);
Как это работает, где поддерживается и когда использовать — в статье.
#css #фронтенд
🔥19💩6🤔2👍1🤯1
Forwarded from Инструменты программиста
Let's Encrypt теперь выдаёт SSL-сертификаты на голые IP-адреса — домен не нужен
Фича официально запущена и открыта для всех. Раньше для HTTPS на IP приходилось либо платить (от $40/год), либо мириться с self-signed и предупреждениями браузера.
Нюансы и ограничения
🔘 Сертификат живёт только ~6 дней — политика безопасности, IP могут менять владельцев
🔘 Нужен ACME-клиент с поддержкой shortlived profile (Certbot, acme.sh, Caddy — уже умеют)
🔘 DNS-challenge не работает — только HTTP-01 или TLS-ALPN-01
🔘 Автопродление обязательно — иначе протухнет за неделю
Кому пригодится
Хоумлабы, NAS, IoT-девайсы, камеры — всё, что торчит наружу по IP без домена. Тестовые и staging-окружения, эфемерные облачные сервисы. Для продакшена с нормальным доменом смысла мало — 90-дневные сертификаты удобнее.
➡️ Также важно, что Let's Encrypt переходит на новую иерархию корневых сертификатов «Generation Y» и начнёт сокращать срок действия всех сертификатов: 64 дня в 2027-м, 45 дней в 2028-м.
@prog_tools
Фича официально запущена и открыта для всех. Раньше для HTTPS на IP приходилось либо платить (от $40/год), либо мириться с self-signed и предупреждениями браузера.
Нюансы и ограничения
Кому пригодится
Хоумлабы, NAS, IoT-девайсы, камеры — всё, что торчит наружу по IP без домена. Тестовые и staging-окружения, эфемерные облачные сервисы. Для продакшена с нормальным доменом смысла мало — 90-дневные сертификаты удобнее.
@prog_tools
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥7
Самые просматриваемые доклады по React, Next.js, Vue, Nuxt и Vite в 2025 году
Когда вы пересмотрите все новогодние фильмы, советуем обратить внимание на доклады по фронтенду и фулстеку, которые стали самыми просматриваемыми в 2025 году. Вы найдёте их по ссылке.
Версия короткого must-watch списка для ленивых:
🔘 Modern React Patterns: Concurrent Rendering, Actions & What’s Next
🔘 React Query Exposed by Its Maintainer
🔘 TanStack is Your New Favorite Framework
🔘 Hands On: How To Migrate To Next.js 16 and “Use Cache”
🔘 Vite Beyond a Build Tool
Когда вы пересмотрите все новогодние фильмы, советуем обратить внимание на доклады по фронтенду и фулстеку, которые стали самыми просматриваемыми в 2025 году. Вы найдёте их по ссылке.
Версия короткого must-watch списка для ленивых:
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥2
Полезная библиотека для понимания работы JS
js2flowchart — библиотека визуализации для преобразования любого кода JavaScript в красивую блок-схему SVG. Вы можете изучать чужой код, делать рефакторинг или писать документацию, не путаясь в функциональности. А начинающим — неплохая шпаргалка по foo, while, if:
https://github.com/Bogdan-Lyashenko/js-code-to-svg-flowchart
@tproger_web #javascript #инструменты
js2flowchart — библиотека визуализации для преобразования любого кода JavaScript в красивую блок-схему SVG. Вы можете изучать чужой код, делать рефакторинг или писать документацию, не путаясь в функциональности. А начинающим — неплохая шпаргалка по foo, while, if:
https://github.com/Bogdan-Lyashenko/js-code-to-svg-flowchart
@tproger_web #javascript #инструменты
🤔5👍4
This media is not supported in your browser
VIEW IN TELEGRAM
Новогодний генератор снежинок на JS
Ключевой его особенностью является то, что все снежинки генерируются рандомно благодаря особому алгоритму. Это может оказаться удобно, если вам нужно добавить на сайт, например, эффект падающих снежинок.
Посмотреть принцип работы кода можно на странице проекта.
#codepen #javascript
Ключевой его особенностью является то, что все снежинки генерируются рандомно благодаря особому алгоритму. Это может оказаться удобно, если вам нужно добавить на сайт, например, эффект падающих снежинок.
Посмотреть принцип работы кода можно на странице проекта.
#codepen #javascript
👍5🔥2
Ваша MIDI-клавиатура и вибромоторчик телефона уже могут управлять веб-сайтом. Вы знали?
LogRocket сделали шпаргалку про 5 API браузера, которые, возможно, вам никогда не пригодятся, но они существуют:
🔘 Vibration API;
🔘 WebHID;
🔘 WebMIDI;
🔘 Web Speech;
🔘 Battery Status.
Подробнее: https://blog.logrocket.com/5-weird-web-apis/
#api
LogRocket сделали шпаргалку про 5 API браузера, которые, возможно, вам никогда не пригодятся, но они существуют:
Подробнее: https://blog.logrocket.com/5-weird-web-apis/
#api
Please open Telegram to view this post
VIEW IN TELEGRAM
👍3🔥1
Forwarded from Инструменты программиста
The-One-File — сетевые диаграммы в одном HTML-файле. Открывается в любом браузере, работает полностью офлайн. Подходит для air-gapped окружений, документации, мониторинга статуса — от корпоративных сетей до домашних лабов.
Фичи
🔘 Ортогональная маршрутизация линий
🔘 Анимация потоков данных
🔘 Камерные конусы (для визуализации видеонаблюдения)
🔘 Кастомные иконки
🔘 Live status monitoring
🔘 Стены, темы, настройки отображения
🔘 Экспорт диаграммы — сохраняется прямо в тот же HTML
Зачем
Для документации сетей, которую можно открыть где угодно без интернета и зависимостей. Один файл — вся диаграмма внутри. Удобно для передачи коллегам, хранения в git, работы в изолированных средах.
📎 Проект на GitHub, 33 релиза, последний буквально на днях, так что проект живой. На видео демо
@prog_tools
Фичи
Зачем
Для документации сетей, которую можно открыть где угодно без интернета и зависимостей. Один файл — вся диаграмма внутри. Удобно для передачи коллегам, хранения в git, работы в изолированных средах.
@prog_tools
This media is not supported in your browser
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥2
Создаем React с нуля
В этом гайде содержится инструкция по созданию аналога React с нуля. Вряд ли вы станете использовать его в реальных проектах, но зато узнаете, как устроены основные функции и возможности библиотеки. Помимо гайда внутри вы найдёте ссылку на GitHub с готовым кодом.
Подробности: https://www.rob.directory/blog/react-from-scratch
#react #туториал
В этом гайде содержится инструкция по созданию аналога React с нуля. Вряд ли вы станете использовать его в реальных проектах, но зато узнаете, как устроены основные функции и возможности библиотеки. Помимо гайда внутри вы найдёте ссылку на GitHub с готовым кодом.
Подробности: https://www.rob.directory/blog/react-from-scratch
#react #туториал
🔥4😁2
Всем общий сбор!
Программисты из Tproger подготовили для вас (и нас) сюрприз. Это новогоднее бинго в стиле сайтов нулевых. Заканчивайте работу, пора позалипать на этот шедевр и найти все пасхалки.
Ну и делитесь в комментариях какое бинго получилось у вас и что удалось закрыть.
Программисты из Tproger подготовили для вас (и нас) сюрприз. Это новогоднее бинго в стиле сайтов нулевых. Заканчивайте работу, пора позалипать на этот шедевр и найти все пасхалки.
Ну и делитесь в комментариях какое бинго получилось у вас и что удалось закрыть.
Tproger
НОВОГОДНЕЕ БИНГО v2000
Заполни всё поле и узнай свою судьбу в новом году!
❤3
Новогодняя игра «Помощник Санты»
Игра — лучший способ потренировать HTML, CSS и JavaScript. Тем более, игра новогодняя, а у проекта полностью открытые исходники.
Сохраните, чтобы не потерять. Будет чем заняться на праздниках: https://codepen.io/housamz/pen/KKgmMLm
#codepen #gamedev
Игра — лучший способ потренировать HTML, CSS и JavaScript. Тем более, игра новогодняя, а у проекта полностью открытые исходники.
Сохраните, чтобы не потерять. Будет чем заняться на праздниках: https://codepen.io/housamz/pen/KKgmMLm
#codepen #gamedev
🔥4❤1