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

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

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

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

Heretic: full stack фреймворк на основе Marko.js

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

В последнее время вышло так, что я по неведомой причине стал часто заниматься популяризацией Marko.js, декларативного и реактивного языка разметки, который разрабатывается eBay. С одной стороны, это связано с тем, что Marko незаслуженно часто обходят стороной, хотя он позволяет делать из коробки многое из того, что не получится сделать на мейнстримовых фреймворках. С другой стороны, это действительно классно, когда можно использовать обычный HTML, при необходимости расширяя его синтаксисом Marko (вроде условных операторов и циклов). Одним словом, если вы еще не видели, что это такое - посмотрите, возможно, вам это очень понравится.

Когда у меня возникла необходимость разработать несколько внутрикорпоративных ресурсов, которые облегчали бы повседневную менеджерскую работу, я решил взять за основу некоторые свои разработки, в том числе компоненты, написанные на Marko, и максимально переиспользовать их. Так на свет появился Heretic - фреймворк, основанный на Marko.js, Node.js, Fastify, Bulma, MongoDB и других продуктах. Он позволяет за минимальные сроки разворачивать сайты, панели управления, различные сервисы и (теоретически) вообще все, что угодно :-)

Читать далее
Всего голосов 2: ↑2 и ↓0 +2
Комментарии 0

Новости

Как коридорное исследование помогло обновить каунтеры тредов в мессенджере

Время на прочтение 4 мин
Количество просмотров 514
Кейс

Треды — это комментарии под сообщениями. Они помогают сделать общение структурным: вместо потока идущих подряд сообщений можно создавать тематические ветки обсуждений. Но как пользователю сориентироваться, в каких тредах появились новые комментарии, а в каких нет? Сначала мы использовали иконку-каунтер, которая меняла цвет в зависимости от новых событий, но потом стало понятно, что ее нужно менять.

Читать далее
Всего голосов 4: ↑3 и ↓1 +2
Комментарии 4

Как типизировать Vuex Store

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

Всем привет!

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

You are welcome!

Хочу типизировать Vuex
Всего голосов 2: ↑2 и ↓0 +2
Комментарии 0

Ключ к эффективности разработки: делать то, что нужно, но лишнего не делать

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

Кучу времени можно сэкономить если:


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


Тщательно проработать важные аспекты нового проекта, собрав нужных людей на встречу(и), написав понятно задачи.
Не прорабатывать тщательно то, что допустимо придумать на ходу / не особо важно / можно спросить.

Читать дальше →
Всего голосов 17: ↑14 и ↓3 +11
Комментарии 30

Истории

Обновление состояния системы через Server-Sent Events (SSE) без затей

Уровень сложности Средний
Время на прочтение 11 мин
Количество просмотров 1.3K
Туториал

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

Допустим, у нас есть список объектов, к примеру – список эпизодов для шоу. Один клиент на него смотрит, а другой в это время добавляет в список еще один эпизод. Хорошо бы факт добавления нового эпизода сразу отобразить у первого клиента. То же самое относится и к просмотру информации об отдельном эпизоде: если один клиент её просматривает, а другой – редактирует, было бы здорово результат редактирования сразу отображать у первого.

Для решения данной задачи очень удобно использовать механизм Server-Sent Events (SSE). О том как это сделать в проектах, у которых на беке Node, а на фронте React, я и хочу поговорить.

Читать далее
Всего голосов 2: ↑2 и ↓0 +2
Комментарии 5

Что такое GraphQL

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

В этой статье мы узнаем, что такое GraphQL и сравним его с REST API, проведём аналогии и посмотрим на главные различия. Ну а также, естественно, посмотрим, как работает GraphQL и какие у него возможности.

Читать далее
Всего голосов 17: ↑16 и ↓1 +15
Комментарии 57

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

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

Привет, на связи Ефим Иванов — Product Owner, а в недавнем прошлом системный аналитик на финтех-проектах Outlines Tech. Делюсь своим опытом, как составлял спецификации и облегчал работу команде. Я выявил два подхода: «все по полочкам» и «история создания решения». В статье найдете объяснение, чем отличаются методы, как выглядят и насколько удобны для каждого звена команды разработки. 

Читать далее
Всего голосов 2: ↑2 и ↓0 +2
Комментарии 9

Как декораторы могут упростить разработку веб-форм

Уровень сложности Простой
Время на прочтение 16 мин
Количество просмотров 2.1K
Туториал

