Jet
BuyFollow on X
  • Home
  • Satisfied Requirements
  • License
  • Architecture
    • Overview
    • Internal Dependency Graph
    • External Dependencies
    • Conventions
  • Recipes
    • Get Started
    • Add a Page
    • Customise Fonts
    • Customise Icons
    • Customise Languages
    • Customise Themes
    • Add an Environment Variable
  • Classes
    • Jet Mat Paginator Intl
    • Transloco HTTP Loader
  • Components
    • App Component
    • Footer Component
    • Home Page Component
    • Message Page Component
    • Not Found Page Component
    • Page Component
    • Profile Page Component
    • Reset Password Page Component
    • Settings Page Component
    • Sign In Page Component
    • Sign Out Page Component
    • Sign Up Page Component
    • Update Password Page Component
  • Constants
    • Color Scheme Options
    • Default Color Scheme Option
    • Default Language Option
    • Default Settings
    • Language Options
    • Navigation Menu Items
  • Directives
    • Analytics Directive
  • Enums
    • Bucket
    • LocalStorage Key
    • Query Param
    • SessionStorage Key
    • Table
  • Guards
    • Is Authenticated
    • Is Not Authenticated
  • Interfaces
    • Color Scheme Option
    • Language Option
    • Navigation Menu Item
    • Profile
    • Progress Bar Configuration
    • Settings
  • Services
    • Alert Service
    • Analytics Service
    • Logger Service
    • Profile Service
    • Progress Bar Service
    • Service Worker Service
    • Settings Service
    • Storage Service
    • Supabase Service
    • Toolbar Title Service
    • User Service
  • Types
    • Available Color Scheme
    • Available Font
    • Available Language
    • Available OAuth Provider
Powered by GitBook
On this page
  • Functional Requirements
  • Non-Functional Requirements

Was this helpful?

Satisfied Requirements

PreviousHomeNextLicense

Last updated 4 months ago

Was this helpful?

Jet satisfies several functional and non-functional requirements. It saves hours of development, decision-making and documentation reading.

See it live: Jet is live on so you can validate these requirements yourself, on a device of your choice.

Functional Requirements

Accessibility

  1. As a user, I want the app to be navigable by a keyboard

  2. As a user, I want the app to be navigable by a screen reader

Customization

  1. As a user, I want to change the language of the app

  2. As a user, I want the app to load in the language I selected previously

  3. As a user, I want to change the theme of the app

  4. As a user, I want the app to load in the theme I selected previously

  5. As a user, I want the app to follow my OS' theme, until I set otherwise

PWA

  1. As a user, I want to add the app to my device as a standalone PWA

  2. As an Android user, I want a maskable icon for the PWA

  3. As an iOS user, I want an opaque icon for the PWA

  4. As a user, I want the PWA to utilize the entire viewport of my device (i.e. wrap around notches)

  5. As a user, I want to reload the PWA

  6. As a user, I want to reset the PWA

  7. As a user, I want the PWA to work even if I'm offline

UX

  1. As a user, I want to navigate to Home on navigating to an invalid route

  2. As a user, I want to navigate to Home on clicking the logo

  3. As a user, I want to see a bottom navigation instead of side navigation on smaller devices

  4. As an iOS user, I want to tap the top of the screen to scroll to top

  5. As a user, I want zoom to be enabled in the browser but disabled when I add it as a PWA

  6. As a user, I want the app and the PWA to handle notches in any orientation

  7. As a user, I want to see the version number of the app

  8. As a user, I want the scroll position restored when I go back to a page

  9. As a user, I want to scroll to an element if its ID is specified in the link

  10. As a user, I want the app to automatically scroll to a section if the link contains its ID

  11. As a user, I want a uniform timeout for all alerts

  12. As a user, I want a uniform delay in the hover tooltips, so they aren't intrusive

  13. As a user, if a route is protected, I want to be taken to login automatically

  14. As a user, I want to continue on the same route after logging in

  15. As a user, I want to see a Logout button if I'm logged in and vice-versa

Non-Functional Requirements

Customizable

  1. As a developer, I want to use different fonts with different languages, so a font that supports the language's characters can be used

Efficient

  1. As a developer, I want an interactive commit process, so writing acceptable commit messages is easy

  2. As a developer, I want automatic changelog generation, to minimize work

  3. As a developer, I want automatic release PR creation with updated version in package.json, to minimize work

  4. As a developer, I want automatic commit message linting, to minimize work

  5. As a developer, I want automatic formatting of staged changes when I commit, to minimize work

  6. As a developer, I want automatic activation of hooks on installing the dependencies, to run other automation

  7. As a developer, I want a script to determine the test coverage, so a threshold can be maintained

  8. As a developer, I want a shared IDE configuration, so collaboration with others is easy

  9. As a developer, I want to reuse Angular Material component and typography styles to reduce bloat

  10. As a developer, I want automatic injection of environment variables into the app during build time

