Язык программирования питон javascript

Python & EEL. Делаем просто на Python’е и красиво на JS

Тема красивых интерфейсов была и будет актуальна всегда. Кто-то использует для создания графических приложений C#, кто-то использует Java, кто-то уходит в дебри C++, ну а кто-то извращается с Python, используя tkinter или PyQT. Существуют различные технологии, позволяющие совмещать красоту графических дизайнов, создаваемых на HTML, CSS и JS с гибкостью в реализации логики приложения, которую может дать другой язык. Так вот, для тех, кто пишет на самом лучшем языке программирования Python, есть возможность писать красивые интерфейсы на HTML, CSS и JS и прикручивать к ним логику на Python.

В этой статья я хочу показать на небольшом примере, как же все таки создать простое и красивое десктопное приложение на HTML, CSS, JS и Python. В качестве библиотеки для связи всех компонентов будем использовать EEL.

Установка

Оговорюсь, что я работаю на windows 10 x64.

Для начала установим саму библиотеку выполнив простую команду:
pip install eel
После установки одной лишь библиотеки можно начинать наш путь.

Наше приложение будет выглядеть таким образом:

Логика приложения очень простая: при нажатии кнопки “рассчитать” считываются значения в поле для ввода рублей, полученные данные отправляются в Python, где происходит расчет курса валют. Python возвращает нам данные и мы выводим из через JS

Раскидываем по папкам

Разобьем теперь наш проект на модули. В папку “front” будем класть всё, что связано с графической частью нашего приложения. В папку “back” будем помещать все наши исходники на python. Еще создадим папку middle, в которую будем помещать методы, вызываемые из JS (об этом чуть позже). В Главной директории создадим файл main.py, он будет запускать наше приложение.

Логика на Python

В качестве теста реализуем простое приложение конвертер валют (да-да, банально, никому не надо, на гитхабе миллион проектов). Для этого на python установим библиотеку CurrencyConverter:
pip install currencyconverter

Теперь приступим к написанию логики на python. Реализуем метод, который на вход будет принимать сумму, валюту с которой нам надо перевести и валюту, на которую нам надо перевести. Создадим “convert.py” в директории “back” и запишем в него следующий код:

from currency_converter import CurrencyConverter converter = CurrencyConverter() def convert_value(value: float, from_cur: str, to_cur: str): return converter.convert(value, from_cur, to_cur)

Теперь в директории “middle” создадим файл “mid_convert.py” и пропишем следующий код:

from back.convert import convert_value import eel @eel.expose def convert_value_py(value:float, from_cur:str, to_cur:str)->float: return convert_value(value, from_cur, to_cur)

Что здесь вообще происходит? Файл “mid_convert.py” будет служит связующим звеном между JS и Python. Декоратор @eel.expose дает нашей программе понять, что функция, описанная ниже, может быть вызвана из JS. Таким образом, любая функция, которую мы в будущем захотим вызывать из JS, должна быть обернута декоратором @eel.expose. Очевидно, что не имеет смысла делать лишних модулей, если у вас простой проект, можно было обернуть декоратором функцию “convert_value” в модуле “convert.py”. В больших проектах разбиение программы на такие слои позволит легче расширять и оптимизировать код.

Подключаем Python к JS

Теперь подключим нашу логику на Python к самому JS. Для этого примера я использую простую страничку, сверстанную чисто при помощи HTML, CSS (или вы можете использовать популярные фреймворки, которые нужны вам для работы с графикой). Первым делом необходимо подключить библиотеку eel к самому JS:

Далее реализуем функционал кнопки “рассчитать”. По нажатию кнопки первым делом необходимо считать значение рублей и пойти по каждой валюте, чтобы перевести значение.

async function create_cur_for_rub () < // получаем значение введенных рублей let value_rub = parseFloat(document.getElementById("rub-input").value); // получаем список всех input'ов, в которые надо перевести рубли let list_curs = document.getElementById("list-cur").children; for (let div_cur of list_curs) < // берем название денежной единицы let name_cur = div_cur.getElementsByTagName("span")[0].textContent; // теперь передает значение в Python для обработки let value_cur = await eel.convert_value_py(value_rub, "RUB", name_cur)(); // выводим на экран полученное значение div_cur.getElementsByTagName("input")[0].value = value_cur; >> document.getElementById("btn-sum").onclick = create_cur_for_rub;

Обратите внимание на строку “let value_cur = await eel.convert_value_py(value_rub, «RUB», name_cur)();”. Важно, что вызов функции из питона происходит в асинхронном режиме, поэтому обязательно необходимо сделать асинхронной ту функцию, в которой есть вызов Python кода. При вызове функции из eel необходимо ставить пару (), где в первые круглые скобки будут передаваться наши аргументы.

