Обновить
448.7

Веб-разработка *

Делаем веб лучше

Сначала показывать
Порог рейтинга
Уровень сложности

Как я заработал 500 000 рублей, сделав доступ к ChatGPT. А потом Яндекс убил SEO и всё (почти) закончилось

Уровень сложностиПростой
Время на прочтение7 мин
Охват и читатели98K

Статья о том, как я почти проспал "бум" ChatGPT, но сделал к нему доступ и заработал на этом (и продолжаю зарабатывать). Сам проект сейчас идёт на спад, но об этом в конце.

Читать далее

Глубокий JS. В память о типах и данных

Уровень сложностиСложный
Время на прочтение10 мин
Охват и читатели38K

Всех нас учили, что в JavaScript есть примитивные и ссылочные типы данных. Исчерпывающая информация есть в официальной документации, а на просторах интернета полно статей на этот счет.

Теория теорией, однако, JS-код исполняется не в теории, а на практике. Точнее, его компилирует и исполняет движок JS. Таких движков существует несколько, разрабатывались они разными людьми и для разных целей. Было бы наивно предполагать, что все они полностью идентичны друг другу. А значит, время разобраться, как же на самом деле хранятся вполне конкретные данные на вполне конкретном движке JS V8.

Читать далее

Улучшаем возможности Nginx без затрат на коммерческую подписку (спойлер: с помощью Haproxy)

Уровень сложностиСредний
Время на прочтение16 мин
Охват и читатели28K

Nginx — прекрасный и надёжный обратный прокси-сервер. Уже много лет он является самым популярным инструментом обслуживания огромного количества веб-сайтов. Но его бесплатная версия имеет ряд ограничений в части работы с серверами-бэкендами. Давайте поговорим об этих ограничениях и о том, можем ли мы, не меняя Nginx как основную платформу, качественно улучшить наши возможности по распределению трафика между бэкендами.

Читать далее

Пример применения генератора в Битрикс: как не ронять сервер на больших выгрузках

Уровень сложностиСредний
Время на прочтение5 мин
Охват и читатели4.4K

Бытует мнение, что Битрикс прожорлив, и способен поглотить все ресурсы, которые есть на сервере. Убедимся, что это действительно так, и во всем виноват GeList.

А потом попробуем разобраться, что с этим делать.

Посмотреть, вдруг пригодится

Сокровища HTML: 7 тегов, которые упростят вам жизнь

Уровень сложностиПростой
Время на прочтение7 мин
Охват и читатели27K

Все мы знакомы с широко используемыми HTML тегами, такими как <div>, <p>, <a>, и <img>. Однако, существуют HTML - теги, которые могут упростить жизнь, и вместо написания дополнительного кода, выполнят всю работу :)

Читать далее

React + Three.js. Создаём собственный 3D шутер. Часть 2

Уровень сложностиСредний
Время на прочтение6 мин
Охват и читатели10K

Привет, дорогие пользователи мира IT!

В эпоху активного развития веб-технологий и интерактивных приложений, 3D-графика становится всё более актуальной и востребованной. Но как создать 3D-приложение, не теряя преимуществ веб-разработки? В этой статье мы рассмотрим, как сочетать мощь Three.js с гибкостью React, чтобы создать собственную игру прямо в браузере.

В статье вы познакомитесь с библиотекой React Three Fiber и научитесь создавать интерактивные 3D-игры.

Читать дальше →

Трудности перевода: как научиться понимать то, что нарисовал дизайнер

Время на прочтение6 мин
Охват и читатели5.5K

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

Если у вас только один фронтенд, все еще не так плохо. Однако, когда их количество достигает 10, микроошибки в компонентах могут отнимать до 200-300 человеко-часов в год. С учетом современных зарплат, это значительная сумма. А помимо фронтенда у нас также есть бекенд, девопс и тестирование, что также требует значительных затрат. Давайте вместе разберемся, как можно справиться с этой проблемой.

Читать далее

Добавление WebAuthn в веб-приложение

Уровень сложностиСредний
Время на прочтение4 мин
Охват и читатели15K

