This is a solution for the Newsletter Signup Form with Success Message challenge on Frontend Mentor.
The Newsletter Signup Form project is a frontend challenge that allows users to sign up for a newsletter by providing their email address. Upon successful submission, a success message is displayed.
This project was built using the following technologies:
- React
- HTML5
- CSS3
- Google Script
- Google Sheet API
This project includes the following features:
- User-friendly form with email validation
- Success message display upon successful submission
- Integration with Google Sheets API for storing email addresses
To use this project, follow these steps:
- Clone or download the repository to your local machine.
- Navigate to the project directory and install the dependencies by running
npm install
. - Start the development server by running
npm start
. - Open the application in your browser at
http://localhost:3000
.
Enter your email address in the provided field and click the submit button to sign up for the newsletter. If the submission is successful, a success message will be displayed.
To store the email addresses, this project integrates with the Google Sheets API. Instead of creating a custom backend, Google Scripts are used to handle the POST request and save the email address directly to a Google Sheet.
The integration with Google Sheets API involves configuring credentials, setting up authorization, and making HTTP requests to interact with the Google Sheet. Refer to the Google Sheets API documentation for more information on how to set up and use the API.
- Frontend Mentor for providing the challenge
- Google Sheets API for integrating with the backend
- AnatuGreen https://github.com/AnatuGreen/FormData-to-Google-Sheet