loading...
Cover image for Protect and Monitor Your Front End Application

Protect and Monitor Your Front End Application

danielnetzer profile image Daniel Netzer ・2 min read

Part two in a series about how to deploy a secured, monitored, optimized web application to AWS Amplify

In this part I will introduce Snyk the doberman, here to serve and protect your application from any package trying to oppose a security threat and the simplicity of integrating it as part of the deployment to AWS Amplify.

Now seriously what Snyk does is lots of amazing things, starting with detecting vulnerable dependencies during coding in your IDE to testing your running environment to verify there is no exposure to existing vulnerabilities and monitor for newly disclosed vulnerabilities.

Lease the Doberman

To get started, first we need an account on Snyk which offers a free tier.
Afterwards we'll go to our project root directory and install the Snyk cli.

npm i -g snyk, once installation is finished we need to authenticate with our account, snyk auth.

Now the entire Snyk options are in game, you can read about them here - https://snyk.io/docs/getting-started-with-our-cli/

I usually just let the Snyk wizard do the hard work for me using snyk wizard command and follow the steps.

Alt Text

Doggie, Sit!

So how do we utilise this great tool in our CI/CD?
We'll have to add a few lines to our amplify.yml in the postTest step if you have that test stage (I hope you do), or in the postBuild step.


lines 30, 35 (DEV.to doesn't know how to handle lines highlighting, sounds like the right PR 😏)

snyk test is pretty straightforward and will test and scan our package.json in a recursive manner and check that none of the packages is vulnerable and in case he detect a security issue he will fail our test phase.

snyk monitor will take a snapshot of the deployed packages and will monitor them on a daily basis unless we specify otherwise on the Snyk dashboard.

At Vonage we hooked the Snyk alerts into our internal systems such as Slack and once an issue comes up we address it immediately.

Man's Best Friend

Last but not least, source control management integration to test, review and monitor all of the repositories, notifying if anything found and creating a PR to update the package if a newer secured version is available using smart indexing to raise the minimum required version so no breaking changes will be introduced.

** Bonus fact: Snyk have a patching mechanism for unmaintained widely used packages which is part of their service, you can read about it more here

Part 1 - Enterprise Grade CI/CD For Frontend Applications

In the next post I'll review the logging services I use and enjoy as part of creating a solid front end application that is built to last.

Credits

The amazing cover photo is by Jen B on Unsplash

Posted on by:

danielnetzer profile

Daniel Netzer

@danielnetzer

Software engineer, super passionate about web technologies, ReactJS/Angular/Vue and everything between them.

Discussion

pic
Editor guide