Как стать автором
Обновить
249.72

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

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

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

Тестирование упрощенного Личного кабинета банка (Postman, dBeaver, MySQL, DevTools)

Уровень сложностиПростой
Время на прочтение11 мин
Количество просмотров1K

Всем привет! Сегодня хочу рассказать, как можно протестировать Личный кабинет банка с помощью Postman, на примере простого Веб-приложения. Будет проверено: создание пользователя, авторизация, отображение продуктов клиента в Личном кабинете, подача заявки на потребительский кредит и отображение результатов ее рассмотрения в ЛК. Приступим

Было разработано небольшое Веб-приложение на Node.js. После запуска приложения и открытия его на локальной машине по адресу - http://localhost:5000/, на странице отображается форма входа в Личный кабинет.

Читать далее

Новости

Прощай, reCAPTCHA! Как я защитил формы входа с помощью бесплатной и невидимой CAPTCHA от Cloudflare

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

Привет, Хабр! На связи разработчик Peakline — аналитической платформы для Strava. Сегодня я хочу поделиться опытом внедрения Cloudflare Turnstile в веб-приложение на FastAPI.

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

Читать далее

Как мы подняли современный портал документации из россыпи .md файлов: пошаговое руководство по MkDocs + Material

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

От хаоса в Markdown-файлах до стильного, быстрого сайта с поиском, темами и мультиязычностью за один вечер.
В жизни почти каждого IT-проекта наступает момент, когда количество файлов README.md, GUIDE.md, docs.txt и заметок в Confluence достигает критической массы. Документация становится фрагментированной, поиск нужной информации превращается в квест, а новые члены команды тратят часы на то, чтобы просто понять, "что где лежит".

Читать далее

Оживляем данные Strava: от парсинга GPX до интерактивной карты на Python и JS

Уровень сложностиПростой
Время на прочтение8 мин
Количество просмотров1.7K

Привет, Хабр! Меня зовут Александр, я разработчик и, как многие в IT, стараюсь уравновешивать сидячую работу спортом — в моем случае, это велосипед и бег. И, как многие спортсмены-любители, я пользуюсь Strava.

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

Читать далее

PHP и Laravel дайджест новостей за июнь 2025 года

Время на прочтение8 мин
Количество просмотров2.2K

Привет, Хабр!

Сергей Пантелеев и Данил Щуцкий собрали ключевые новости PHP и Laravel за июнь. Будьте в тренде — читайте обзор! 🚀

Читать далее

Скриншот-тестирование фронтенда: руководство по применению в 2025 году

Уровень сложностиСредний
Время на прочтение9 мин
Количество просмотров2.1K

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

Часто приходилось видеть тесты опосредовано проверяющие визуальное отображение html-элемента, что-то в стиле expect(elem.classList.contains("visible")).toBe(true). Говорить о надежности таких тестов конечно-же не приходится, так как изменив содержимое css-селектора стилизующий данный класс, данный тест все еще будет зелёным, несмотря на то что по факту элемент будет скрыт.

Результат от подобных тестов вполне ожидаемый. Обновили версию UI-библиотеки и на всем проекте поехала верстка? Тесты зелёные. Случайно переопределили CSS-переменную и теперь вместо приятной тщательно подобранной дизайнером гаммы цветов вы видите лишь кислотно-вырвиглазную солянку? “Бывает, надо было ручками протестировать” - скажет менеджер.

Решить данную проблему нам поможет добавление скриншот-тестирования на проект.

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

Читать далее

Законы простоты

Время на прочтение8 мин
Количество просмотров1.4K

В книге «Законы простоты » Джон Маэда (из MIT) предлагает десять законов для баланса простоты и сложности в бизнесе, технологиях и дизайне — руководящие принципы для того, чтобы нуждаться в меньшем и на самом деле получать больше.

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

Читать далее

gRPC, HTTP, Websocket — и все это один сервер

Уровень сложностиПростой
Время на прочтение15 мин
Количество просмотров6.1K

Однажды передо мной встала довольно интересная задача: обеспечить взаимодействие стороннего веб-приложения - и набора сервисов, имеющих gRPC интерфейс.
Нужно было проводить обработку данных от веб-приложения через конвейеры AI-агентов, собирать конечный результат, и отдавать его приложению. А также, что немаловажно, обеспечить наглядность мониторинга и управления всем хозяйством.
Мне потребовалось разработать собственный сервер на PHP, в котором поддержать три типа интерфейсов. Во-первых, RestAPI для веб-приложения. Во-вторых, gRPC-сервис для взаимодействия с AI-агентами. В-третьих, HTTP + Websocket для интерактивного мониторинга и управления.
Для этого пришлось создать новый продукт - который, возможно, кажется полезен и вам.