Как мы видим, все работает.

Запуск программы

Для запуска кода используем файл “main.py”. В нем импортируем библиотеку eel и всё, что мы писали в файле “min_convert.py” для того, чтобы при запуске проекта подтянуть все функции, которые мы оборачивали в eel.expose:

import eel from middle.mid_convert import *

Теперь необходимо проинициализировать через eel ту директорию, где лежит front-end нашего приложения. При помощи команды eel.init(args). Далее для запуска самого приложения вызывает метод eel.start(args):

if __name__ == '__main__': eel.init('front') eel.start('index.html', mode="chrome", size=(760, 760))

Метод eel.start принимает на вход несколько параметров (подробнее о них см. официальную документацию по eel). Самым интересным параметром является “mode”. При помощи него вы можете запустить свой проект, как в браузере, так и в виде отдельного приложения. Например, вы можете указать параметр “default”, в таком случае приложению будет запускать в браузере по умолчанию. Если у вас стоит google chrome, то указав параметр “mode=chrome” ваша программа откроется в виде отдельного приложения.

Также можно использовать chromium. Для этого скачиваем его с официального сайта. Разархивируем его в какую-нибудь папку и прописываем следующий код в нашем “main.py”:

eel.browsers.set_path("chrome", "C:/Users/admin/Documents/chrome-win/chrome.exe") eel.start('index.html', mode="chrome", size=(760, 760))

Вывод

Как мы видим, то создавать красивые десктопные приложения с использованием Python в качестве языка для реализации основной логики не так сложно. Вы можете устанавливать какие угодно библиотеки, реализовать нужный код с использованием Python, а писать красивые интерфейсы на HTML,CSS и JS.

P.S. это моя первая статья на Habr, пишите Ваши пожелания, замечания и отзывы, буду рад увидеть любой комментарий.

Источник

Python или JavaScrpt. Cамые важные различия

На данный момент Python и JavaScript являются одними из популярных языков программирования. Не смотря на то, что оба являются объектно-ориентированными языками программирования, их области применения различны. Python и JS имеют много общего, но с некоторыми существенными отличиями.

У разработчиков Python и JavaScript есть широкие возможности для трудоустройства. Следовательно, выбор одного из двух языков программирования, является хорошим вариантом для начала карьеры программиста.

С точки зрения начального изучения, Python намного проще, чем JavaScript. Фактически, одна из основных целей проектирования языка программирования Python — это простота понимания и реализации.

Прежде чем мы начнем перечислять различия между Python и JavaScript, давайте сначала кратко расскажем о двух конкурентах.

Python — один из самых быстрорастущих языков программирования

Python — это интерпретируемый высокоуровневый язык программирования со строгой типизацией с динамической семантикой и объектно-ориентированным дизайном. Он легкий для чтения и простой в реализации.

Python также может служить языком сценариев для Perl и Ruby при создании веб-приложений. Прелесть Python в том, что он позволяет программистам использовать различные стили программирования для разработки как сложных, так и простых программ.

Парадигмы программирования, поддерживаемые в Python:

• Функциональное программирование
• Императивное программирование
• Объектно-ориентированное программирование
• Процедурное программирование

JavaScript — предпочитаемый язык программирования для веб

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

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

Хотя изначально JavaScript предназначался для фронт-энда, теперь он также используется для бэкэнд-разработки (Node.js). Следовательно, JavaScript предлагает полную разработку стека. Фактически, с Node.js можно разрабатывать автономные настольные приложения.

Python vs JavaScript. Прямое сравнение

Массивы, списки и кортежи

JavaScript обеспечивает поддержку массивов как встроенных типов данных. Хотя в Python нет встроенной поддержки массивов, есть обходной путь для реализации массивов в Python . Это достигается с помощью списков, наиболее близких к массивам, которые может предложить Python.

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

Атрибуты и свойства

У объектов JavaScript есть свойства, которые могут состоять из базовых атрибутов. Это позволяет вам определить данное свойство. В языке программирования Python протокол дескриптора, в котором используются функции получения и установки, позволяет определять атрибут.

Кодовые блоки

JavaScript использует фигурные скобки для определения блоков кода. Python использует отступы для определения блоков кода. В то время как JavaScript имеет символ точки с запятой ( ; ), служащий для обозначения конца строки, в Python используется перевод строки.

Формат кодирования

JavaScript должен быть закодирован как UTF-16. Кроме того, в языке программирования нет встроенной поддержки для манипулирования необработанными байтами. Если не указан формат кодировки, исходный код Python по умолчанию является ASCII.

Источник