Deploy a Web App on AWS Elastic Beanstalk

GETTING STARTED GUIDE

Module 1: Build a Web Application

In this module, we will create a NodeJS web application and run it locally.

Introduction

We will create a non-containerized application that we will deploy to the cloud. For this example, we are going to use NodeJS to build a web application.

The web application will be a simple web app server that will serve static HTML files and also have a REST API endpoint. The focus of this guide is not to teach you how to build web applications, so feel free to use the example application, or build your own one. While this guides focuses on using NodeJS, you can also build a similar web app with other Elastic Beanstalk supported programming languages, such as Java, .NET, NodeJS, PHP, Ruby, Python, Go, and Docker.

You can implement this in your local computer or in a AWS Cloud9 environment.

What You Will Learn

  • Develop a simple NodeJS web app that serves a HTML file and has a simple REST API
  • Run the application locally

 Time to Complete

10 minutes

 Module Prereqs

  • AWS Account with administrator-level access**
  • Recommended browser: The latest version of Chrome or Firefox

[**]Accounts created within the past 24 hours might not yet have access to the services required for this tutorial.

Implementation

Create the client app

The first step is to create a new directory for our application.

mkdir my_webapp
cd my_webapp

Then you can initialize the NodeJS project. This creates the package.json file that will contain all the definitions of your NodeJS application.

npm init -y

Create Express app

We are going to use Express as our web application framework. To use it, we need to install Express as a dependency in our NodeJS project.

npm install express

After running this command, you will see the dependency appear in the package.json file. Additionally, the node_modules directory and package-lock.json files are created.

Now you can create a new file called app.js. This file will contain the business logic for our NodeJS Express server will reside.

We are now ready to start adding some code. The first thing we need to add is the dependencies for the app - in this case, Express to allow using the module we previously installed, and then add the code to start up the web server. We will specify the web server to use port 8080, as that is what Elastic Beanstalk uses by default.

var express = require('express');
var app = express();
var fs = require('fs');
var port = 8080;

app.listen(port, function() {
  console.log('Server running at http://127.0.0.1:', port);
});

We can start up our application now, but it won't do anything yet as we have not defined any code to process requests.

Create a REST API

We will now add code to serve a response for a HTTP REST API call. To create our first API call, add the following code between the port definition, and where we start the server.

var express = require('express');
var app = express();
var fs = require('fs');
var port = 8080;

// New code
app.get('/test', function (req, res) {
    res.send('the REST endpoint test run!');
});


app.listen(port, function() {
  console.log('Server running at http://127.0.0.1:%s', port);
});

This is just to illustrate how to connect the /test endpoint to our code, you can add in a different response, or code that does something specific, but that is outside the scope of this guide.

Serve HTML content

Our Express NodeJS application can also serve a static web page. We need to create an HTML page to use as an example, let's create a file called index.html.

Inside this file, add the following HTML with a link to the REST endpoint we created earlier to show how it connects to the backend.

<html>
    <head>
        <title>Elastic Beanstalk App</title>
    </head>

    <body>
        <h1>Welcome to the demo for ElasticBeanstalk</h1>
        <a href="/test">Call the test API</a>
    </body>
</html>

To serve this HTML page from our Express server, we need to add some more code to render the / path when it is called. To do this, add the following code above the /test call:

app.get('/', function (req, res) {
    html = fs.readFileSync('index.html');
    res.writeHead(200);
    res.write(html);
    res.end();
});

This code will serve the index.html file whenever a request for the root of the app (/) is made.

Running the code locally

We are now ready to run our application and test if it is working locally. To do this, we are going to update package.json with a script to make it easier to run. In the package.json file, replace the scripts section with:

"scripts": {
    "start": "node app.js"
  },

Now you can go to your terminal and run:

npm start

This will start a local server with the URL http://127.0.0.1:8080 or http://localhost:8080.

When you paste this URL in your browser, you should see the following:

gsg_build_elb_1

To stop the server, use ctrl + c to stop the process in your terminal where you ran npm start

Conclusion

In this first module, we built a very basic NodeJS application and ran it locally to ensure it works. In the next module, we will learn how to create the infrastructure using the AWS CDK to run it on AWS Elastic Beanstalk.

Up Next: Create Infrastructure

Let us know how we did.

Thank you for your feedback
We're glad this page helped you. Would you like to share additional details to help us continue to improve?
Close
Thank you for your feedback
We're sorry this page didn't help you. Would you like to share additional details to help us continue to improve?
Close