Birthday Greetings App

Introduction

This tutorial will help you build a simple React web application called Birthday Greetings. The application will allow you to configure email wishes you can send to your peers on their birthday. You can configure the wish with a custom birthday message and set it to be sent to the required person’s email on the day of their birthday.

You can perform the following actions in the application:

• Sign up/log into your application and employ the common authentication processes, including validating access using custom logic.
• Create, update, delete, and manage the birthday wishes you configure.

The client side of the application will look like this:

You can explore the functionality of the application using this link: Try the app!

The backend logic of this tutorial is coded using the Node.js runtime. The Birthday Greeting application employs features of components from the following Catalyst services:

1. Catalyst Serverless
   
   • Functions: The backend logic will be coded using the following function types:
     • Advanced I/O Function: The logic to interact with the client and create the dynamic cron will be coded in this function.
     • Basic I/O Function: The logic used for custom user validation will be coded in this function.
     • Job Function: The logic to trigger the email containing the birthday greeting will be coded in this function.
2. Catalyst Cloud Scale
   
   • Data Store: To store the name, custom message, birthday, and email of the person you are creating and scheduling the greeting for.
   • ZCQL: To post and fetch data from the Data Store through querying.
   • Authentication: To employ the required login elements using the Embedded Authentication type to allow users to sign up or log into your application.
     • Whitelisting: To use the Custom User Validation feature to employ the custom authentication logic.
     • Email Templates: To customize Email Verification, and Forgot Password email templates.
   • Mail: To verify the sender email address and send the email to the required person.
   • Web Client Hosting: To host the front end of the application. You can initialize and configure the client as a React app.
3. Catalyst Job Scheduling
   
   • Job Pool: To execute the function jobs that will trigger the required job function to trigger the sending of the email containing the birthday greeting.
   • Cron: To schedule the sending of the greetings email using Dynamic Cron.
   • Jobs: To trigger the required Job Function when executed from the Job Pool.

We will use the Catalyst web console and the Catalyst Command Line Interface (CLI) to build this application.

Application Workflow

The workflow of the Birthday Greetings application is illustrated below:

1. You sign up or log into the application.
2. You can provide a custom message, schedule when you want the birthday greeting to be sent, and to whom it needs to be sent using the UI elements in the client side.
3. The details are then used by the Advanced I/O function to create a Dynamic Cron using the SDK.
4. At the scheduled time, the dynamic cron will submit a function job to the function job pool, from where the function job will be executed to trigger the Job Function.
5. The job function will use the Mail SDK to send the email containing the birthday greetings to the required person.

The entire workflow of the application will be explained in more detail when you code your client logic, which we recommend you check out as you follow along the steps.