{"id":15392253,"url":"https://github.com/vtereshyn/react-beautiful-dnd-ru","last_synced_at":"2025-10-12T11:48:40.450Z","repository":{"id":98379624,"uuid":"185464700","full_name":"vtereshyn/react-beautiful-dnd-ru","owner":"vtereshyn","description":"react-beautiful-dnd's Russian document. *in progress*","archived":false,"fork":false,"pushed_at":"2022-08-30T16:30:24.000Z","size":85,"stargazers_count":43,"open_issues_count":2,"forks_count":2,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-10-12T11:48:38.898Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vtereshyn.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":"docs/support/community-and-addons.md","governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-05-07T19:21:50.000Z","updated_at":"2024-12-14T18:21:04.000Z","dependencies_parsed_at":null,"dependency_job_id":"fd52408f-49f1-4ea9-acb0-17820b316882","html_url":"https://github.com/vtereshyn/react-beautiful-dnd-ru","commit_stats":{"total_commits":7,"total_committers":2,"mean_commits":3.5,"dds":0.4285714285714286,"last_synced_commit":"2a5cccbd97392285210270a84eee6ced1321184b"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/vtereshyn/react-beautiful-dnd-ru","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vtereshyn%2Freact-beautiful-dnd-ru","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vtereshyn%2Freact-beautiful-dnd-ru/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vtereshyn%2Freact-beautiful-dnd-ru/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vtereshyn%2Freact-beautiful-dnd-ru/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vtereshyn","download_url":"https://codeload.github.com/vtereshyn/react-beautiful-dnd-ru/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vtereshyn%2Freact-beautiful-dnd-ru/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279011184,"owners_count":26084900,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-12T02:00:06.719Z","response_time":53,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-01T15:14:22.323Z","updated_at":"2025-10-12T11:48:40.420Z","avatar_url":"https://github.com/vtereshyn.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003cimg src=\"https://user-images.githubusercontent.com/2182637/53611918-54c1ff80-3c24-11e9-9917-66ac3cef513d.png\" alt=\"react beautiful dnd logo\" /\u003e\n\u003c/p\u003e\n\u003ch1 align=\"center\"\u003ereact-beautiful-dnd\u003c/h1\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n**Красивый** и **доступный** drag and drop разработанный с помощью библиотеки [`React`](https://facebook.github.io/react/)\n\n[![CircleCI branch](https://img.shields.io/circleci/project/github/atlassian/react-beautiful-dnd/master.svg)](https://circleci.com/gh/atlassian/react-beautiful-dnd/tree/master)\n[![npm](https://img.shields.io/npm/v/react-beautiful-dnd.svg)](https://www.npmjs.com/package/react-beautiful-dnd)\n\n![quote application example](https://user-images.githubusercontent.com/2182637/53614150-efbed780-3c2c-11e9-9204-a5d2e746faca.gif)\n\n[Если есть желание - поиграйте с примерами!!](https://react-beautiful-dnd.netlify.com/iframe.html?selectedKind=board\u0026selectedStory=simple)\n\n\u003c/div\u003e\n\n## Основные характеристики\n\n- Красивое и [естественное движение](/docs/about/animations.md) элементов 💐\n- [Доступность](/docs/about/accessibility.md): мощная поддержка клавиатуры и программ экранного доступа ♿️\n- [Чрезвычайная производительность](/docs/support/media.md) 🚀\n- Чистое и мощное API, с которым легко начать работу\n- Прекрасно взаимодействое с бразуером\n- [Дополнительное стилизование необязательно](/docs/guides/preset-styles.md)\n- Нет необходимости создавать лишние обертки - отлично взаимодействует с flexbox и focus.\n\n## Начало работы 👩‍🏫\n\nМы создали [бесплатный курс на `egghead.io` 🥚](https://egghead.io/courses/beautiful-and-accessible-drag-and-drop-with-react-beautiful-dnd) чтобы помочь вам начать работу с `react-beautiful-dnd` как можно быстрее.\n\n[![course-logo](https://user-images.githubusercontent.com/2182637/43372837-8c72d3f8-93e8-11e8-9d92-a82adde7718f.png)](https://egghead.io/courses/beautiful-and-accessible-drag-and-drop-with-react-beautiful-dnd)\n\n## Поддерживаемые функции на данный момент ✅\n\n- Вертикальные списки ↕\n- Горизонтальные списки ↔\n- Передвижение между списками (▤ ↔ ▤)\n- [Объединение элементов](/docs/guides/combining.md)\n- Поддержка мыши 🐭, клавиатуры 🎹♿️ и тач скрина 👉📱 (на мобильном, планшетном и других устройствах)\n- [Поддержка multi grag](/docs/patterns/multi-drag.md)\n- Невероятная поддержка программ экранного доступа ♿️ - мы предлагаем удивительный опыт для английских программ экрамного доступа прямо из коробки 📦. Мы также предоставляем полный контроль настройки и поддержку интернационализации для тех, кто в ней нуждается 💖\n- [Перетаскивание по условию](/docs/api/draggable.md#optional-props) и [сброс по условию](/docs/api/droppable.md#conditionally-dropping)\n- Несколько независимых списков на одной странице\n- Гибкие размеры элементов списка - двигаемые элементы могут иметь разную высоту (вертикальные списки) и ширину (горизонтальные списки)\n- [Возможность добавлять и удалять элементы во время движения](/docs/guides/changes-while-dragging.md)\n- Совместимость с семантическим упорядочиванием `\u003ctable\u003e` - [табличный паттерн](/docs/patterns/tables.md)\n- [Авто скроллинг](/docs/guides/auto-scrolling.md) - возможность автоматически скроллить контейнер и даже окно, если необходимо (даже с помощью клавиатуры 🔥)\n- Кастомное управление передвижением - возможность передвигать целый элемент, управляя лишь его частью\n- Совместимость с [`ReactDOM.createPortal`](https://reactjs.org/docs/portals.html) - [паттерн порталов](/docs/patterns/using-a-portal.md)\n- 🌲 Поддержка дерева с помощью пакета [`@atlaskit/tree`](https://atlaskit.atlassian.com/packages/core/tree)\n- `\u003cDroppable /\u003e` список может быть контейнером с прокруткой (без прокручиваемого родителя) или быть дочерним по отношению к контейнеру с прокруткой (у которого также нет прокручиваемого родителя)\n- Независимые вложенные списки - список может быть дочерним по отношению к другому списку, но вы не можете перетаскивать элементы из родительского списка в дочерний список\n- Поддержка рендеринг на стороне сервера (Server side rendering (SSR)) - смотрите [resetServerContext()](/docs/api/reset-server-context.md)\n- Прекрасно работает с [вложенными интерактивными элементами](/docs/api/draggable.md#interactive-child-elements-within-a-draggable-) по-умолчанию\n\n## Мотивация 🤔\n\n`react-beautiful-dnd` разработан для создания красивых перетаскиваний элементов списка/списков. Их может использовать любой, даже люди, у которых проблемы со зрением. Для получения большей информации и мотивации по использованию проекта вы можете взглянуть на внешние ресурсы:\n\n- 📖 [Переосмысления перетаскивания (drag and drop)](https://medium.com/@alexandereardon/rethinking-drag-and-drop-d9f5770b4e6b)\n- 🎧 [React подкаст: быстрый, доступный и красивый drag and drop](https://reactpodcast.simplecast.fm/17)\n\n## Не для всех ✌️\n\nСуществует огромное количество библиотек, которые позволяют реализовать перетаскивание (drag and drop) с помощью React. Наиболее примечательным является удивительный [`react-dnd`](https://github.com/react-dnd/react-dnd). React-dnd выполняет невероятную работу по предоставлению большого набора примитивов перетаскивания, которые хорошо совместимы и хорошо работают с [дико несовместимой](https://www.quirksmode.org/blog/archives/2009/09/the_html5_drag.html) функцией перетаскивания в html5. `react-beautiful-dnd` - это абстракция более высокого уровня специально созданная для списков (вертикальных, горизонтальных, передвижения между списков, вложенных списков и так далее). В рамках вышеприведенного подмножества, `react-beatiful-dnd` предлагает мощное, естественное и красивое перетаскивание drag and drop. Тем не менее, эта библиотека не обеспечивает широту функциональных возможностей, предлагаемых `react-dnd`. Таким образом `react-beatiful-dnd` может вам не подойти - все зависит от ваших целей его использования.\n\n## Документация 📖\n\n### Описание 👋\n\n- [Установка](/docs/about/installation.md)\n- [Примеры](/docs/about/examples.md)\n- [Начало работы](https://egghead.io/courses/beautiful-and-accessible-drag-and-drop-with-react-beautiful-dnd)\n- [Дизайн принципы](/docs/about/design-principles.md)\n- [Анимации](/docs/about/animations.md)\n- [Доступность](/docs/about/accessibility.md)\n- [Поддержка браузерами](/docs/about/browser-support.md)\n\n### Сенсоры 🔉\n\n\u003e Способы, с помощью которых можно использовать drag and drop\n\n- [Перетаскивание мышью 🐭](/docs/sensors/mouse.md)\n- [Перетаскивание тачем 👉📱](/docs/sensors/touch.md)\n- [Перетаскивание клавиатурой 🎹♿️](/docs/sensors/keyboard.md)\n\n### API 🏋️‍\n\n![диаграмма](https://user-images.githubusercontent.com/2182637/53607406-c8f3a780-3c12-11e9-979c-7f3b5bd1bfbd.gif)\n\n- [`\u003cDragDropContext /\u003e`](/docs/api/drag-drop-context.md) - _Оборачивает ту часть вашего приложения, где вы хотите применить drag and drop_\n- [`\u003cDroppable /\u003e`](/docs/api/droppable.md) - _Область в которую необходимо реализовать перетаскивание. Содержит`\u003cDraggable /\u003e`_\n- [`\u003cDraggable /\u003e`](/docs/api/draggable.md) - _То, что будете двигать и переносить_\n- [`resetServerContext()`](/docs/api/reset-server-context.md) - _Утилита для серверного рендеринга (SSR)_\n\n### Руководства 🗺\n\n- [`\u003cDragDropContext /\u003e`](/docs/guides/responders.md) - _`onDragStart`, `onDragUpdate`, `onDragEnd` и `onBeforeDragStart`_\n- [Комбинация `\u003cDraggable /\u003e`s](/docs/guides/combining.md)\n- [Общие возможные проблемы с настройкой](/docs/guides/common-setup-issues.md)\n- [Используя `innerRef`](/docs/guides/using-inner-ref.md)\n- [Предупреждения для разработчика и как их отключить](/docs/guides/developer-warnings.md)\n- [Правила для `draggableId` и `droppableId`s](/docs/guides/identifiers.md)\n- [Кастомизация и пропуск анимации \"отбрасывания\"](/docs/guides/drop-animation.md)\n- [Авто-скроллинг](/docs/guides/auto-scrolling.md)\n- [Контроль скрин программ экранного доступа](/docs/guides/screen-reader.md)\n- [Использование html5 `doctype`](/docs/guides/doctype.md)\n- [`TypeScript` и `flow`](/docs/guides/types.md)\n- [Dragging `\u003csvg\u003e`](/docs/guides/dragging-svgs.md)\n- [Неочевидные предустановленные стили](/docs/guides/preset-styles.md)\n- [Как мы обнаруживаем скролл-контейнеры](/docs/guides/how-we-detect-scroll-containers.md)\n- [Как мы используем события dom](/docs/guides/how-we-use-dom-events.md) - _Полезно, если вы решили построить что-то поверх `react-beautiful-dnd`_\n- [Добавление `\u003cDraggable /\u003e`s в момент передвижения](/docs/guides/changes-while-dragging.md) - _⚠️ Продвинутый уровень_\n\n### Паттерны 👷‍\n\n- [Мульти драг](/docs/patterns/multi-drag.md)\n- [Таблицы](/docs/patterns/tables.md)\n- [Используя порталы (`ReactDOM.createPortal`)](/docs/patterns/using-a-portal.md)\n\n### Поддержка 👩‍⚕️\n\n- [Разработка](/docs/support/engineering-health.md)\n- [Сообщество и аддоны](/docs/support/community-and-addons.md)\n- [Информация о релизах и логи изменений](https://github.com/atlassian/react-beautiful-dnd/releases)\n- [Обновления](/docs/support/upgrading.md)\n- [План](https://github.com/atlassian/react-beautiful-dnd/issues)\n- [Медиа](/docs/support/media.md)\n\n## Читать документацию на других языках 🌎\n\n- [![us](https://raw.githubusercontent.com/gosquared/flags/master/flags/flags/shiny/24/United-States.png) **English**](https://github.com/atlassian/react-beautiful-dnd)\n- [![kr](https://raw.githubusercontent.com/gosquared/flags/master/flags/flags/shiny/24/South-Korea.png) **한글/Korean**](https://github.com/LeeHyungGeun/react-beautiful-dnd-kr)\n- [![china](https://raw.githubusercontent.com/gosquared/flags/master/flags/flags/shiny/24/China.png) **中文/Chinese**](https://github.com/chinanf-boy/react-beautiful-dnd-zh)\n\n## Автор ✍️\n\nAlex Reardon [@alexandereardon](https://twitter.com/alexandereardon)\n\n## Контрибьюторы 🤝\n\n- Bogdan Chadkin [@IAmTrySound](https://twitter.com/IAmTrySound)\n- Luke Batchelor [@alukebatchelor](https://twitter.com/alukebatchelor)\n- Jared Crowe [@jaredjcrowe](https://twitter.com/jaredjcrowe)\n- Many other [@Atlassian](https://twitter.com/Atlassian)'s!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvtereshyn%2Freact-beautiful-dnd-ru","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvtereshyn%2Freact-beautiful-dnd-ru","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvtereshyn%2Freact-beautiful-dnd-ru/lists"}