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!
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 Account
- Node.js
- Clone/download this repo
Recommended: Once your Azure resources are deployed, pin it to your dashboard in the Azure Portal
- 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!
- After your services has been created, go to the Azure portal
- Open your MySQL Server (starts with
mysql-
). - Download this certificate and copy to the root of this directory. Why you have to do this
- On the left menu, visit Connection Security and click + Add client IP* to add a firewall rule for your ip address.
- Set Allow access to Azure Services to On.
- Go back to the Overview in MySQL. Your server name and server admin login name
- Click on the terminal icon at the top of the portal to open the Cloud Shell Terminal.
- Connect to MySQL with the following command replace the
servername
andserver 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]
- Open your Cosmos DB database (starts with
cosmos-
). - On the left menu, visit Connection String and copy the Primary conenction string
In the .env file, enter the following values:
CosmosConn= [connection string]
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
Checkout this documentation on how to deploy this to Azure!
If you're all done running this sample, delete the resource group that you selected or created when you created the databases.
Contributions are welcome!