Относительно недавно в TC39 предложение с реализацией декораторов в EcmaScript вышло на 3-ю пред финальную стадию. Чуть позже MicroSoft выпустил 5-ю мажорную версию TypeScript, в которой новая реализация декораторов начала работать из коробки без каких-либо экспериментальных флагов. Babel тоже подсуетился, и в своей документации начал рекомендовать использовать новую реализацию декораторов. А это означает лишь то, что декораторы наконец-то начали полноценно входить в жизнь JavaScript разработчиков.

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

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

Читать далее
Всего голосов 3: ↑3 и ↓0 +3
Комментарии 13

Подборка: 7 плагинов Figma для оптимизации дизайн-процессов

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

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

Читать далее
Всего голосов 6: ↑6 и ↓0 +6
Комментарии 0

Nuxt.js в SEO: как создать оптимизированные веб-приложения

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

Начнем с того что эта статья была написана на основе моего последнего собеседования и я не смог ответить на вопрос "Какой фреймворк использовать для SEO оптимизации, что бы абсолютно все поисковики индексировали сайт, если у нас 15 000 страниц?". Правильным ответом было: Nuxt.js

SEO (Search Engine Optimization) - это важный аспект любого веб-проекта, который помогает улучшить видимость вашего сайта в поисковых системах. Оптимизация SEO может быть сложной задачей, но при использовании правильных инструментов и практик она становится более управляемой. В этой статье мы рассмотрим, как использовать фреймворк Nuxt.js для создания веб-приложений с учетом SEO.

Читать оптимизатурус
Всего голосов 1: ↑0 и ↓1 -1
Комментарии 5

React Fiber & Concurrency Part 2 (2)

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

Данная статья посвящена реализации не блокирующего рендеринга - Concurrent React. Мы рассмотрим то, как работают под капотом Concurrent Features добавленные в 18 версии React. На основе теоретических знаний разберем результат профилирования тренировочного приложения и наглядно увидим, как Concurrent Features разбивают рендеринг приложения.

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

Читать далее
Всего голосов 2: ↑2 и ↓0 +2
Комментарии 0

Какого цвета интернет: история смены окраски веб-страницами

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

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

Читать далее
Всего голосов 66: ↑66 и ↓0 +66
Комментарии 44

Чем занимается AppSec? Безопасность внутренних веб-ресурсов

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

Довольно долгое время вероятным нарушителем считался только злоумышленник из интернета. На сегодняшний день компании весьма неплохо научились защищать внешний периметр, по крайней мере, важные активы. Но внешние ИТ-ресурсы — это лишь вершина айсберга. Во внутреннем периметре любой компании существует огромное множество процессов работы с данными и соответствующих ресурсов. Число пользователей таких систем может исчисляться тысячами: в больших ИТ-компаниях работают сотни и тысячи сотрудников, с доступом ко внутренним ресурсам, при этом постоянно происходит множество ротаций. Всё это создаёт риски компрометации продукта и утечки данных. 

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

Читать далее
Всего голосов 20: ↑20 и ↓0 +20
Комментарии 0

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

Битва пет-проектов
Дата 25 сентября – 30 ноября
Место Онлайн
PG Boot Camp Russia 2023
Дата 5 октября
Время 10:00 – 17:00
Место Москва Онлайн
Joker
Дата 9 – 14 октября
Время 16:00 – 19:30
Место Санкт-Петербург Онлайн
Открытый урок «Kafka Streams»
Дата 16 октября
Время 10:00
Место Онлайн
Вебинар онлайн-курса «DevOps 1C»
Дата 16 октября
Время 20:00 – 21:30
Место Онлайн
Питч-сессия pravo (tech) impulse
Дата 19 октября
Время 15:45 – 17:30
Место Москва
Вебинар «Разработка бэкенда на Clojure»
Дата 24 октября
Время 20:00 – 21:30
Место Онлайн
Russia Risk Conference 2023 — 19-я конференция по риск-менеджменту
Дата 25 – 26 октября
Время 10:00 – 19:00
Место Москва Онлайн
IT Recruiting – HR Forum 2023
Дата 8 – 10 ноября
Время 9:00 – 18:00
Место Москва
Онлайн IT HR-конференция HR42
Дата 17 – 18 ноября
Время 10:00 – 14:00
Место Онлайн
HighLoad++ 2023
Дата 27 – 28 ноября
Время 9:00 – 20:00
Место Москва Онлайн

