Legacy system serverless implementation

Christopher Wavrin — Tue, 05 Mar 2024 02:06:05 +0000

I was recently on a project here at Lineate with a large publisher of education material. To produce more than 1,000 titles per year they generate an enormous amount of content for a series of Web sites and needed a fully functional content management tool that was available at all times. However, some of their websites publish only one or two times each year, so this complicated system was wasting their resources and time. We streamlined the tool by migrating the legacy Python content management application to pure AWS lambda functions. As a result, we simplified maintenance, eliminated the need for constant security patching of servers, freed up the time of both developers and systems engineers, and significantly reduced their hosting costs.

Previously, the application servers were running a small Python 2.x program that was used exclusively for content uploading and editing. The server resources needed for this application were not insignificant due to the nature of the editing workflow. New content was uploaded in bulk, so the servers had to have enough CPU and memory to handle these events without affecting the program’s performance.

Because they rarely used the content management tool, both development and maintenance of the application became unnecessary. We knew that we could leverage a modern serverless approach to create a simple but effective program that would better fit our client’s needs. We initiated a small project that migrated the Python 2.x application into a Python 3.x application consisting of about a dozen lambda functions (AWS lambda, to be specific). Our solution followed the common serverless approach of having each function do one thing—and one thing only.

Introducing lambda functions is not without some challenges. But with so much serverless development happening in the industry, new tools are available to alleviate the complexity. For example, it can be difficult to organize lambda code and, in this case, the AWS services needed to interact with the functions. Fortunately, AWS provides the Serverless Application Model (SAM) to help build an application that clearly expresses the desired functions, defines how the functions interact with APIs and databases, and describes the infrastructure required. SAM allows developers to follow infrastructure-as-code standards by including the AWS infrastructure along with the serverless functions in a single code repository.

There are alternatives to SAM. In our case, we were working with a relatively simple Python application, but larger projects may require a more robust solution. AWS offers several options, such as AWS Cloud Develpment Kit (CDK), which allows developers to define infrastructure using a variety of programming languages (Python, Typescript, Java, etc.). AWS describes infrastructure primarily with AWS CloudFormation templates, but they are often avoided because they can become unwieldy and contain a lot of hard-to-read boilerplate. Both SAM and CDK automatically generate the necessary Cloud Formation templates under the hood.

Another option is Terraform. Our team at Lineate has extensive experience using Terraform because many of our customers have large cloud infrastructures and often prefer a non-AWS-specific solution so they’ll have more options. Terraform is great even if you are only going to use AWS, but having Terraform provide your infrastructure allows for reusability in both hybrid and non-AWS-cloud services.

For our work with this customer, though, we felt that SAM was perfectly suited to our needs. SAM provided a remedy to another challenge we faced in cloud development—working with code locally. SAM allows for local testing of lambda functions, so we didn’t have to do a new deployment every time we wanted to try out a function. This sped up development dramatically. Not every AWS service can be tested locally so easily, but SAM provides ways for local code to interact with parts of the infrastructure in the cloud.

This project was successful on many fronts: Lineate saved our client a considerable amount of money because they no longer have to pay for rarely used resources. The codebase of the content tool is now more manageable because we built it using just a dozen single-function lambdas. And our developers loved working with this technology. A win for all.

Adding plugins to a Gridsome site

Christopher Wavrin — Fri, 07 Feb 2020 15:40:56 +0000

Gridsome is a great static site generator, written in Vue.js, to host websites. I have written before about why I chose Gridsome. I started this site with a great starter template, but wanted to add a few more features to it. Thankfully, the Gridsome community has a number of quality plugins to make this easy.

There are three features I wanted:

Google Analytics to track site visits
A sitemap.xml to help crawlers index the site
Disqus comments on each blog post

The first two - Google Analytics and a sitemap generator - have official Gridsome plugins. But for Disqus comments I will have to do a tiny extra, using a Vue.js plugin instead. One quick note: I'm using yarn instead of npm, so that's what you'll see below. The plugin pages have instructions for npm if that's how you do things. :)

Google Analytics

The @gridsome/plugin-google-analytics page makes this quite simple.

yarn add @gridsome/plugin-google-analytics

This adds the library to your packages.json file. Now you just need to copy/paste the code into your gridsome.config.js file.

module.exports = {
  plugins: [
    {
      use: '@gridsome/plugin-google-analytics',
      options: {
        id: 'UA-XXXXXXXXX-X'
      }
    }
  ]
}

Put your actual tracking ID in there and you are set. gridsome build is all you need before deploying this.

Sitemap

Following the instructions on the @gridsome/plugin-sitemap page: yarn add @gridsome/plugin-sitemap

You do need to make sure that your gridsome.config.js has a siteUrl set. The plugin example has some different configuration options, depending on your pages and url structure. Mine is pretty simple, as all I have are blog posts for the top directory. So my plugin code for my gridsome.config.js is:

module.exports = {
  plugins: [
    {
      use: '@gridsome/plugin-sitemap',
      options: {
        cacheTime: 600000, // default
        exclude: ['/exclude-me'],
        config: {
          '/*': {
            changefreq: 'weekly',
            priority: 0.5
          }
        }
      }
    }
  ]
}

I left the "exclude" part in, even though I don't currently use it. After you build your site, your sitemap should be available at /sitemap.xml You may not see it locally, but gridsome build and deploy that, and you should see it in production.

I would suggest using Google Webmasters to show Google exactly where your sitemap is. It will then tell you if you have any errors.

Disqus Comments

This one's just a bit tricker because there is not an official Gridsome plugin. You will have to use the vue-disqus component. Make sure to check the link for current instructions, but at this time:

npm install vue-disqus gets it into your package.json You will now need to install it in your Vue app. In your main.js you'll need to import it and then register it. Here is what my main.js looks like:

import '~/assets/style/index.scss'

import DefaultLayout from '~/layouts/Default.vue'

import VueDisqus from "vue-disqus";

export default function (Vue, { router, head, isClient }) {
  Vue.component('Layout', DefaultLayout);
  Vue.use(VueDisqus);
}

Finally, if you are going to use comments like I do - underneath each blog post - you would put the following code in your template:

  <div class="comments">
    <vue-disqus shortname="your_shortname_disqus" :identifier="page_id" url="http://example.com/path"></vue-disqus>
  </div>

Just add your short name from your Disqus account and the url of your site. And that's it.

Check all your work locally with gridsome develop. Once you confirm it all looks good, build again: gridsome build and deploy.

DEV Community: Christopher Wavrin

Legacy system serverless implementation

Adding plugins to a Gridsome site

Google Analytics

Sitemap

Disqus Comments