Technical overview

Description

This document provides a high level overview of the various technologies we use to implement our solution for the Office of Natural Resources and Revenue.

Architecture

We use Directus, VueJs, PostgreSQL, and Cloud.gov as our architectural design framework. This provide us the ability to use a very modular approach to achieving some of our design goals such as:

• Easily update content via CMS
• Security
• Performance

Development environment

• VueJs - Static site generator and our development environment setup
• PostgreSQL - Provides the backend database that the CMS connects to
• CircleCI - Provides continuous integration, run tests, builds frontend application, deploys to cloud.gov
• Directus - Open source headless CMS

Frontend overview

• VueJs - Frontend of application
• VuetifyJs - UI Library with beautifully handcrafted Material Components
• Apollo Client - Connect to our backend graphql server
• Sass - CSS with super powers
• EditorJs - Open source customizable block style editor

API/Backend overview

• Directus - Provides Out of the box and custom API endpoints
• PostgresSql - Database
• Cloud.gov - Hosting solution

Testing overview

• Previews - User Acceptance testing, each code branch has a preview site generated
• ESLint - Code syntax and formatting
• Vue Testing Library Vue testing library
• puppeteer - End to End testing
• lighthouse - Performance and Accessibility testing

Frontend dev apps

• VS Code - Open source code editor
• Node.js - open-source, cross-platform JavaScript runtime environment
• NPM - node package manager
• Yarn - Uber hip package manager
• NVM - Node version manager
• Git - Open source version control
• Docker - Platform designed to help developers build, share, and run modern applications
• Spotify - All the music you'll ever need