Learn to build web applications – Michael Gradek

Salepage link: At HERE. Archive:

Web app development isn’t hard, but there sure is a lot of material to go over. I wanted to create a comprehensive course because I feel if someone is serious on building something great, you need to have knowledge on many of the different aspects of creating web apps. In addition, I didn’t want to create a boring course which goes over the basics of programming and then, separately, shows how to develop feature after feature without a cohesive vision.

Instead, this course is project based, meaning that we will develop an entire web application throughout the course, and along the way, learn about programming basics and all of the different aspects on web app development as we encounter the need to implement certain features or learn certain concepts.

In this course our main project will be building a recipe search engine using Python and Google App Engine! Yeah, a full-blown recipe search engine. It’s kind of like a smaller version of Google, where the only thing you can search for are recipes instead of the entire web. Check the “What am I going to get from this course?” to see all of the different concepts we are going to learn 🙂

Python is in my eyes, the best programming language to learn when you’re starting. It reads like english so it’s easy to understand the code and what it’s doing, and Python tends to be terse, meaning that it’s neatly concise and free of syntactical and verbal redundancy. Or in other words, it’s clean and productive, where one line of Python code can do what maybe 5-6 lines of code do in other languages. Python is also a lot of fun to code!

Google App Engine is an astonishing technology we can use to deploy our apps. It takes away all of the headaches of managing servers and infrastructure so you can focus 100% on your application code. Whenever your app gets popular and receive a peak of traffic you don’t have to worry about your servers crashing over the increased load. Google App Engine automagically spins up new servers to serve your users. In addition, App Engine provides many extremely useful services we will use, but that we don’t have to install and configure. For example, we don’t need to install nor configure a database, a email server, full text search indices, queues, etc. All of that is already build by Google on App Engine and we simply need to call those services to use them. Do you know how much time that saves us in the development process? A ton!

All of that allows us to rapidly develop apps, test them out and figure if we are getting traction or if we need to improve our product. It’s this ability of fast development cycles that leads us to find our ideas that work, and hopefully, generate revenues and lead us to live the lifestyle we dream of.

Course Curriculum

Introduction

• How the web works (6:54)
• Anatomy of a URL (6:01)
• Find the path
• Requests and Responses (2:38)
• Headers in requests and responses (5:42)
• What happens when we try access a website?
• The many complexities of a real-life application (8:47)
• How App Engine solves those complexities (5:12)
• Why Google App Engine?

Getting started: Guest Book app in Google App Engine

• Installing Google Cloud SDK (6:53)
• (optional) Installing the Google Cloud SDK on Windows
• Creating and running your first App Engine app (10:52)
• Understanding how App Engine works (6:52)
• About Classes in Python (5:20)
• Responses in App Engine (2:49)
• Quizz 🙂 (1:00)
• What will happen if we try to send a request to the path ‘/hello’
• More on Routing paths in App Engine (7:02)
• Routing in App Engine
• Building our Guest Book form in HTML (9:58)
• Implementing our Greet Handler (3:38)
• Saving Greetings to our Data Store (7:02)
• Lists in Python (7:29)
• Lists quizz
• Breaking up our form HTML (2:30)
• Fetching Greetings from our Data Store (6:42)
• Showing the Greetings on our Home Page (4:50)
• Refactoring our app: implementing Jinja2 templates (8:06)
• Understanding dictionaries in Python (6:10)
• Adding Greetings to the template (5:02)
• Refactoring the Greetings Data Store Model (3:59)
• Finishing our refactor and our project! (5:53)

Structuring our Recipe Search Engine project

• Preview of what we’re going to build (5:41)
• Creating our project on the Google Developer Console (1:23)
• Creating the app.yaml file (3:08)
• Creating our project directories (1:45)
• Importing Twitter Bootstrap framework (3:58)
• Creating our Router (3:11)
• What is a router?
• Building our custom Request Handler (9:22)
• Finishing our custom Request Handler (2:50)
• Implementing Bootstrap in our base template (5:19)
• Abstracting our templates into a more reusable architecture (4:26)
• Why do we need to abstract?

Writing the HTML of our pages

