Skip to content

A newsletter signup page built using Node and other backend applications. It also uses personal API keys and authorization that is built using the MailChimp docs. Also, we save our request and then later on, we can use that constant request to send things over the Mailchimp server by calling req.write().

Notifications You must be signed in to change notification settings

Swap-Nova/Blog-SignUp_Page

Repository files navigation

Why do we need APIs?

An API is a set of commands, protocols, and objects that programmers can use to create software or interact with an external system. Eg: jQuery.

Using Postman

Using postman, we can create API requests. So, in this workspace, we will add the API and send the API request to the web to print the results in a JSON format.

Building the Page

  • Firstly, in order for our server to load up static files such as CSS and images, then we need to use a special function of the express, i.e., Static.

  • Create a folder named Public and place all the static files inside that folder. Through this, the backend can refer to the static files through the relative URL in our HTML file.

MailChimp API

  • For building the signup page backend, we can use the Mailchimp website to generate API keys.
  • Batch subscribes to many or some people. We need a list_id and we can provide the members that we want to subscribe to in the body of our request.
  • Creating a variable and inside the members, column makes a variable from mail chimp email_address, status, and merge fields for the mail chimp.
  • The list_key which is the unique id for the audience, and the usx the x value will be the one that is present in our API key at the end. For eg: us4
https://usx.api.mailchimp.com/3.0/lists/list_key

Node https request callback

const request=https.request(url,option,function(response){
        response.on("data",function(data){
            console.log(JSON.parse(data));
        })
    })
request.write(jsonData);
    // to specify that we are done with the request
request.end();

Using .env files

DotEnv is a lightweight npm package that automatically loads environment variables from a .env file into the process.env object.

To use DotEnv, first install it using the command: npm i dotenv. Then in your app, require and configure the package like this:

require('dotenv').config().

👉 The data is stored in the server-side in this form (is present in the subscriber list of Mailchimp):

image

☢️ To run this in your local terminal.

node index.js

If there is an occur from the server-side then the Webpage:

  • Failure Page (From server side. You can redirect to the home page if failure of page occurs and retry.)

  • image


PS: We cannot use GitHub pages or any static content until we want to build a webpage with our own service stack and live with noisy servers 24/7.

About

A newsletter signup page built using Node and other backend applications. It also uses personal API keys and authorization that is built using the MailChimp docs. Also, we save our request and then later on, we can use that constant request to send things over the Mailchimp server by calling req.write().

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published