book

Flask By Example

by Gareth Dwyer

March 2016

Intermediate to advanced

276 pages

6h 48m

English

Packt Publishing

Read now

Unlock full access

eBooks, discount offers, and moreWhy subscribe?
What this book covers

Downloading the example codeDownloading the color images of this bookErrataPiracyQuestions
Introducing Flask
Installing pipInstalling Flask
Writing the codeRunning the code
Setting up a Virtual Private ServerConfiguring our serverInstalling and using GitServing our Flask app with WSGIConfiguring Apache to serve our Flask application
Setting up our project and a Git repository
Using RSS from PythonURL routing in FlaskPublishing our Headlines application
Introducing Jinja
Rendering a basic templatePassing dynamic data to our templateDisplaying dynamic data in our template
Using Jinja objectsAdding looping logic to our templateAdding hyperlinks to our templatePushing our code to the server
Getting user input using HTTP GET
Creating a branch in GitAdding POST routes in FlaskMaking our HTML form use POSTReverting our Git repository
Introducing the OpenWeatherMap APISigning up with OpenWeatherMapRetrieving your OpenWeatherMap API keyParsing JSON with PythonIntroducing JSONRetrieving and parsing JSON in PythonUsing our weather codeDisplaying the weather dataAllowing the user to customize the cityAdding another search box to our templateUsing the user's city search in our Python codeChecking our new functionalityHandling duplicate city namesCurrencyGetting an API key for the Open Exchange Rates APIUsing the Open Exchange Rates APIUsing our currency functionDisplaying the currency data in our templateAdding inputs for the user to select currencyCreating an HTML select drop-down elementAdding all the currencies to the select inputDisplaying the selected currency in the drop-down input
Adding cookies to our Headlines applicationUsing cookies with FlaskSetting cookies in FlaskRetrieving cookies in FlaskWriting the fallback logic to check for cookiesRetrieving the cookies for other data
External, internal, and inline CSSAdding our first CSSAdding padding to our CSSAdding more styles to our CSSAdding the div tags to the template fileStyling our inputs
Setting up a new Git repository
Installing MySQL on our VPSInstalling Python drivers for MySQL
Creating a database setup scriptCreating the databaseLooking at our table columnsIndexing and committingUsing the database setup scriptAdding credentials to our setup scriptRunning our database setup script
Setting up our directory structureLooking at our application codeLooking at our SQL codeReading dataInserting dataDeleting dataCreating our view codeRunning the code on our VPSMitigating against SQL injectionInjecting SQL into our database applicationMitigating against SQL injection
Running a database application locallyCreating a mock of our databaseAdding a test flagWriting the mock codeValidating our expectations
Adding the map to our templateIntroducing JavaScriptThe body of our HTML codeTesting and debuggingMaking our map interactiveAdding markersUsing a single marker
The HTML code for the formAdding external CSS to our web applicationCreating the CSS file in our directory structureAdding CSS codeConfiguring Flask to use CSSViewing the resultPublishing the resultLinking the form to the backendSetting up the URL to collect POST dataAdding the database methodsTesting the code on the server
Getting data from SQLPassing the data to our templateUsing the data in our templateViewing the results
Choosing where to validateIdentifying inputs that require validation
The potential of persistent XSS
White and blacklistingValidating versus sanitizingImplementing validationValidating the categoryValidating the locationValidating the dateValidating the description
Setting up a new Git repositorySetting up the new project locallySetting up the project on our VPS
Introducing BootstrapDownloading BootstrapBootstrap templates
Introducing Flask-LoginInstalling and importing Flask-LoginUsing Flask extensionsAdding a restricted routeAuthenticating a userCreating a user classMocking our database for usersLogging in a userAdding imports and configurationAdding the login functionalityWriting the login functionCreating the load_user functionChecking the login functionalityLogging out a userRegistering a userManaging passwords with cryptographic hashesPython hashlibReversing hashesSalting passwordsImplementing secure password storage in PythonCreating the PasswordHelper classUpdating our database codeUpdating our application code
Adding the Account and Dashboard pagesIntroducing Jinja templatesCreating the base templateCreating the dashboard templateCreating the account templateCreating the home templateAdding the routing codeCreating restaurant tablesWriting the restaurant table codeAdding the create table formAdding the create table routeAdding the create table database codeAdding the view table database codeModifying the account route to pass table dataModifying the template to show the tablesAdding the delete table route to our backend codeTesting the restaurant table code
Introducing BitlyUsing the bitly APIGetting a bitly oauth tokenCreating the bitlyhelper fileUsing the bitly module
Writing the attention request codeAdding the attention request routeAdding the attention request database codeAdd the get and delete methods for attention requestsModifying the dashboard route to use attention requestsModifying the template code to display attention requestsAdding the resolve request application codeTesting the attention request codeAuto-refreshing the dashboard page
Introducing WTFormsInstalling Flask-WTFCreating the registration formRendering the registration formUpdating the application codeUpdating the template codeTesting the new formUsing WTForms in our application codeDisplaying errors to our userDisplaying the errors in our templateAdding CSS for the errorsTesting the final registration formAdding a successful registration notificationPassing the message from the application codeUsing the message in the template codeModifying the login formCreating the new LoginForm in the application codeUsing the new LoginForm in the templateModifying the create table form
Introducing MongoDB
Starting the MongoDB shellRunning commands in the MongoDB shellCreating data with MongoDBReading data with MongoDBUpdating data with MongoDBDeleting data with MongoDB
Writing the DBHelper classAdding the user methodsAdding the table methodsAdding the request methodsChanging the application code
Adding indices to MongoDBWhere do we add indices?Adding a favicon
Expanding the projectsAdding a domain nameAdding HTTPSE-mail confirmation for new registrationsGoogle AnalyticsScalability
VirtualEnvFlask BlueprintsFlask extensionsFlask-SQLAlchemyFlask MongoDB extensionsFlask-MongoAlchemyFlask-PyMongoFlask-MongoEngineFlask-MailFlask-SecurityOther Flask extensions

Content preview from Flask By Example

Chapter 7. Adding Google Maps to Our Crime Map Project

In the previous chapter, we set up a database and discussed how to add and remove data from it through Flask. With a web application that can do input and output with long-term storage, we now have the building blocks needed for nearly all web applications and are limited only by the power of our imagination.

In this chapter, we will add more features than the text-only interface from the previous chapter; we'll add embedded Google Maps that will allow a user to view and select geographic coordinates in an intuitive way.

Google Maps is written in JavaScript, and we'll need to write some JavaScript code to adapt Google Maps to our needs. As always, we'll do a whirlwind tutorial for readers who ...