Автор оригинала: Abdur-Rahmaan Janhangeer.
Предыдущая: Часть 1 – Планирование
В этом руководстве мы будем видеть, как запустить минимальное приложение. Так что вы можете сосредоточиться на материале, я создал репо для вас с некоторыми загруженными Libs.
Три мушкетеры: Bootstrap, jQuery и fontawesome
Хотя мы не будем использовать все три сразу, приятно знать, какие библиотеки мы используем.
Bootstrap – популярный CSS-каркас, которая позволяет мгновенно получать красивые сайты
JQuery – библиотека JS, которая упрощает кодирование JS
Fontawesome – библиотека для включения иконок
Наш загруженный скелет
Обычно вы должны включить эти библиотеки через CDN, чтобы начать, но я уже включил их все и настроил в этом репо
DeliciClask-2.1
Скачать это.
CD в папку
Чтобы установить модули делать (у нас есть только колба на данный момент):
python -m pip install -r requirements.txt
Запустить делать:
Если вы идете на http://127.0.0.1:5000/ Вы будете приветствовать:
Понимание нашего приложения
По соглашению мы называем наш файл app.py. И одно: никогда не называйте корневую папку или файл колбу Как колба будет выбросить ошибки.
Наше приложение выглядит так:
from flask import Flask
from flask import render_template
app = Flask( __name__ )
@app.route('/')
def index():
return render_template('index.html')
if __name__ == ' __main__':
app.run(debug=True)
в основном мы говорим о том, чтобы сделать index.html найден в папке шаблонов, если URL – / Отказ Флэк автоматически ищет файлы в папке под названием Шаблоны Отказ
Попробуйте изменять @ app.route ('/') к @ app.route ('/hello') и пойти в http://127.0.0.1:5000/hello.
Как мы связали libs?
Если вы перейдете к главе файла индекса, вы увидите:
Если вы посмотрите в статическую папку, вы увидите bootstrap.min.css Отказ Здесь мы добавили /статический/ до bootstrap.min.css В качестве колбы по умолчанию предполагает, что активы находятся в статической папке, и давайте связываем их с помощью префикса ‘/Static/’.
Заметки
Если вы измените статический URL, вы можете ссылаться на него
{{ url_for('static', filename ='bootstrap.bundle.min.js') }}
Мы будем покрывать шаблоны в будущем, но это в случае, если вы будете решать материалы.
Как мы сделали значки ??
Если вы посмотрите на index.html, вы увидите в теле:
Он использует шрифт потрясающий. Изменяя классы, вы можете изменить значки.
Вы можете посмотреть много значков здесь: www.w3schools.com/icons/fontawesome5_icons_accessibility.asp.asp.asp.asp
Вы можете просматривать значки, выбрав другую вкладку в боковой панели
Использовать Fab Fa-Accessible-icon Выше мы просто заменим класс:
Оставайтесь настроиться на следующую часть!
Моя почта, если вы не понимаете вещи: arj.python at gmail dot com
Далее: Часть 3: Маршруты