Pull to refresh
5
0
Александр Федоров @alxgrn

User

Send message

Markdown Editor: WYSIWYG и markup-редактор на базе Gravity UI

Level of difficultyEasy
Reading time7 min
Views14K

Привет, Хабр! Меня зовут Сергей Махнаткин, я работаю разработчиком в отделе User Experience в Yandex Cloud. В прошлом году мы писали о нашей дизайн-системе и библиотеке компонентов Gravity UI. С тех пор система не раз обновлялась и обрастала новыми функциями, и сегодня я хочу рассказать о новом инструменте — Markdown Editor, который значительно упрощает процесс работы с документацией.

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

Читать далее

Разрабатываем библиотеку компонентов с помощью React и TypeScript

Reading time8 min
Views14K


Привет, друзья!


В этой статье я покажу вам, как начать разработку библиотеки компонентов с помощью Vite, React, TypeScript и Storybook.


Мы разработаем библиотеку, состоящую из одного простого компонента — кнопки, подготовим библиотеку к публикации в реестре npm, а также сгенерируем и визуализируем документацию для кнопки.


Репозиторий с кодом проекта.


Если вам это интересно, прошу под кат.

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

Минимальное PWA

Reading time6 min
Views22K

Какие характеристики должны быть у web-приложения, чтобы соответствовать критерию "прогрессивное"? Понятно, что, как и обычные web-приложения, прогрессивные строятся на базе "большой тройки" web-технологий - HTML/CSS/JS. Но что именно делает web-приложения прогрессивными?

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

Читать далее

Профессиональная контейнеризация Node.js-приложений с помощью Docker

Reading time10 min
Views71K
Автор материала, перевод которого мы публикуем сегодня, работает DevOps-инженером. Он говорит, что ему приходится пользоваться Docker. В частности, эта платформа для управления контейнерами применяется на разных этапах жизненного цикла Node.js-приложений. Использование Docker, технологии, которая, в последнее время, является чрезвычайно популярной, позволяет оптимизировать процесс разработки и вывода в продакшн Node.js-проектов.

image

Сейчас мы публикуем цикл статей о Docker, предназначенных для тех, кто хочет освоить эту платформу для её использования в самых разных ситуациях. Этот же материал сосредоточен, в основном, на профессиональном применении Docker в Node.js-разработке.
Читать дальше →

Готовим полнотекстовый поиск в Postgres. Часть 1

Reading time7 min
Views90K

UPD. Часть 2


Эта статья — первая из небольшой серии статей о том, как оптимально настроить полнотекстовый поиск в PostgreSQL. Мне пришлось недавно решать подобную задачу на работе — и я был очень удивлен отсутствию хоть сколько-нибудь вменяемых материалов по этому поводу. Мой опыт борьбы под катом.

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

Как распаковать айтишника и настроить цикл управления знаниями

Reading time10 min
Views6.7K

О преимуществах управления знаниями уже много написано, но вот выстраивание этого процесса — настоящий вызов...

Привет, Хабр! Меня зовут Лена, я архитектор продуктовых знаний. В этом тексте я сосредоточусь на тиражировании знаний и расскажу, как их эффективно «перекладывать» из голов экспертов. Также разберу реальный кейс Selectel — технический курс по сетям для всех сотрудников компании. Подробности под катом!
Читать дальше →

Как заменить фотостоки на нейронки в коммерческих проектах: личный опыт и промпты

Level of difficultyMedium
Reading time4 min
Views8.9K

Зачем нужны фотостоки, если нейросети готовы производить бесконечное количество нужных вам изображений? Расскажу, как мы получили несколько несколько сотен фотореалистичных изображений людей и пакет иконок для коммерческого сайта с помощью нейронок, потратив ~50 часов дизайнеров и $60 на Pro Plan Midjourney.

Плюс, конечно, наша насмотренность и опыт, которым я сейчас поделюсь с вами!

Читать далее

Настоящее предназначение OpenAI SORA: как и зачем симулировать «Матрицу» для ChatGPT

Level of difficultyMedium
Reading time41 min
Views106K

Ну что, уже успели прочитать восхищения небывалым качеством видео от нейросетки SORA у всех блогеров и новостных изданий? А теперь мы вам расскажем то, о чем не написал никто: чего на самом деле пытается добиться OpenAI с помощью этой модели, как связана генерация видео с самоездящими машинами и AGI, а также при чем здесь культовая «Матрица».

Войти в симуляцию →

Попробую, попытаюсь объяснить, что такое «площадка для стартапов Product Radar» спустя 5 месяцев после ее запуска

Reading time4 min
Views1K

На фоне умирающих или стагнирующих площадок для русскоязычных основателей стартапов (к сожалению, это я про vc.ru), Радар на моих глазах стал точкой притяжения как молодых команд и опытных предпринимателей, так и инвесторов.

Читать далее

Инфраструктурные пайплайны в Jenkins

Level of difficultyEasy
Reading time5 min
Views3.4K

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

