Vous avez dit étudier Python. De plus, j'ai dit que vous n'étiez pas obligé d'étudier HTML5. C'est *** mensonge ***.

Résultats de divers essais

Ce n'est pas exactement un mensonge, mais ce que j'ai trouvé en étudiant le contenu est réalisé en utilisant une fonction de Python et une fonction appelée Flask (jinja2).

Code que j'ai réellement essayé

J'ai fait une description en utilisant uniquement Flask comme indiqué ci-dessous et l'ai essayé avec ʻelectron .`, mais cela fonctionne correctement.

$ cat index.py
#!/usr/bin/env python3
# -*- coding: utf-8 -*-

from __future__ import print_function
import time
from flask import Flask

app = Flask(__name__)

@app.route('/')
def index():
    return "<!DOCTYPE html>\
<html lang=\"en\">\
  <head>\
    <meta charset=\"utf-8\">\
    <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\
    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\
    <script src=\"http://code.jquery.com/jquery-1.11.1.min.js\"></script>\
    <link href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css\" rel=\"stylesheet\" integrity=\"sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7\" crossorigin=\"anonymous\">\
    <script src=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js\" integrity=\"sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS\" crossorigin=\"anonymous\"></script>\
  </head>\
  <body>\
    <div class=\"container\">\
      <div class=\"header\">\
        <h3 class=\"text-muted\">Yesterday</h3>\
      </div>\
    </div>\
  </body>\
</html>"

if __name__ == "__main__":
    app.run(host="127.0.0.1", port=5000)

Codage plus propre

Il vaut mieux faire ce qui suit que d'écrire du html en python.

Contenu de index.py

$ cat index.py
#!/usr/bin/env python3
# -*- coding: utf-8 -*-

from __future__ import print_function
import time
from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def index():
    return render_template('index.html')

if __name__ == "__main__":
    app.run(host="127.0.0.1", port=5000)

Contenu de templates / index.html

$ cat templates/index.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
  </head>
  <body>
    <div class="container">
      <div class="header">
        <h3 class="text-muted">Sample Page</h3>
      </div>
    </div>
  </body>
</html>

Comment aller et venir entre les pages

Si vous créez templates / sample / sample.html comme indiqué ci-dessous, utilisez Jinja2 et collez un lien, cela semble fonctionner. (S'il y a plusieurs fichiers dans le dossier des modèles, cela ne semble pas fonctionner?)

$ cat index.py
#!/usr/bin/env python3
# -*- coding: utf-8 -*-

from __future__ import print_function
import time
from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def index():
    next = u'Je vais aller à la page suivante'
    return render_template('/index.html', message=next)

@app.route('/sample/')
def sample():
    return render_template('/sample/sample.html')

if __name__ == "__main__":
    app.run(host="127.0.0.1", port=5000)

Contenu de /templates/index.html

$ cat Downloads/work/templates/index.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
  </head>
  <body>
    <div class="container">
      <div class="header">
        {% if message %}
        <h3 class="text-muted"><a href="/sample">{{message}}</a></h3>
        {% endif %}
      </div>
    </div>
  </body>
</html>

Contenu de /templates/sample/sample.html

$ cat Downloads/work/templates/sample/sample.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
  </head>
  <body>
    <div class="container">
      <div class="header">
        <h3 class="text-muted"><a href="/">Je reviendrai</a></h3>
      </div>
    </div>
  </body>
</html>

À propos de Jinja2

Je n'ai pas supprimé les détails, donc je vais m'y habituer, mais il semble que les variables et les instructions if peuvent être utilisées et qu'elles seront gérées en html. Et il semble que l'intérieur de app.route écrit en python soit strict. Jinja2 semble être considéré comme un dossier s'il se termine par /, et un fichier s'il se termine par / sample. En conséquence, je pensais que je ne pouvais pas y accéder avec / sample, mais je devais parcourir le répertoire.

Du fichier html, le contenu de / templates / index.html est affiché sous forme de messages en utilisant les variables reçues de python. De plus, le lien est différent de app.route de python et est accessible avec / sample. Cette description est proche de app.route, mais lâche. Peu importe s'il n'y a pas de / à la fin. Cependant, il ne fait pas directement référence à sample.html.

Inversement, lors du retour de / templates / sample / sample.html vers / templates / index.html, vous ne pouvez retourner qu'avec/.

Résumé

Après tout, il semble que nous ferons du HTML5. Je ferai de mon mieux…

(˙-˙). oO (En ressemblant à ceci, cela ressemble au cordova utilisé dans le développement multi-plateforme iOS ...)

Poursuite du développement multi-plateforme avec Electron et Python