Extensible

  1. As a developer, I want a service to manage alerts, so any element can send alerts

  2. As a developer, I want a service to hide or show the app progress bar, so any element can indicate progress

  3. As a developer, I want a service to change the toolbar title, so any element can update it

  4. As a developer, I want a service to manage authentication state

  5. As a developer, I want to update the page meta dynamically

Interoperable

  1. As a developer, I want a robots.txt file, so it can be used by crawlers

  2. As a developer, I want a sitemap.xml file, so it can be used by crawlers

  3. As a developer, I want to correctly set the lang attribute of the html element, so the browser can show relevant tools to work with that language

  4. As a developer, I want users to see a title and description when they share a link to the app, to give recipients some context

  5. As a user, I want to see a preview image when I share a link to the app, to improve the link's visibility

Maintainable

  1. As a developer, I want translations to be sorted and logically grouped, so maintaining them is easy

  2. As a developer, I want a script to detect missing and unused translation keys, so translations remain up to date with the code

  3. As a developer, I to lint commit messages, so they are descriptive and uniform

  4. As a developer, I want to attribute commit messages to features, so generating changelog is easy

  5. As a developer, I want the code to be formatted in a standard way, to improve readability

  6. As a developer, I want a script to lint the code, so runtime errors are minimized

  7. As a developer, I want a script to update all dependencies, so updates can be integrated regularly

  8. As a developer, I want strict lint rules, so the code is uniform and runtime errors are minimized

  9. As a developer, I want to log all class initialization during development, so I can trace issues easily

  10. As a developer, I want a typed enum to manage all storage keys, so client storage is manageable

  11. As a developer, I want issues to be created in a certain format, so collaboration is easy

  12. As a developer, I want bundle size information on every PR, so managing it is possible

Portable

  1. As a developer, I want strings to be isolated from the code, so adding a new translation is easy

  2. As a developer, I want to pass variables to translations, so it can be used as per the language's grammar

  3. As a developer, I want support for multiple fonts, so the appropriate font for a language can be loaded

  4. As a developer, I want support for RTL layout, RTL languages can be supported

  5. As a developer, I want environment files to keep keys and configuration separate from the app

Performant

  1. As a developer, I want only necessary styles to be generated, so there are no unused styles sent to the user

  2. As a developer, I want to pre-connect to certain domains to download important assets faster

  3. As a developer, I don't want to listen to viewport and settings changes to minimize listeners

  4. As a developer, I want minimum custom CSS, so the unused CSS is not shipped to users

Robust

  1. As a developer, I want to cache all assets including fonts and translations, so they are available even when the app is offline

  2. As a developer, I want to load the default translation if the selected translation is unavailable

  3. As a developer, I want to load the translation keys if the default translation is unavailable

  4. As a developer, I want to safely set and get items from storage, so the app doesn't crash during unexpected data issues

Secure

  1. As a developer, I want to set CSP (Content Security Policy) rules, so only explicitly allowed elements are loaded by the browser

  2. As a developer, I want to prevent any handled errors from showing in production console, so users aren't readily able to identify and abuse errors

  3. As a developer, I want to protect certain routes behind a login

Testable

  1. As a developer, I want mocks of all services, so I can test other elements in isolation

  2. As a developer, I want feature-flag tokens, so I can override them during testing

  3. As a developer, I want to log all class initialization during development, so I can detect potential problems and memory leaks

  4. As a developer, I want logs of different priorities logged differently, so I can adjust the console filters as per my needs

As a developer, I want to version the app using , so others can depend on it confidently

As a developer, I want strict , so the code is uniform and runtime errors are minimized

As a developer, I want imports using , so refactoring is easy

semantic versioning
TSConfig Type Checking rules
TSConfig Paths
https://jet-tau.vercel.app
Jet works offline as a PWA
Jet works offline as a PWA
Notch handling in portrait mode
Notch handling in portrait mode
Notch handling in landscape mode
Notch handling in landscape mode
Jet live on https://jet-tau.vercel.app
Jet live on
Jet passes the No Unused CSS and JS test on PageSpeed Insights
Jet passes the No Unused CSS and JS test on
Jet's PageSpeed Insights (Desktop)
Jet's
https://jet-tau.vercel.app
PageSpeed Insights
PageSpeed Insights (Desktop)