Introduction to Serverless Functions
Table of Contents
IntroductionJason Lengstorf gives an overview of his background in the industry, explains what led him to start using serverless functions, and adds that serverless functions allow frontend developers to build robust applications with only a minimal amount of server side work. file:///Users/joumanaelalaoui/Downloads/frontendmasters-serverless.pdf
OverviewJason gives an overview of the course content, and demonstrates how to clone the course repository, install the Netlify CLI, and run the first application of the course locally.
Creating a Serverless FunctionJason demonstrates how configure the initial settings of a new file within another TOML file, and how to build a simple serverless function.
Returning JSONJason continues live coding the application started during the overview segment by creating a new serverless function and checking that the function returns JSON data when Netlify is running.
Rendering JSON as HTMLJason continues live coding the application started previously, and adds the HTML code to display the JSON data in the UI.
Accessing Query String ParametersJason continues live coding the application by creating an echo function that passes in through an event query string parameters, and renders text. This segment explores the how to filter data using serverless functions.
Return Data by IDJason continues live coding the application, and adds a feature to the app to allow users to filter the movies from the JSON file by ID by building a new serverless function that queries movies by ID.
Setting up an API SecretJason demonstrates how to generate an API key, how to make a call to a third party API using a secure API token to access the movie database (OMDb), and explains that serverless functions do not expose their code through browser inspection, and are therefore useful when using private API keys.
Fetching Data from the OMDb APIJason fetches data from the OMDb API using an API key stored in a .env file, and demonstrates how to check that the data is fetched correctly by inspecting the network preview in the browser.
Rendering API DataJason fetches and renders movie ratings, or scores, into the UI from the OMDb database and builds a loop to cypher through the various scores for each movie.
Getting Set Up with HasuraJason demonstrates how to create a database using a third party application called Hasura Cloud, and explains how to add rows to the database table. Hasura allows developers to create a database in Heroku, and uses GraphQL queries to link the UI to the database.
GraphQL Data in HasuraJason creates a GraphQL query on Hasura through the Hasura sandbox, links Hasura and the application using a GraphQL endpoint and a secret key, refactors the code of one of the serverless functions, and uses the query to fetch the data that is later rendered in the application UI.
Handling Form POST in a Serverless FunctionJason continues coding the application started previously by adding a new serverless function that allows the user to add a new element of data from the UI, and demonstrates how to create a mutation on the GraphQL Sandbox in the Hasura application. A GraphQL mutation allows the posting of new data into the database.
Database & Auth
Adding to the DatabaseJason continues coding the application by adding a new serverless function that allows users to post data to the Hasura database, and uses a GraphQL mutation to link the UI to the database, and allow the posting of new data from the UI to the database.
Adding AuthenticationJason demonstrates how to launch the application on Netlify and how to configure the app to allow site admins to login and modify data only while logged in.
Adding Netlify IdentityJason demonstrates how to add the Netlify identity button to the application developed during the course, and how to log into the application through Netlify.
Protecting the Admin PageJason demonstrates how to add a JSON Web Token (JWT) to enable secure access to the admin page, and demonstrates how to handle logging in, and rerouting the user to the admin page after a successful login.
Handling the Identity Token & RolesJason demonstrates how to use a JSON Web Token (JWT) to check that the code within a serverless function can only run for a user that has a specific role, and demonstrates how to change the role of a user within Netlify for the app.
Reviewing the App CodeJason reviews the different steps that were taken during the course to build the application, and answers questions from the audience about password reset using Netlify Identity, and SSL certification.
Use Cases & Q&A
Usecases: Form Handling, Interactions & Parallel ProcessingJason introduces a few usecases of serverless functions within contact form submissions, parralel processing, interactive UIs, and explains why serverless functions are best suited to use in these cases.
Usecases: Ordering System, Subscription Management & GrepJason continues to share usecases of serverless functions, and explains how Starbucks uses serverless functions to strategize about their website and application by being aware of the costs of running specific functions.
Course Q&AJason answers questions about how to trigger serverless functions, using Fauna with serverless functions, the use of promises within a serverless function, and how to share serverless functions across applications. Common Crawl, an open repository that allows developers to run a 'grep' command across all of the internet, is also mentioned.