Создайте свое полнофункциональное приложение ИИ Full-stack с ReactPy

Создайте свое полнофункциональное приложение с использованием ReactPy и искусственного интеллекта (ИИ)

Фото Джейсона Леунга на Unsplash

Учимся использовать React для создания красивого UI на Python!

Введение

Теперь наконец-то возможно использовать React с Python благодаря ReactPy. Эта библиотека позволяет использовать фреймворк React для создания великолепных приложений без необходимости знать JavaScript, что, вероятно, неизвестно большинству дата-сайентистов.

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

Давайте попрограммируем!

Во-первых, нам нужно установить ReactPy.

!pip install reactpy

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

Давайте посмотрим, как построить первый компонент в ReactPy.

from reactpy import component, html@componentdef App():    return html.h1("Привет, ReactPy!")App()

Как видите, создание базового компонента состоит в определении Python-функции с декоратором @component. В компоненте мы возвращаем код, который задает HTML-структуру, конкретно заголовок h1, и на самом деле получаем следующий результат.

Картинка от автора

Думаю, вы начинаете получать представление о том, что ReactPy somehow позволяет вам создавать пользовательские интерфейсы с использованием HTML. Так что давайте посмотрим, как генерировать другие компоненты, использующие HTML, добавляя логическую часть программирования на Python.

В случае, если вы хотите изучить или освежить знания HTML или CSS, что является необходимым для разработки кода в React, вы можете посетить w3School:

Например, предположим, у нас есть список словарей на Python, представляющих список дел, и каждый из них имеет определенный приоритет. Для…