Building bam-lambda.com using BAM!

Jason Overby
Jan 3, 2019 · 3 min read
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.

bam-lambda

a lightweight serverless framework for humans

Medium is an open platform where 170 million readers come to find insightful and dynamic thinking. Here, expert and undiscovered voices alike dive into the heart of any topic and bring new ideas to the surface. Learn more

Follow the writers, publications, and topics that matter to you, and you’ll see them on your homepage and in your inbox. Explore

If you have a story to tell, knowledge to share, or a perspective to offer — welcome home. It’s easy and free to post your thinking on any topic. Write on Medium

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store