Browse Library
Sign In Start Free Trial
Close icon Search icon
Account
Browse Library Sign In Start Free Trial

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying Flask By Example
  • Table Of Contents Toc
Flask By Example

Flask By Example

By : Gareth Dwyer
3.4 (8)
Buy this Book
close
close
Flask By Example

Flask By Example

3.4 (8)
By: Gareth Dwyer
Buy this Book

Overview of this book

This book will take you on a journey from learning about web development using Flask to building fully functional web applications. In the first major project, we develop a dynamic Headlines application that displays the latest news headlines along with up-to-date currency and weather information. In project two, we build a Crime Map application that is backed by a MySQL database, allowing users to submit information on and the location of crimes in order to plot danger zones and other crime trends within an area. In the final project, we combine Flask with more modern technologies, such as Twitter's Bootstrap and the NoSQL database MongoDB, to create a Waiter Caller application that allows restaurant patrons to easily call a waiter to their table. This pragmatic tutorial will keep you engaged as you learn the crux of Flask by working on challenging real-world applications.
Table of Contents (14 chapters)
close
close
close
Preface
Icon
Preface
Icon
What this book covers
Icon
What you need for this book
Icon
Who this book is for
Icon
Conventions
Icon
Reader feedback
Icon
Customer support
Lock Free Chapter
1
1. Hello, World!
Icon
1. Hello, World!
Icon
Introducing Flask
Icon
Creating our development environment
Icon
Writing "Hello, World!"
Icon
Deploying our application to production
Icon
Summary
2
2. Getting Started with Our Headlines Project
Icon
2. Getting Started with Our Headlines Project
Icon
Setting up our project and a Git repository
Icon
Creating a new Flask application
Icon
Introduction to RSS and RSS feeds
Icon
Summary
3
3. Using Templates in Our Headlines Project
Icon
3. Using Templates in Our Headlines Project
Icon
Introducing Jinja
Icon
Basic use of Jinja templates
Icon
Advanced use of Jinja templates
Icon
Summary
4
4. User Input for Our Headlines Project
Icon
4. User Input for Our Headlines Project
Icon
Getting user input using HTTP GET
Icon
Getting user input using HTTP POST
Icon
Adding weather and currency data
Icon
Summary
5
5. Improving the User Experience of Our Headlines Project
Icon
5. Improving the User Experience of Our Headlines Project
Icon
Adding cookies to our Headlines application
Icon
Adding CSS to our Headlines application
Icon
Summary
6
6. Building an Interactive Crime Map
Icon
6. Building an Interactive Crime Map
Icon
Setting up a new Git repository
Icon
Understanding relational databases
Icon
Installing and configuring MySQL on our VPS
Icon
Creating our Crime Map database in MySQL
Icon
Creating a basic database web application
Icon
Summary
7
7. Adding Google Maps to Our Crime Map Project
chevron up
Icon
7. Adding Google Maps to Our Crime Map Project
Icon
Running a database application locally
Icon
Adding an embedded Google Maps widget to our application
Icon
Adding an input form for new crimes
Icon
Displaying existing crimes on our map
Icon
Summary
8
8. Validating User Input in Our Crime Map Project
Icon
8. Validating User Input in Our Crime Map Project
Icon
Choosing where to validate
Icon
Trying out an XSS example
Icon
Validating and sanitizing
Icon
Summary
9
9. Building a Waiter Caller App
Icon
9. Building a Waiter Caller App
Icon
Setting up a new Git repository
Icon
Using Bootstrap to kick-start our application
Icon
Adding user account control to our application
Icon
Summary
10
10. Template Inheritance and WTForms in Waiter Caller Project
Icon
10. Template Inheritance and WTForms in Waiter Caller Project
Icon
Adding the Account and Dashboard pages
Icon
Shortening URLs using the bitly API
Icon
Adding functionality to handle attention requests
Icon
Adding user feedback with WTForms
Icon
Summary
11
11. Using MongoDB with Our Waiter Caller Project
Icon
11. Using MongoDB with Our Waiter Caller Project
Icon
Introducing MongoDB
Icon
Installing MongoDB
Icon
Using the MongoDB shell
Icon
Introducing PyMongo
Icon
Testing our application in production
Icon
Adding some finishing touches
Icon
Summary
12
A. A Sneak Peek into the Future
Icon
A. A Sneak Peek into the Future
Icon
Expanding the projects
Icon
Expanding your Flask knowledge
Icon
Expanding your web development knowledge
Icon
Summary
13
Index
Icon
Index

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 haven't ever used JavaScript before, but if you're interested in solidifying your all-inclusive web application knowledge, now is a good time to quickly go through a couple of JavaScript-specific tutorials. If you...

Visually different images
CONTINUE READING
83
Tech Concepts
36
Programming languages
73
Tech Tools
Icon Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.
Icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Icon 50+ new titles added per month and exclusive early access to books as they are being written.
Flask By Example
End of Section 7
Next Section
notes
bookmark Notes and Bookmarks search Search in title playlist Add to playlist font-size Font size

Change the font size

margin-width Margin width

Change margin width

day-mode Day/Sepia/Night Modes

Change background colour

Close icon Search
Country selected
Close icon Your notes and bookmarks

Confirmation

Modal Close icon
claim successful
Order Page Read Now

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY

Submit Your Feedback

Modal Close icon
Modal Close icon
Modal Close icon