Combine the power of HTML CSS and JS with Python to quickly build desktop apps. You can use nodejs libraries as well with python as backend using python eel. This is an alternative to electronjs. It is quite intuitive to work with and package eel apps. Below are the links for the potential problems you may encounter and other links I've talked about in the video. I've followed this up with a brief write-up.
Other python eel examples: https://github.com/ChrisKnott/Eel/tre...
Support for exposing class methods: https://github.com/ChrisKnott/Eel/iss...
Python eel installation error (Microsoft visual C++ error): https://stackoverflow.com/questions/5...
TIMESTAMPS:
00:00 Intro
00:17 Eel installation
00:39 Project structure
01:28 Send and receive data
05:20 Todo app - create and delete tasks
08:58 Todo app - get and display tasks
11:04 Advantages and drawbacks of python eel
1. Install Python Eel using pip:
"pip install eel" is the command to install the eel package as you would any other package in python. The potential problem you may encounter is the Microsoft Visual C++ error. This is because to build the python wheel for the eel package, it requires some binaries that are shipped with Microsoft Visual Studio. So go to the stackoverflow link above and follow the instructions. The solution to any other error you encounter can be easily googled and obtained.
2. Project Structure:
The project structure is how the files and folders are organized in a project. In the video, I use a a project structure inspired by the bloc architecture from flutter. The folders you will have are the web, logic and data folders. The web(ui) folder will contain all the front end files and logic such as your HTML, CSS and JS files. The logic directory will have the business logic for the todo app. It acts a middleware between the front end and the backend. All exception handling and call to backend functions are done here. UI and backend is aware only of the functions present in this directory.
3. How to send a receive data in python eel
In the app.py/main.py file initialize the eel app by importing eel and eel.init("web"). To start the eel app, the line needed is "eel.start('index.html')". Using the "@eel.expose" decorator we can expose the python functions that we want to be able to call from javascript. This decorator is to be used for both sending and receiving data. In the HTML file include a script file called eel.js. This is a file that the eel package will automatically create.
4. Todo app:
We take the concepts learned from the previous steps and apply it to our todo eel app.
5. Advantages of Python Eel:
a. Quickly protoype desktop apps
b. Use existing python backend without having to rewrite the logic in a different language
c. Make it visually aesthetic using javascript
d. Python eel is compatible with nodejs and electronjs
e. Use with tkinter as well
6. Disadvantages of Python Eel:
a. No OOP for calling methods from js to python or from python to js
b. Project architecture is important for larger projects
Find me on:
Twitter: / 1lemon1lemonade