So I have created a simple calculator in Python using VS Code. How can I use now in VS Code some CSS and JS to like, customize my calculator? How can I create new folders that are CSS or JS that are linked or connected with my Python code?
-
Python is not designed for being used with JS or CSS. You can't do this without using libraries designed espacially for this. One examle of such a library is Eel.Ekrem Dinçel– Ekrem Dinçel2020-12-29 21:24:16 +00:00Commented Dec 29, 2020 at 21:24
-
Welcome to Stack Overflow! Take some time to read the Help Center.progmatico– progmatico2020-12-29 21:41:40 +00:00Commented Dec 29, 2020 at 21:41
1 Answer
You can use Flask to integrate your python code with js css and html.
In order to achieve that, you should install Flask in your environment.
pip install Flask
Here is the folder structure from project:
.
├── _templates
│ └── template.html
└── app.py
app.py
# python version 3.8.2
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index():
context = {
"title": 'Challenge'
}
return render_template('./template.html', context=context)
if __name__ == '__main__':
app.run(debug=False)
templates/template.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>{{ context.title }}</title>
</head>
<body>
<div id="legend">
<h3>Legend</h3>
</div>
</body>
</html>
Then for run your app you should use the following command, supposing your are at root folder:
python app.py
After that you can access your application at: http://127.0.0.1:5000/
Using this boiler plate you can start to understand how Flask can help you to interact with already developed code from your application and start to develop your calculator application.