Читать далее

БЭМ + Tailwind: прагматичный гибрид для современного фронтенда

Уровень сложностиПростой
Время на прочтение8 мин
Количество просмотров1.7K

Устали от бесконечных споров о CSS-методологиях? В этой статье я рассказываю, как объединил БЭМ и Tailwind в мощный гибридный подход, который спас мой проект и нервную систему. Узнайте, как избавиться от мучительного нейминга, решить проблему с отступами и ускорить разработку в два раза.

Никакого догматизма — только практический опыт и реальные примеры использования лучших сторон обоих подходов.

Чекнуть габеллу.

Как я встраивал wysiwyg редактор в свой django проект

Уровень сложностиПростой
Время на прочтение3 мин
Количество просмотров1.2K

Разрабатывая сервис генерации AI курсов, я столкнулся с тем, что мне захотелось решить вопрос с удобным редактированием уроков.

В моем сервисе есть два режима создания курсов - AI режим, это когда ты пишешь промпт или прикладываешь список тем, а нейросеть генерирует контент. Это подходит для самообучения. А второй режим для авторов - ты можешь взять свои наработки, скормить их вместе с промптом модели, а та выдаст результат. Так вот чтобы поделиться с другими юзерами таким курсом, хотелось бы иметь возможность отредактировать ответ модели, дополнить самому, да еще и оформить это все красиво, с заголовками, отступами, списками и прочими украшательствами.

Почитав разные статьи про то, какие есть редакторы, я остановился на TinyMCE.

Читать далее

РКН против использования Google Analytics, но если Вашему бизнесу очень нужно, есть легальный вариант

Уровень сложностиПростой
Время на прочтение2 мин
Количество просмотров7.2K

Бизнес – такая штука, где все нужно считать. Я не только о расходах, выручке и чистой прибыли: это классика. Если у вашей компании есть сайт, то с большой долей вероятности вам искренне любопытно знать, сколько посетителей на него заходит, что их привлекает больше всего, что их совсем не интересует и т.д.

И это стремление мне абсолютно понятно: смысл оплачивать содержание площадки, которая никак не помогает вашему делу развиваться?

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

Узнать,как легально использовать Analytics

ВкусВилл и фабрика A/B-тестов: как развивать сайт на основе бесконечных гипотез

Уровень сложностиСредний
Время на прочтение7 мин
Количество просмотров833

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

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

Читать далее

Проектирование Sequence-диаграмм: руководство для системных аналитиков

Уровень сложностиСредний
Время на прочтение14 мин
Количество просмотров3.5K

Привет, коллеги! Меня зовут Юля, я системный аналитик в компании EvApps.

Сегодня поговорим о sequence-диаграммах (диаграммы последовательности) – одном из способов моделирования взаимодействий между объектами в системе. В этой статье мы рассмотрим преимущества использования sequence-диаграмм, типичные ошибки при их создании, а также пример их проектирования. Ключевая идея – показать мыслительный процесс, а не просто шаблонное описание. Статья будет полезна прежде всего системным аналитикам, а также тем, кто участвует в проектировании и разработке программного обеспечения.

Читать далее

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

CryptoProBuilder — fluent-интерфейс для КриптоПро на PHP: подпись, шифрование и работа с контейнерами

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

КриптоПро предоставляет мощные, но неудобные для автоматизации утилиты. CryptoProBuilder — это fluent-интерфейс на PHP, который упрощает подписание, шифрование и работу с сертификатами, без необходимости использовать сложный SDK.

Читать далее

Подмена входящего трафика: скрытые, но крайне полезные фичи браузера Chrome

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

Всем доброго дня! Я Святослав Ященко, работаю в СберТехе, лидирую команду QA Platform V Kintsugi — это графическая консоль для сопровождения PostgreSQL и Postgres-like СУБД. Развивается вместе с СУБД Pangolin — целевой в Сбере и не только.

У нашего продукта микросервисная архитектура и Web UI. Часто при тестировании фронтенда я имею дело с ещё не дописанной функциональностью API, или же с ситуациями, когда в контракте API есть расхождения с ожиданиями фронтенда.

