Building bam-lambda.com using BAM!

bam-lambda.com

BAM! is a lightweight, serverless framework used to quickly build and deploy applications with Node.js and Amazon Web Services (AWS). We built BAM! to make it simpler for developers to launch AWS Lambdas that can be triggered by AWS API Gateway endpoints, which can be accomplished using the deploy command:

BAM! deploy command

We’d love for you to try out BAM!. Install the bam-lambda package globally with npm, and give it a test ride!

One of the many uses for lambdas integrated with endpoints is to serve static web pages. As such, it only made sense for us to use the framework we had just built to deploy a site for the BAM! white paper, which discusses the development of the project.

To start, we issued the command bam create bam, passing in the--html flag to create a local directory named “bam”, which contains the templated lambda file bam.js as well as HTML, CSS, and JavaScript files that can be accessed from the lambda code. This template has been optimized for this use case as you can see in the code below.

Instructional comments (such as those in the code above) can be included within any BAM! template by using the --verbose flag when issuing the create command. In addition to hints related to the specific template, these comments explain how to access query parameters, path parameters, and support different HTTP methods.

With those files in place, we fired up our favorite code editor and wrote the HTML, CSS, and JavaScript for the bam-lambda website. After the site was looking and functioning as we’d like, it was ready to be prepared for deployment. To do this, we replaced links to any local CSS and JavaScript files with placeholders, similar to what is shown in the code below.

For local stylesheets, a <style> tag was included in the appropriate place. For local JavaScript files, a <script> tag was used.

AWS exposes files within the zipped directory of the deployed lambda using process.env.LAMBDA_TASK_ROOT (line 12 above). This allows the contents of the HTML, CSS, and JavaScript files to be accessed. Within the lambda, said contents can be converted to a string using a promisified version of Node’s native readFile method with the utf8 option (line 13). These strings can be stored in local variables such as html, css, and js (lines 17–23).

Once the contents of the files have been converted to strings, the replacePlaceholder (lines 25–32) function can be used to, as its name suggests, replace the placeholders within the html string with <style> and <script> tags containing the appropriate text (lines 36–40). Setting the content-type of the response headers to text/html (line 9) will allow this string to be parsed as HTML and rendered correctly in a browser window.

Finally, we typed bam deploy bam and deployed our site!

Of course, we wanted to use a custom domain. Once our Lambda and API Gateway were in place, we followed these instructions to enable the endpoint to be called using bam-lambda.com.