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

Привет, Хабр! В этой статье мы разберемся, кто такой специалист по безопасной разработке, какие требования к нему предъявляют работодатели, сколько специалисты этой профессии сегодня зарабатывают и куда можно пойти учиться на AppSec-специалиста.

Давайте знакомиться! Меня зовут Света Газизова, и я работаю в Positive Technologies директором по построению процессов DevSecOps. Мы с командой помогаем выстраивать процессы безопасной разработки в компаниях наших клиентов, занимаемся GR, участвуем в исследованиях и развиваем направление application security со всех его сторон. Помимо такой «обычной» работы, я еще участвую в образовательных проектах, потому что верю, что знания спасут мир 😊 И сегодня я расскажу, как мы с коллегами из Positive Education запускаем новый образовательный курс по безопасности приложений на базе МФТИ.

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

Рассказываю, какие ошибки при работе с API допускают не только новички, но и профессионалы, и как сделать, чтобы эти ошибки возникали как можно реже или не появлялись вовсе.

В этом руководстве мы рассмотрим разработку веб-приложения по созданию GIF-файлов из видеороликов.

Функциональные возможности приложения:
- Создание GIF из видео на YouTube с определённым временным диапазоном.
- Предварительный просмотр результата перед выполнением фактической конвертации.

Компоненты системы:
- Клиентская часть на React (Next.js)
- Бэкенд-сервер на Node
- Node как Service Worker
- В качестве брокера сообщений — RabbitMQ
- Для хранения данных — MongoDB
- Для хранения медиафайлов — Google Cloud Storage

Полный код проекта можно найти на github, а по этой ссылке посмотреть демо-версию приложения.

Когда дело доходит до выбора серверного веб-фреймворка в экосистеме Rust, можно запутаться из-за большого количества вариантов. В прошлом, лидером по популярности был Rocket, но сейчас за первенство сражаются Axum и actix-web, и Axum все больше набирает обороты. В этой статье мы немного погрузимся в Axum — веб-фреймворк для создания REST API на Rust, разрабатываемый командой Tokio. Он прост в использовании и хорошо совместим с Tower — надежной библиотекой для создания модульных компонентов сетевых приложений.

В этой статье мы подробно рассмотрим, как использовать Axum для создания веб-сервиса. Кроме того, мы рассмотрим изменения, которые произошли в версии 0.7.

Для интернационализации сделаны десятки по-своему потрясающих библиотек, такие как i18n, react-intl, next-intl. Все они отлично справляются со своей задачей - добавляют переводы в приложение или на сайт. Большинство из них проверены, отлажены и стабильно поддерживаются.

Но все они устарели.

Ведь всё это время развивалось и экосистема реакта. Так, последняя версия next.js включила крупные обновления из react.js - cache, taint, новые хуки и, конечно же, серверные компоненты. Команда самого React.js, вероятно, представит эти изменения уже в мае.

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

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

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

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

Данное приложение было создано для красивого и удобного показа изменений во Vue 3 проекте в его документации на VitePress. После оно было сделано универсальным, и может быть подключено в любой HTML странице как Web component или микрофронтенд.

Попробовать - https://vuesence.github.io/release-timeline/. Слева вверху можно указать любой публичный репозиторий.

С развитием веба сайты превратились в сложные приложения, которыми ежедневно пользуются десятки и сотни миллионов людей: почта, облачные хранилища, соцсети, маркетплейсы, стриминговые платформы и т. д. И каждое из них должно работать корректно. Как это сделать? Конечно писать хороший код, а потом и тестировать его. Хотя кто‑то обходится без тестов, тем не менее тестирование — важная часть инженерных практик наравне с мониторингом. Оно помогает нам заблаговременно находить и исправлять баги (или незапланированные фичи) в приложениях. Основная цель тестирования — получить гарантию корректной работы любого ПО .

При этом тестировать современный фронтенд сложно: неуправляемая асинхронность (событийная модель браузера), различие браузеров, тяжелое окружение — это лишь малая часть сложностей. Можно ли все возложить на ручных тестировщиков или исправлять баги после жалоб пользователей? Однозначно нет. В большинстве случаев такой подход в скором времени приведет к оттоку пользователей: не все пишут о багах, просто уходят к конкурентам. Безусловно, ручное тестирование остается важным элементом разработки, но тестировщики не могут держать сотни или тысячи сценариев, которые нужно пройти перед релизом или запуском новой фичи. Так где нам получить гарантии, что ключевые сценарии приложения работают корректно? Автоматическое тестирование.

Всем привет! Меня зовут Миша, работаю фронтэнд‑разработчиком в VK в команде Облака Mail.ru, и я хочу разобрать различные виды тестов, дать их сравнительный анализ и применимость. Сразу скажу, тут не будет практики написания тестов. Потому что это нереально сделать внутри одной статьи, необходимо разобрать: теорию тестирования, классов эквивалентности, различие подходов/методов к тестированию, комбинаторику состояний, правильное использование моков и стабов, понимание чистых функций, знание архитектуры приложения. Поэтому предлагаю сконцентрироваться на видах тестирования и начать с «идеального теста».

Всем привет, на связи Максим Рожков, frontend разработчик команды "ПИН-КОД".
Наша студенческая команда смогла поучаствовать в выставке с демонстрационным вариантом нашего сервиса "Изучение русского жестового языка".

В этой статье вы узнаете, как обычные студенты поучаствовали в масштабной IT выставке в Екатеринбурге.

