JavaScript Ecosystem and Repository Tools

Introduction

This page acts as a quick introduction to some of the stuff you might see in the repo.

TypeScript

An extension of JS that adds static typing. Compiles to normal JS to work in the browser.

React

A JS framework. Browsers have a DOM, or document object model, which essentially represents the HTML structure of a webpage. React works by using a Virtual DOM, another DOM that we can easily manipulate using JavaScript. React then updates the real DOM based on what changes happened to the virtual DOM.

NPM

Node Package Manager. We use NPM to install libraries and 3rd party code.

Yarn

Another package manager similar to NPM, made by Facebook.

Package and Package-lock

Files that describe our project. Contains all the dependencies we use, and all of their dependencies. Also includes scripts. Scripts can be executed with npm run scriptname. We make scripts to automate parts of development, building and deployment.

Node_Modules

Where all our packages are installed.

Lerna

A system used to manage monorepos, where we have one repository contrived of several packages.

Husky

A system used to ensure that code being committed and pushed is of minimum acceptable quality (i.e. it compiles).

Firebase

A cloud service provider. Where our website and services (i.e. auth) is hosted.

Tailwind

A CSS framework that generates large numbers of CSS classes that make it easy to apply CSS styling. Recommend installing the tailwind VS Code extension.

Github Workflows

Inside the .github folder contains various files related to the github hosted repository. The workflows folder provide a list of instructions that can run on various events, such as making a PR or merging a PR. These will be used to build the PR changes and ensure they compile and work fine, as well as ensure code styling.

Openapi-typescript

Convert OpenAPI 3.0 and 2.0 (Swagger) schemas to TypeScript interfaces using Node.js.

Docker

Docker is used to setting up the dev environment and running the test. Containerize the application could help us to ensure that each of us has all the dependencies we need and running/deploy on multiple different machines