Macromedia Flash: Взлет и закат технологии

Уровень сложности Средний
Время на прочтение 29 мин
Количество просмотров 11K
Обзор

Если никто не подведёт итог под историей Macromedia Flash, она рискует затеряться в хламе IT-подвала. Напомню, что “волшебный” плагин Flash player стоял практически на всех компьютерах мира. И в какой-то момент именно эта технология была лучшей для анимации, игр и мультимедиа. В этой статье я расскажу историю технологии и добавлю историю от лица разработчика: что мы создавали, как работали,  плюсы минусы самой платформы и ключевые события. Ну и главное, почему Flash взлетела до массового распространения, а потом потерпела поражение и осталась в прошлом. И ответить на вечный вопрос “Кто виноват?” Иная версия вопроса: Зачем Стив Джобс убил Flash? Спойлер, Джобс не виноват.

Читать далее
Всего голосов 59: ↑59 и ↓0 +59
Комментарии 75

Добавили бота в свой Telegram канал? Будьте готовы с ним попрощаться

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

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

Читать далее
Всего голосов 68: ↑65 и ↓3 +62
Комментарии 66

Обзор NativePHP. Инструмент для создания собственных нативных desktop приложений на Laravel

Уровень сложности Средний
Время на прочтение 7 мин
Количество просмотров 9.9K
Обзор

Привет, коллеги!

В этой статье я сделаю небольшой обзор NativePHP, который появился на последнем Laracon. Что из себя представляет NativePHP? Перед нами фреймворк, который позволяет нам писать нативные десктоп приложения, используя PHP. Приложения кроссплатформенные - можно писать под Mac, Windows и Linux. И все это с использованием нашего любимого PHP с использованием Laravel. Но как обещают разработчики в будущем появятся и другие драйверы.

Читать далее
Всего голосов 18: ↑16 и ↓2 +14
Комментарии 50

Вы кто такие, я вас не знаю, или Как мы делаем JWT-аутентификацию

Уровень сложности Средний
Время на прочтение 11 мин
Количество просмотров 4.8K
Туториал

Привет! Меня зовут Данил, я backend-разработчик в Doubletapp. Почти во всех наших проектах есть пользователи, которые могут войти в систему. А значит, нам почти всегда нужна авторизация. Мы используем авторизацию, построенную на JSON Web Token. Она отлично сочетает в себе простоту реализации и безопасность для приложений.

В интернете есть много разных материалов с объяснением, что такое JWT и как им пользоваться. Но большинство примеров ограничиваются выдачей токена для пользователя. В этой статье я хочу рассказать не только о том, что такое JWT, но и как можно реализовать работу с access и refresh токенами и решить сопутствующие проблемы. Будет немного теории и много практики. Присаживайтесь поудобнее, мы начинаем.

Путеводитель:

Что такое JSON Web Token?
Использование и реализация
Простая реализация JWT
Access и refresh tokens
Как отозвать токены
Доступ с нескольких устройств
Удаление старых данных
Резюмируем

Читать далее
Всего голосов 21: ↑19 и ↓2 +17
Комментарии 44

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

Уровень сложности Средний
Время на прочтение 31 мин
Количество просмотров 3.6K
Туториал

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

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

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

Читать дальше →
Всего голосов 12: ↑12 и ↓0 +12
Комментарии 5

Методы хэширования паролей. Долгий путь после bcrypt

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

Шифровальная машина M-209, на основе которой создана первая в истории функция хэширования crypt в Unix

Прошло 25 лет с момента изобретения алгоритма хэширования bcrypt (1997), но он до сих пор считается одним из самых стойких к брутфорсу хэшей.

Вот уже несколько десятилетий некоторые специалисты прогнозируют, что аутентификация будет производиться ключами/сертификатами. Но этого до сих пор не случилось. Пароли остаются неотъемлемой частью систем информационной безопасности. Вообще, они широко использовались ещё до изобретения компьютеров, так что в таком долгожительстве нет ничего удивительного.
Читать дальше →
Всего голосов 12: ↑11 и ↓1 +10
Комментарии 6

Геймификация в охране труда: кому, зачем и как?

Время на прочтение 4 мин
Количество просмотров 830

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

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

Читать далее
Всего голосов 3: ↑3 и ↓0 +3
Комментарии 1

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