Skip to content

paladique/AzureSample-Guestbook

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

17 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Data Driven Guestbook

Guestbooks are a way for visitors to a event or location to leave their mark, typically with their name and message. Around the late 1990s/early 2000s, digital guestbooks were pretty popular.

This simplified demo is a digital guestbook that walks through different types of data, using the Azure Data platform.

👷🏿‍♀️⚠ This is functional, but still a work in progress! Contributions welcome!

How it works

See it in action!

This demo is single page application (SPA), written in JavaScript that reads from MySQL and Cosmos DB databases.

Features:

  • Grabs all entries from both databases, displays which database it came from, and sorts them by date
  • Adds new entries to database of choice and updates page
  • Notifies all users of new entries using Web Sockets

Azure Resources Uses

How to Run

Requirements

Create and configure Azure resources

Recommended: Once your Azure resources are deployed, pin it to your dashboard in the Azure Portal

  1. Click this button to create a MySQL and CosmosDB Database in Azure, wait a few minutes for your services to be created. Keep note of the resource group you created so you can find your databases later!

Deploy to Azure

  1. After your services has been created, go to the Azure portal

Configure MySQL

  1. Open your MySQL Server (starts with mysql-).
  2. Download this certificate and copy to the root of this directory. Why you have to do this
  3. On the left menu, visit Connection Security and click + Add client IP* to add a firewall rule for your ip address.
  4. Set Allow access to Azure Services to On.
  5. Go back to the Overview in MySQL. Your server name and server admin login name
  6. Click on the terminal icon at the top of the portal to open the Cloud Shell Terminal.
  7. Connect to MySQL with the following command replace the servername and server admin login name with the values in the overview of MySQL:

mysql -h servername.mysql.database.azure.com -u adminname@servername -p

You're now connected to your MySQL server. The following commands will set up the database and table:

USE guestdb;

CREATE TABLE guestbook
(
    id serial PRIMARY KEY,
    entrydate datetime default now(),
    sender VARCHAR(100),
    message VARCHAR(200)
);

In the .env file, enter the following values:

SQLHost = [servername from overview]
SQLUser = [server admin login name from overview]
SQLPassword = [password for admin login]

Visit Cosmos DB

  1. Open your Cosmos DB database (starts with cosmos-).
  2. On the left menu, visit Connection String and copy the Primary conenction string

In the .env file, enter the following values:

CosmosConn= [connection string]

Run the code

Navigate to the code in your favorite command line tool (You will already be there if using VS Code's terminal)

it should look something like some\path\directory\Sample-IntroData

Enter the following commands: npm install npm start

Visit localhost:3000

Deploy this site to Azure

Checkout this documentation on how to deploy this to Azure!

After you're done

If you're all done running this sample, delete the resource group that you selected or created when you created the databases.

Learn more

Contributions are welcome!