DEV Community

Cover image for Using gmail : Send email from Html + Spreadsheet as database
manish srivastava
manish srivastava

Posted on • Updated on

Using gmail : Send email from Html + Spreadsheet as database

We needed a way of sending an email from a "static" HTML page when you don't (want to) have a server.

Advantages:
-No "Backend" to Deploy/Maintain/Pay for
-Fully Customisable - every aspect is customisable!
-Email sent via Google Mail which is Whitelisted Everywhere (high deliverability success)
-Collect/Store any form data in a Spreadsheet for easy viewing
(perfect if you need to share it with non-technical people)

Steps:
STEP-1: Make a Copy of the Sample Spreadsheet
Sample: https://docs.google.com/spreadsheets/d/1Bn4m6iA_Xch1zzhNvo_6CoQWqOAgwwkOWJKC-phHx2Q/copy


You will get a Spreadsheet like this:

STEP-2: Open the Script Editor
Open the Script editor... by clicking "Tools" > "Script editor..."

STEP-3: Set the TO_ADDRESS in the Script

STEP-4: Save a New Version of your Script

STEP-5: Publish the Updated Script as a Web App

STEP-6: Authorize the Script to Send Emails



STEP-7: Create your basic HTML Form

STEP-8: Open the HTML Form (page) in your Browser

Part Two - Make It Look Good ...

Okay we can add more like Submit the Form using JavaScript "AJAX", Adding a customised 'Thank You Message' Shown when Form Submitted or more css...

Please visit for more

GitHub logo dwyl / learn-to-send-email-via-google-script-html-no-server

📧 An Example of using an HTML form (e.g: "Contact Us" on a website) to send Email without a Backend Server (using a Google Script) perfect for static websites that need to collect data.

I hope you people like the above article and learned something.

IMP REQUEST:
You are most welcome to join my team form for joining .
Also you are most welcome to join OPEN SOURCE INTELLIGENT SYSTEM (OSINT) if you can help in open source project regarding safeguarding humans from various diseases like CORONA outbreak
https://github.com/Manishfoodtechs/OSINTHRH/wiki

Contact email: Manishfoodtechs@gmail.com.

If you have any problem, our team is also engaged in professional consultancy and delivery.

Top comments (2)

Collapse
 
4shub profile image
Shubham Naik

Pretty cool - definitely could use this for a quick form.

Collapse
 
manishfoodtechs profile image
manish srivastava

Sure shubham. It is more than just email. It can be used as database for many apps like small apps for schools , doctors and survey much more.