Jenkins позволяет автоматизировать всё, от сборки и тестирования кода до деплоя на продакшн. Jenkins работает по принципу пайплайнов, которые можно настраивать под любые нужды проекта.

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

Читать далее

Knowledge Graph. Плюральность, темпоральность, деятельностный подход

Reading time3 min
Views4.8K
image

Традиционно Knowledge Graphs, то есть информационные системы, поддерживающие концептуальное описание предметных областей (как самых общих, так и узко специальных) задумываются и строятся, как источники проверенной и единственно верной информации о мире. По такому принципу – как собрание исключительно правильных данных – построена и популярная народная энциклопедия Wikipedia.
Читать дальше →

Анатомия рекомендательных систем. Часть первая

Reading time14 min
Views82K
Я работаю дата-саентистом в компании CleverDATA. Мы занимаемся проектами в области машинного обучения, и один из наиболее частых запросов на разработку основанных на машинном обучении маркетинговых решений — это разработка рекомендательных моделей.

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

Источник
Читать дальше →

Создаем текстовый редактор на React.js

Reading time17 min
Views42K

Привет! Меня зовут Данила, и я фронтенд-разработчик в KTS.

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

Надеюсь, информация будет полезной и сэкономит кому-то время и силы.

Читать далее

File upload на React.js шаг за шагом

Level of difficultyMedium
Reading time18 min
Views24K

В этой статье напишем компонент для загрузки файлов на сервер, который поддерживает:

Индикатор загрузки

Прерывание отправки

Drag and drop

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

Читать далее

Как настроить GitHub Actions и не заплакать: пошаговая инструкция

Level of difficultyMedium
Reading time5 min
Views13K

Как настроить GitHub Actions и не заплакать: пошаговая инструкция

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

В статье буду разговаривать о деплое только фронтенда. Про деплой бэкенда расскажу в следующем материале.

Читать далее

Webpack: руководство для начинающих

Reading time9 min
Views295K


Доброго времени суток, друзья!

Представляю вашему вниманию перевод статьи «Webpack: A gentle introduction» автора Tyler McGinnis.

Перед изучением новой технологии задайте себе два вопроса:

  1. Зачем нужен этот инструмент?
  2. Какие задачи он выполняет?

Если вы не можете ответить на эти вопросы, возможно, вам не нужна изучаемая технология. Давайте попробуем ответить на эти вопросы применительно к Webpack.
Читать дальше →

SSEGWSW: Server-Sent Events Gateway by Service Workers

Reading time6 min
Views10K
Привет!

Меня зовут Саша и я работаю архитектором в Тинькофф Бизнес.

В этой статье хочу рассказать о том, как преодолеть ограничение браузеров на количество открытых долгоживущих HTTP-соединений в рамках одного домена при помощи service worker.

Если хотите — смело пропускайте предысторию, описание проблемы, поиск решения и сразу переходите к результату.

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

Service Workers. Инструкция по применению

Reading time9 min
Views147K


Количество выходов в интернет с мобильных устройств ежегодно растёт на 2-4% в год. Качество связи не успевает за такими темпами. Как итог, даже самое лучшее веб-приложение обеспечит ужасный опыт, если пользователь не сможет его загрузить.

Проблема в том, что до сих пор нет хорошего механизма управления кэшем ресурсов и результатов сетевых запросов. В своей статье я хочу рассказать как Service Worker (SW) может помочь в решении этой задачи. Объясню в формате рецептов — какие элементы и в какой пропорции смешать, чтобы получить нужный результат, исходя из задачи и требований.
Поехали!

Вам посылка, или Как мы доставляем сообщения с сервера на клиент в реальном времени

Reading time8 min
Views15K

Меня зовут Алексей Комаров, я — старший frontend-разработчик в SuperJob. Хочу поделиться опытом реализации механизма обновления данных в реальном времени у нас на сайте. Под катом — подробности о выборе подхода, о проблемах, с которыми мы столкнулись при разработке, о наших кейсах оптимизации 
клиентской стороны и, конечно, немного кода и наглядных схем.

Читать далее

Server-Sent Events: пример использования

Reading time8 min
Views37K
Доброго времени суток, друзья!

В этом туториале мы рассмотрим Server Sent Events: встроенный класс EventSource, который позволяет поддерживать соединение с сервером и получать от него события.

О том, что такое SSE и для чего он используется можно почитать здесь.

Что конкретно мы будем делать?

Мы напишем простой сервер, который будет по запросу клиента отправлять ему данные 10 случайных пользователей, а клиент с помощью этих данных будет формировать карточки пользователей.

Сервер будет реализован на Node.js, клиент — на JavaScript. Для стилизации будет использоваться Bootstrap, в качестве API — Random User Generator.

Код проекта находится здесь.

Если вам это интересно, прошу следовать за мной.
Читать дальше →
1

Information

Rating
Does not participate
Location
Санкт-Петербург, Санкт-Петербург и область, Россия
Registered
Activity