1

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?

2
  • 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. Commented Dec 29, 2020 at 21:24
  • Welcome to Stack Overflow! Take some time to read the Help Center. Commented Dec 29, 2020 at 21:41

1 Answer 1

2

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.

Sign up to request clarification or add additional context in comments.

1 Comment

OK thanks for helping, im a noob, so im still learning to program. Im going to watch some tuturials about Flask, thanks!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.