React Proto 2.0 Beta - обновлено!
Начиная с 2019 года, npm имеет тенденцию к скачиванию React JS примерно 3,6 миллиона еженедельно, что надежно удерживает его в списке конкурирующих библиотек / фреймворков JavaScript, используемых для создания пользовательских интерфейсов.
React Proto - это инструмент для создания прототипов React, созданный и спроектированный как для дизайнеров, так и для разработчиков. Основная цель заключалась в создании инструмента для упрощения начального процесса создания макетов и разработки клиентских приложений. Это быстрое прототипирование позволяет быстро создавать, перетаскивать и изменять размеры компонентов для создания визуального представления вашего приложения. Thinking in React встроен, вы можете определять родительские и дочерние компоненты вместе с props и состоянием. После завершения прототипирования вы можете экспортировать шаблонный код в существующий проект, начать новый проект с помощью create-react-app или клонировать репозиторий github, а затем ввести шаблон. По своей сути, React Proto был построен с использованием React и Electron вместе с рядом других библиотек. Наша команда очень гордится реализацией поддержки React Router и Prop Drilling в приложении, а также улучшениями в сгенерированном стандартном коде.
Поддержка роутера
Теперь каждый компонент можно настроить как маршрутизатор. Затем маршрутизатор может включить любой из своих дочерних компонентов в качестве одного из своих маршрутов, приняв имя пути. Если затем установить компонент в качестве маршрута, на его узле дерева справа появится значок видимости. Щелчок по значку включает и выключает видимость компонента и его дочерних элементов на центральном холсте для рисования. Это имитирует поведение маршрутизации на стороне клиента, поскольку один компонент маршрута будет виден на определенном пути. Отношения маршрутизатор-маршрут также будут присутствовать в экспортируемом коде, см. Описание улучшения шаблона ниже.
Реквизит бурение
Также была добавлена возможность поддерживать упражнение от родителя к ребенку. Первоначально свойства могут быть созданы в компоненте с отслеживанием состояния, затем эти свойства будут доступны его дочерним элементам. Как только пользователь добавляет свойства к своему дочернему элементу, они также становятся доступными для дочерних элементов ребенка и т. Д. Это отражает бурение бурильной колонны в реальной разработке. Мы надеемся, что разработчик сможет распознать красный флаг, если реквизит просверлен слишком глубоко. Следует рассмотреть структуру управления состоянием, такую как Redux или MobX. В нашем списке желаний поддержка государственного управления. Просверливание реквизита будет отражено в экспортируемом коде, см. Описание улучшения шаблона ниже.
Улучшение котельной плиты
Экспортированный шаблонный код теперь включает прототипы маршрутизаторов и их маршруты.
Шаблон также отражает просверленные свойства от родителя к потомку и правильную деконструкцию, независимо от того, является ли компонент с сохранением состояния или тупым.
Сохранить / открыть рабочую область
Последняя основная добавленная функциональность - это возможность сохранять и открывать рабочее пространство. Текущий прогресс может быть сохранен в файл .rproto и может быть открыт товарищем по команде с включенным фоновым изображением.
Движение вперед
Двигаясь вперед, мы предлагаем сообществу разработчиков React JS продолжить совершенствование этого проекта с открытым исходным кодом, сделав его любимым инструментом для более быстрого перехода от дизайна к коду. Мы определили множество элементов, которые можно добавить, чтобы вывести React Proto на новый уровень. Вот несколько идей:
- Каждый маршрут может загружать свое собственное изображение компонента, поэтому, когда видимость маршрута включается и выключается, изображение компонента будет включаться и выключаться.
- Улучшить шаблон для включения компонентов рендеринга в списки
- Поддержка Redux и MobX State Management
- Возможность объединить несколько рабочих пространств в одно
- Поддержка React Native и React Hook
- Поддержка TypeScript
И все, что только можно придумать!
Для нашей команды было очень здорово способствовать дальнейшему развитию React-Proto - Адриан Сан, Дэррил Амур и Фрэнк Ма наконец-то рады вызвать бета-тестеров после развертывания нашей последней версии. React-Proto 2.0 доступен в бета-версиях для Mac, Windows и Linux.