Хорошо, когда можно заносить моки в окружение или использовать снифферы с возможностью подмены трафика. Но, по разным причинам, не всегда бывает такая возможность. Что остаётся? Ждать, пока разработчик приведёт API в порядок? Но ведь фронтенд-часть готова уже сейчас и ждёт своего тестировщика...

Решение нашлось под рукой — в моём браузере Chrome. Если вы пользуетесь Chrome, то, вероятно, открываете DevTools. Чаще всего нам хватает вкладок Elements, Console, Network и Application. Но так ли прост DevTools? С этой статьи я начинаю цикл коротких руководств, посвящённых скрытым, но крайне полезным фичам Chrome. И начну с подмены входящего трафика.

Прошу под кат.

Читать далее

Да, этот HTML и CSS старый, но всё ещё полезный

Время на прочтение6 мин
Количество просмотров9.3K

Привет, Хабр!

Следя за развитием HTML и CSS, очень сложно запомнить всё. Я заметил это, ведя свой канал и общаясь с коллегами. Многие люди не знают про возможности HTML и CSS, которые были внедрены в браузеры 6 лет назад или раньше.

Только их возраст не является недостатком. Они всё ещё полезны в современной разработке. По этой причине я собрал их в небольшой список и на основе его написал эту статью. Надеюсь, найдёте для себя что-то полезное.

Давайте посмотрим, что я подготовил.

Читать далее

Фишки Cursor — как сделать работу с ним дешевле и эффективнее?

Уровень сложностиПростой
Время на прочтение3 мин
Количество просмотров13K

Многие используют Cursor, не зная, на что он на самом деле способен. Будем идти от простого к сложному.

1. Самое простое, что позволит улучшить работы с Cursor — это использовать Cursor Rules

Что это даёт?

- Cursor лучше кодит, делает это по вашим правилам.
- Можно настраивать разные правила для разных файлов/директорий.
По сути это дополнение к системному промпту, где вы делаете тонкую настройку один раз.

Документация здесь.
А тут отличные заготовки для правил

2. Включайте сразу несколько ИИ-агентов

В Cursor можно открыть 3 вкладки, где параллельно будут работать 3 ИИ-агента (это максимум). Единственное что - контролируйте, чтобы они они не использовали дни и те же файлы — могут перезаписать или удалить результаты работы другого агента, так что им нужно давать изолированные задачи.

Дополнительно можно ещё использовать фонового агента, который работает на серверах Cursor, и будет выполнять задание на основании вашего кода в репозитории. А потом все его результаты можно отправить в репозиторий или локально, однако он работает за дополнительную плату (Price-based)

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

3. Кладите связанные репозитории в 1 папку и открывайте её в Cursor

Допустим, у вас есть бэкенд, фронтенд и ещё микросервис для управления подписками. Если вы поместите их в 1 папку и откроете её в Cursor, то он сможет ходить между ними и делать согласованный код. Допустим, он может сразу сделать контроллеры на бэкенде и api для них на фронтенде.

Читать далее

Как «модное» убило релиз

Уровень сложностиПростой
Время на прочтение2 мин
Количество просмотров2.2K

Или почему shiny tech stack ≠ рабочий продукт. Каждую неделю выходят новые «киллеры» фреймворков, базы данных, фреймворки на фреймворки, UI-библиотеки, подходы к state management, архитектурные паттерны и всё прочее.

Читать далее

Как создать свой Perplexity: Архитектура AI для глубокого исследования на Next.js и OpenAI

Время на прочтение24 мин
Количество просмотров2.6K

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

К концу статьи у вас будет четкое понимание того, как построить self-hosted SaaS для глубокого исследования, который можно встроить в любой продукт.

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

Читать далее

Storybook в IDE: конец эпохи копипаста

Уровень сложностиПростой
Время на прочтение3 мин
Количество просмотров8.4K

Если вы занимаетесь фронтенд-разработкой, то наверняка работали со Storybook — удобной витриной компонентов, на которой красиво лежат компоненты и примеры их использования. Его любят за интерактивную документацию, возможность визуального контроля и изолированной разработки. Но замечали ли вы, сколько действий приходится делать, чтобы взять компонент из Storybook и вставить его в реальный проект? 

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

Storybook Studio: всё в одном месте...

Читать далее
1
23 ...

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