Это моя первая статься, а потому, как мне кажется, будет хорошим шагом начать с того, кто я такой. Меня зовут Юрий, я учусь на программиста и попутно сам стараюсь изучать всё возможное про мою специальность, а моя специальность - это .Net. Влюбился в него и вцепился с первого взгляда, прям как к php слова "скоро умрёт".Несколько месяцев назад, а именно в сентябре, я решил, что необходимо начать делать какой-нибудь большой учебный проект для закрепления моих знаний да и для изучения новых. Я вообще отношу себя к практикам, обожаю сначала что-то делать, а только потом читать. А вдруг я и сразу всё хорошо сделаю, и потом даже читать дополнительные источники не придется :). Но это почти никогда не бывает, так что не пишите в комментариях, что я упускаю важный момент в изучении. Если возвращаясь к проекту, то сделать его я хотел, но я считал себя истинным бэкендером: притрагиваться к фронденту я вообще не слишком хотел. А потому я решил обратиться к своим друзьям программистам, чтоб хоть кто-то занялся фрондент частью. К счастью такой человек у меня был: React разработчик. И также ещё один бэкендер на C#. Идея командой разработки им понравилось, я взял проект из своего списка проектов (да, у меня такой есть) и начали разработку.

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

Теперь о самом проекте, мы дали ему названия Author Verse. Его фишка в том, что пользователи могли бы создавать свои книги, вставляю в него любой контент, то есть, что из него обычной книги можно было бы сделать легко обычную книгу из текста, комикс из картинок, мангу, аудиокнигу, манга-аудиокнига-комикс сразу??? или придумать вовсе свой жанр. И главная фишка: писатели могли бы делать разветвление сюжета на любую часть главы, на любую другую часть из других глав своей книги и, наверное самое прикольно, но которое пришло мне в голову уже на последних этапах разработки, это ответвлению в другие книги. Конечно, раз мы говорим о том, что могут быть ссылки на другие книги, то все книги на сайте должны быть бесплатны.

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

Всем привет! Одна из моих рутинных задач - это подъем новых проектов и микросервисов в облаках. Для этого практически всегда нужны домены и поддомены с наличием SSL сертификата. У меня выработался подход, с помощью которого я автоматизировал процесс выдачи сертификатов с помощью certbot. О чём и хочу рассказать.

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

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

WAAP (Web Application and API Protection) является брандмауэром веб-приложений следующего поколения WAF (Web Application Firewall). Термин впервые начал использовать Gartner для описания защиты современных, постоянно меняющихся web-сервисов. Так как в мире CI/CD, динамики и API first компаний, функций традиционного WAF (Web Application Firewall) уже недостаточно.

WAAP - это совокупность методов и технологий, которые используются для защиты веб-приложений и сервисов от атак и уязвимостей. WAAP включает в себя технологии, такие как WAF-NG, сканер уязвимостей, автоматическое обнаружение и блокирование атак 0-дня (в том числе с помощью виртуального патчинга), выявление аномалий с помощью технологий Machine Learning и смарт-капчи.

VueUse - популярная библиотека, состоящая из небольших утилит и в среде Vue разработчиков, идущая как "must have" наряду с Pinia. Нисколько не умаляя вклад Anthony Fu в экосистему Vue, опишу, почему я не использую её и не рекомендую для серьезных проектов и опытных разработчиков.

Однажды мы решили переработать уже существующий адаптив интернет-банка для юр. лиц, а точнее превратить его в веб-приложение (Mobile Web) используя технологию PWA (Progressive Web App), с помощью которой сайт трансформируется в веб-приложение визуально и функционально. Далее для удобства буду использовать термин Mobile Web.

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

Современная веб-разработка требует эффективных инструментов, способных справляться с высокими стандартами производительности и пользовательского опыта. В этой статье мы рассмотрим Next.js, мощный JavaScript-фреймворк и новаторское решение для создания современных веб-приложений на основе React, созданный компанией Vercel. Узнаем, как он помогает разработчикам создавать высокопроизводительные, масштабируемые и SEO-дружественные веб-приложения. Мы также глубоко погрузимся в его функциональность, рассмотрим особенности, такие как серверный рендеринг и генерация статических сайтов, и предоставим примеры использования. Давайте разберем, как Next.js становится ключевым инструментом в современной веб-разработке, обеспечивая идеальный баланс между разнообразием функций и оптимальной производительностью.

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

Как могут заметить разработчики, фреймворк Next очень активно развивается. Так, некоторое время назад в 13 версии появилась новая парадигма (модель) для создания приложений — app router, которая должна прийти на смену старой pages router.

В этой статье мы постараемся наглядно продемонстрировать и рассказать, что же поменялось в работе приложения с появлением app router, какие изменения произошли в сравнении с pages router, что нового успели добавить разработчики, а от чего они отказались.

Всем привет! Меня зовут Егор Молчанов, я разработчик в команде CRM для менеджеров ипотечного кредитования в компании Домклик. Хочу поделиться своим опытом создания VR‑тура с помощью фреймворка A‑Frame и библиотеки React. Для этого написал свой небольшой pet‑проект, который мы сейчас разберём.

По поводу строго режима существует множество информации. Но, к сожалению, очень мало статьей, покрывающих весь спектр особенностей строго режима. Поэтому, я решил составить свой справочник всех ограничений, исключений и отличий в исполнении "строгого" кода от "не строгого", в полном соответствии со спецификацией ECMA-262.