Привет! В этой статье мы научимся добавлять WebAuthn в веб‑приложения со стороны frontend‑разработчика. WebAuthn представляет собой новый метод аутентификации, который обеспечивает более высокий уровень безопасности, заменяя устаревшие пароли и SMS‑подтверждения на аутентификацию на основе публичных ключей.

Читать далее

Географические ограничения на Хабре

Время на прочтение8 мин
Охват и читатели27K

Несколько лет назад мы рассказали про то, как Хабр обрабатывает официальные обращения, а также анонсировали наш раздел Transparency report, в котором мы своевременно публикуем информацию об обращениях. Что ж, с тех пор кое‑что поменялось и настало время для новой публикации с небольшим апдейтом.

Читать далее

Исследование режима Copy-on-Write в pandas. Часть 3

Уровень сложностиСредний
Время на прочтение5 мин
Охват и читатели2.7K

Появление в библиотеке pandas режима Copy‑on‑Write (CoW, копирование при записи) — это изменение, нарушающее обратную совместимость, которое окажет некоторое воздействие на существующий код, использующий pandas. Мы разберёмся с тем, как адаптировать код к новым реалиям, сделать так, чтобы он работал бы без ошибок тогда, когда режим CoW будет включён по умолчанию. Сейчас сделать это планируется в версии pandas 3.0, выход которой ожидается в апреле 2024 года. В первом материале из этой серии мы разбирались с особенностями поведения CoW, во втором — говорили об оптимизации производительности, имеющей отношение к новому режиму работы pandas.

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

Читать далее

Обзор фреймворка для сбора данных OWASP Nettacker

Время на прочтение4 мин
Охват и читатели2.8K

OWASP Nettacker — это автоматизированная платформа (фреймворк) для автоматического тестирования на проникновение, сканирования уязвимостей, сбора информации и создания отчетов, включая найденные уязвимости, информацию об используемых компонентов и другие сведения. 

Nettacker использует такие протоколы, как TCP SYN, ACK и ICMP, для обхода устройств Firewall, DS, IPS. И разработан некоммерческой организацией OWASP, которая специализируется на обеспечении безопасности веб-приложений. В статье рассказываем об установке фреймворка и его основных функциях.

Читать далее

PHP и Laravel дайджест новостей за октябрь 2023 года

Время на прочтение3 мин
Охват и читатели6K

Всем привет! Краткий обзор новостей из мира PHP и Laravel за октябрь 2023 года  от Сергея Пантелеева и Данила Щуцкого.

Читать далее

Webpack vs esbuild — уже можно использовать в production?

Уровень сложностиСредний
Время на прочтение12 мин
Охват и читатели22K

Периодически я пробую разные инструменты, и если они стабильно покрывают все необходимые сценарии - включаю в свою экосистему для коммерческих проектов. С третьего подхода за последние 3 года esbuild, наконец, приблизился по функционалу к Webpack. В статье привожу проблемы, с которыми я столкнулся при миграции, и пути их решения.

Читать далее

Ближайшие события

Запуск альфа-теста Капибара(Новый Старый Пикабу)

Время на прочтение9 мин
Охват и читатели10K

Продолжу рассказывать о развитии Капибары, опенсорсном проекте, цели которого воспроизвести лучшее что было на пикабу и не наступить на их же "грабли". Первая часть здесь: https://habr.com/ru/articles/759598/. Первый официальный пост о прогрессе в разработке на новом сайте здесь: https://www.kapi.bar/post/dnevnik-razrabotki-kapibary-ot-10-xi-2023. Но обо всем по порядку.

Пару недель назад у нас стартанул полу-закрытый альфа-тест. Сейчас выдаём ранний доступ на сайт kapi.bar отважным авторам-альфатестировщикам и активным комментаторам взамен просим слать нам багрепорты и пока быть самим себе модераторами. Функционал для создания постов, комментариев и выставления оценок для них есть. Ленты "Новое", "Тренды", "Топ", "Обсуждаемое" и поиск по тегам уже работают и доступны для чтения всем желающим.

Читать далее

Как наложить макет на вёрстку через PerfectPixel