• Implementing a top Navigation Bar (12:28)
• Implementing a Bootstrap Modal (2:39)
• Creating a Register form inside a Modal (3:23)
• Adding more inputs to the form (1:29)
• Finishing the modal HTML (2:18)
• Adding a click listener to our button using jQuery (7:54)
• What is AJAX?
• Using AJAX in our form (2:54)
• Changing the Button depending on if the request has been received or is pending (5:54)
• Part 2 of changing the Button UI according to if the site is still working (1:12)
• Implementing error messages if the form didn’t validate appropriately (4:34)
• Creating our Register Request Handler (2:36)
• Learn about “if” statements in Python (9:18)
• Implementing form validations (5:32)
• Abstracting our JSON response to our Custom Request Handler (3:47)
• Making jQuery change the modal content according to what the server returns (4:50)
• Creating the data Model in the DataStore (7:18)
• About storing Passwords (9:53)
• About Storing Passwords (PDF Notes)
• Implementing Password encryption with salts (10:39)
• About regular expressions and email validation (7:10)
• Checking whether the email already exists, or not (1:42)
• Preparing to change the modal’s body dynamically with jQuery (4:30)
• Changing the modal’s HTML according to the response returned back from the AJAX (2:33)

Sending automatic Emails in App Engine

• Creating an Email Object (5:07)
• Finishing the send_mail function (6:11)
• Sending out our first email with App Engine! (6:52)

Logging in users

• Creating our Login Screen (9:03)
• Implementing the Password checking functionality (7:09)
• Some theory on cookies and security (8:33)
• Implementing cookie signing and cookie validation functions (8:06)
• Writing cookie sending and cookie reading functions (3:08)
• Creating a “Login Required” wrapper (7:58)
• Finishing and testing the Login Required wrapper (5:40)

Full Text Search – Searching through documents using keywords

• What are Full Text Search Indexes?
• Full Text Search Index Quizz
• Introduction to Full Text Search (3:19)
• Creating the Account Page (5:04)
• Creating the post recipe template (4:16)
• Building out the recipe form to add new recipes and index them (14:50)
• Creating the Recipe data model (6:49)
• Creating the Add Recipe class method to add and index new recipes (6:28)
• Indexing recipes into our Full Text Search Index (7:06)
• Picking up the data sent by the user (4:37)
• Saving the photo uploaded by the user (9:45)
• Implementing the Add Recipe function in the Post Recipe Request Handler (2:11)
• Finishing and fixing some bugs (6:18)

Querying the Full Text Search Index

• Querying the Search API, filtering by current User (6:27)
• Displaying the results on the Account Page (7:49)
• Building queries for the Search Results Page (10:33)
• Creating the Search Results Page (9:26)
• Fixing a small error (0:58)
• Creating the Recipe Page Request Handler (4:14)
• Implementing the Recipe Page HTML and template (11:05)
• Testing the image resizing functionality App Engine provides (1:51)
• (optional) Installing the Pillow library (4:17)
• Serving resized images (3:35)
• Finishing the Recipe Page (5:24)
• Finishing the Home Page (8:07)

Building our Parser!

• Introduction to Parsing (3:08)
• Fetching 1.5 million URLs to load into our parser (8:04)
• Setting up our Parser, assigning dedicated resources to it (9:20)
• Launching our App with the parser module (6:36)
• Loading the URLs into a Queue (6:45)
• Picking up tasks form the queue (5:54)
• Figuring out how to extract information from the source site (9:55)
• Adding the BeautifulSoup library to our project (4:13)
• Parsing Recipe Titles (4:44)
• Parsing Recipe Image URLs (3:22)
• Parsing Prep Times and Cook Times (6:49)
• Parsing Recipe Ingredients (8:15)
• Parsing Recipe Directions (4:02)
• Fetching or downloading the Recipe Images (8:07)
• Saving the image to our Google Cloud Storage bucket (8:56)
• Saving and indexing the parsed recipe (8:37)
• Debugging our save process (9:38)
• Couple of cosmetic changes (4:44)
• Loading a batch of 1000 URLs into queue and testing parser (4:09)
• Debugging the ingredients function (4:01)
• Debugging the Prep Time and Cook Time functions (3:40)
• Debugging the Photo Fetch function (1:20)
• Debugging the Prep Time and Cook Time functions again (3:23)
• Debugging the HTTP redirects case (5:29)
• Testing our Search Engine (3:58)
• Finished Yum Search Source Code

Deploying our app and configuring a custom domain

• Deploying our app and getting to know the admin developer console (7:28)
• Configuring a domain name to point to our app (7:48)

Monitoring and performance testing our app

• Exploring the logs and debugging (4:46)
• How to use the Traces to improve our app performance (1:41)
• Exploring Traces (5:04)
• Analyzing the performance of our Searches (5:43)
• Finding a performance issue on our Recipe Page (3:59)
• Fixing, redeploying and redirecting traffic to the new version of the app (1:18)
• Comparing performance of old and new version (7:11)
• Course wrap-up (2:06)