atlan-task

Task for Atlan interview

Overview

This application allows you to create, seed & see data using a subset of MySQL compatible SQL queries. It actually seeds a real-looking database in your browser using IndexedDB. Only supports SELECT queries. I planned to add UPDATE, INSERT and DELETE but I timeboxed the task to 16 hours and this is where I got.

Framework & Libraries

• vue v3.2.38 - Rendering of the UI & Reactivity system
  • vue-router v4.1.5 - Routing system
  • @vueuse/core v9.2.0 - Utility composables
  • vue-prism-editor v2.0.0-alpha.2 - Prism.js wrapper
    • prismjs v1.29.0 - Prism.js code editor
  • vue-virtual-scroller v2.0.0-alpha.1 - Virtual scroll implementation
• dexie v3.2.2 - IndexedDB Wrapper
• @faker-js/faker v7.5.0 - Fake data to seed the databases
• lodash v4.17.21 - Utility collection (used only for array sorting)
• node-sql-parser v4.5.0 - AST parser for SQL

VSCode + Volar (and disable Vetur) + TypeScript Vue Plugin (Volar) for amazing development exeprience.

Performance & Optimization

I have not tested the performance in any way, I only optimize if-needed and in this particular POC there were performance issues with big data tables and I used virtualized-list to reduce number of DOM nodes rendered which resulted in "snappy" feeling performance across the board. No other performance issues were noticed.

Project Setup

pnpm install

Compile and Hot-Reload for Development

pnpm dev

Type-Check, Compile and Minify for Production

pnpm build

Lint with ESLint

pnpm lint