Уровень сложностиСредний
Время на прочтение2 мин
Охват и читатели22K

Привет! Меня зовут Сергей Криворучко, я работаю наставником на курсе «Фронтенд-разработчик» в Практикуме. Иногда у студентов возникают сложности с PerfectPixel — расширением Chrome, совмещающим макет из Figma с вёрсткой в браузере.

В этом материале я расскажу, как корректно экспортировать макет, установить PerfectPixel, управлять расширением и находить элементы страницы, которые стоит поправить на вёрстке. Для примера взял макет, с которым работают студенты на курсе.

Читать далее

Встречаем Angular 17

Уровень сложностиПростой
Время на прочтение17 мин
Охват и читатели32K

В прошлом месяце исполнилось 13 лет с момента появления "красного щита" Angular. AngularJS стал отправной точкой для новой волны JavaScript-фреймворков, появившихся для поддержки растущей потребности в богатом веб-опыте. Сегодня с новым внешним видом и набором перспективных функций мы ведем всех в будущее с версией 17, устанавливая новые стандарты производительности и удобства для разработчиков.

Читать далее

Архитектура веб-приложений, Gitflow и REST API: доклады с Backend-митапа red_mad_robot

Уровень сложностиСредний
Время на прочтение2 мин
Охват и читатели4.9K

В конце октября мы провели в нашем московском Робохранилище Backend-митап, где собрали больше 60 офлайн-зрителей. Ребята из нашей практики выступили с тремя докладами — и не в нашем стиле скрывать такой полезный контент. Поэтому ловите презентации и видео их выступлений. 

Читать далее

Исследование режима Copy-on-Write в pandas. Часть 2

Уровень сложностиСредний
Время на прочтение6 мин
Охват и читатели3K

В первом материале из этой серии была объяснена работа механизма Copy‑on‑Write (CoW, копирование при записи). Там были упомянуты некоторые ситуации, в которых при выполнении кода осуществляется копирование данных. В этой статье речь пойдёт об оптимизации, направленной на то, чтобы копирование не ухудшило бы средних показателей скорости работы кода.

Мы используем подход, применяемый внутри pandas для того, чтобы избежать копирования всего объекта DataFrame в тех случаях, когда это не нужно. Этот подход позволяет повысить производительность системы.

Читать далее

Использование Content-Security-Policy вместе с React & Emotion

Уровень сложностиСредний
Время на прочтение3 мин
Охват и читатели4.3K

Content-Security-Policy (CSP) - это HTTP заголовок, который улучшает безопасность веб-приложений за счет запрета небезопасных действий, таких как загрузка и отправка данных на произвольные домены, использование eval, inline-скриптов и т.д. В этой статье будет сделан фокус на директиве style-src и ее использование вместе с CSS-in-JS библиотекой emotion.

Читать далее

Почему я не буду использовать Next.js

Уровень сложностиСредний
Время на прочтение13 мин
Охват и читатели34K

Представьте, что вы планируете начать новый проект или использовать в существующем более современный подход. А, может, вас просто не устраивает используемый фреймворк, и вы подумываете об альтернативах. В любом случае вам нужно что-то выбрать.

Существует множество «современных» фреймворков. И даже если сейчас перед вами этот выбор не стоит, вы можете задуматься, освоением какого лучше заняться, чтобы повысить свои профессиональные качества и продуктивность в будущем.

С момента выхода Remix в 2020 году я использовал именно этот фреймворк. Мне он настолько понравился, что на следующий год я устроился в эту компанию, чтобы помочь с развитием сообщества, а через 10 месяцев ушёл работать в EpicWeb.dev, где теперь обучаю людей всему необходимому для создания фулстек-приложений. И Remix играет в этом значительную роль, являясь веб-фреймворком, который аналогично Next.js нацелен на решение задач, связанных с созданием веб-приложений.

Поскольку Next.js аналогичен Remix, многие спрашивают, почему для преподавания фулстек-разработки в EpicWeb.dev я предпочёл именно Remix. И текущая статья станет ответом на этот их вопрос.
Читать дальше →

Вклад авторов