Flask é uma estrutura de desenvolvimento da web. Com o Python, existem dois módulos que se pode usar para o desenvolvimento da web: Django e Flask. No entanto, o frasco é mais leve e mais fácil de aprender. Neste tutorial, estaremos construindo um site muito simples usando o módulo Flask do Python.

Para começar, instale o Flask:

Flask de instalação pip

Etapa 1: Aplicativo da Web mínimo

A aplicação mínima pode ser encontrada em https: // Flask.PalletsProjects.com/en/2.0.X/Quickstart/#A-Minimal-Aplicação. Esta é uma página da web que exibe "Hello World". A primeira coisa que fizemos foi criar uma instância de Flask () com "__name__" como o argumento. O decorador de rota é usado para informar o Flask o URL que ativará a função que escrevemos.

do frasco de importação de frascos
App = Flask (__ nome__)
@aplicativo.rota('/')
Def Index ():
Retornar "Hello World"
se "__name__" == "__main__":
aplicativo.Run (Debug = True)

Em seguida, no terminal de Pycharm, digite o seguinte (onde o nome do meu arquivo python é principal.py; No seu caso, substitua o principal.py com o nome do seu Python):

Definir Flask_App = Main.py
$ Env: Flask_App = "Principal.py "
Flask Run

Depois de correr "Flask Run", o terminal irá jogar um URL com uma porta. Este URL: Port é onde a página da web é carregada. Você sempre pode pressionar o controle + c para sair. No meu caso, diz “Running in http: // 127.0.0.1: 5000/ (pressione Ctrl+C para sair) ”. Então, abra seu navegador da web, copie e cole o URL dado. No meu caso, copiei e colei “http: // 127.0.0.1: 5000/”. Observe também que as linhas anteriores devem ser executadas toda vez que você reinicia o Pyharm para que funcione:

Etapa 2: Adicionando HTML

A primeira coisa que você precisa fazer é abrir a pasta onde o script python está localizado e criar uma pasta chamada "modelos". Quando corri isso pela primeira vez, tentei colocar o nome "modelo" como o nome da pasta, e todo o programa travou e não funcionou. Então, é imperativo que você chame a pasta “modelos”. Dentro desta pasta "modelos", crie um índice.arquivo html com seu código html. Em seguida, use render_template () e passe “ÍNDICE.html ”como o argumento. Agora, se você executar "Flask Run" no terminal, seu código HTML deve ser renderizado:

Meu Código HTML (índice.html) Pelo momento é o seguinte:

O currículo de Kalyani
Esta página conterá meu currículo

E, meu código de arquivo python (principal.py) é o seguinte:

Do frasco de importação de frascos, render_template
App = Flask (__ nome__)
@aplicativo.rota('/')
Def Index ():
retornar render_template ("índice.html ")
se "__name__" == "__main__":
aplicativo.Run (Debug = True)

O último tornará uma página simples HTML.

Etapa 3: Adicionando CSS

Agora, quero adicionar CSS ao meu HTML. Para fazer isso, crie uma pasta chamada "estática" e crie um arquivo chamado "Main.CSS ”. Aqui, o nome do arquivo CSS real pode ser qualquer coisa. Eu decidi ligar para o meu “principal.CSS ”. No entanto, o nome da pasta deve ser "estático"! De fato, na pasta "estática", pode -se colocar qualquer coisa estática, como CSS, JavaScript e imagens. Então, se você vai colocar imagens, JavaScript e CSS, pode querer criar sub-oscilantes.

Primeiro, vamos escrever o CSS (principal.CSS) eu quero:

corpo
margem: 0;
Cor: #333
Fonte-família: Verdana;
Size da fonte: 20px;
Background-Color: RGB (201, 76, 76);

.estilizado
Background-Color: #92A8D1;
Fonte-família: Verdana;
Size da fonte: 20px;

Aqui, no índice.HTML, precisamos escrever elt; link rel = ”Stylesheet” TIPO = ”TEXT/CSS” HREF = ”url_for ('static', filename =" Main.CSS ")"> na cabeça do arquivo html. Aqui, o nome do arquivo é o nome do arquivo CSS (o meu é principal.css). Se, por exemplo, o “principal.O CSS ”está localizado com um subpasta chamado“ CSS ”, então você escreveria o seguinte:

.

Depois disso, você pode usar o CSS que você criou. Por exemplo, eu criei um chamado "estilizado" e o usei na classe H1.

Meu índice.O arquivo html seria o seguinte:

O currículo de Kalyani

Esta página conterá meu currículo

Como alternativa, também se pode usar o seguinte:

.
[/cce_python]
Nesse caso, o código HTML ficaria assim:
[cc lang = "html" width = "100%" altura = "100%" escape = "true" tema = "Blackboard" Nowrap = "0"]