jerrolkrause / du Goto Github PK

Home Page: https://jerrolkrause.github.io/du/

License: MIT License

Batchfile 0.14% TypeScript 42.10% HTML 7.38% JavaScript 2.04% SCSS 48.34%

du's Introduction

Angular Starter

A rapid starter project for creating Angular single page apps. Contains Angular, ngPrime, Akita and more. Built with Angular CLI.

Quick Start

# Open a terminal/command and navigate to the directory where the starter is needed

# Clone the latest
git clone https://github.com/ntersol/angular-starter.git

# Rename the directory
ren angular-starter MY_APP_NAME

# Navigate into the newly renamed directory
cd MY_APP_NAME

# Install the repo with npm
npm i

# Start the app
ng serve

Usage

# Serve dev on http://localhost:4200/
ng serve

# Serve dev on http://localhost:4200/ with hot module reloading
npm run start

# Prod Build for targeted environment. Files will appear in the dist folder
npm run build:qa # Uses settings from environment.qa.ts
npm run build:uat # Uses settings from environment.uat.ts
npm run build:prod # Uses settings from environment.prod.ts

# Serve prod build from dist folder at http://127.0.0.1:8080/#/.
# Requires http server which can be installed with `npm install http-server -g`
npm run prod

# Run prettier which will format the code in the entire project. It is better to use the prettier extension which formats on save.
npm run format

# Run prod build and then use webpack bundle analyzer to check bundle sizes and composition
# Documentation located in /documentation/
npm run build:stats

# Automatically generate documentation
npm run docs

# Run e2e protractor tests
ng e2e

# Run e2e protractor tests without rebuilding every time (faster)
ng e2e --s false

# Update NPM dependencies via Angular CLI
ng update

# Deploy dist folder to git pages. Be sure to update deploy script in package.json
npm run deploy

# Deploy dist folder to git pages with prerendered pages
1. Add "baseHref": "/angular-starter/", to angular.json in projects>angular-starter>architect>build>options
2. Run "npm run deploy:ssr"
3. Remove update from #1. Prerender does not (yet) support the --base-href prop in the build command

# Angular Universal/SSR Commands
npm run ssr:dev # Run SSR locally for development purposes
npm run ssr:build # Create an SSR prod build
npm run ssr:serve # Serve SSR prod build with express. This is the command needed to run on the server.

Localizing Your App

package.json

If using github pages, update the npm run deploy command in this file to include the correct slug. IE replace /angular-starter/ with your url

src > environments > defaults.ts + src > environments > environment.prod.ts

Localize environment settings and properties in these files. Enable/disable app functionality as needed

src > app > shared > app.settings.ts

Add/change global app & environment variables

src > index.html

Update any header changes to the html in this file. IE logo, navigation, etc

src > manifest.json

Change the site info in this file to be specific to your app. Make sure the start Url property matches your production URL

src > assets > icons

Change these icons to ones for your app

src > apple-touch-icon + favicon.ico + safari-pinned-tab.svg

Change these icons to ones for your app

src > ngsw-config.json

Update any dependencies needed for the service worker. Use asset groups for site resources & use dataGroups for API calls

Useful Tools

VSCode Tools

Useful Info

Lazy load libraries. Normally libraries that are shared between lazy loaded routes are all bundled into a single master bundle. This approach will bundle them separately.

See https://github.com/ntersol/angular-starter/blob/main/src/app/components/components.lazy.ts for how to lazy load both internal components/modules and 3rd party libraries.

du's People

Contributors

Watchers

du's Issues

As a user I would like to be able to verify my identity

Create the "Verify Identity / Gateway" page with one dummy 3rd party service (provided from server)
Add a link to manually verify
Create manual verification that look like the income verification document sector (do not customize beyond that for now)

Out of scope:

Onetime Password screens (See Issue #14)
Custom file upload screen that has DL picture and "Front/Back" text

As a user uploading drivers license documents I would like the flow to match the design

Should have a mock path for uploading the front and back of a drivers license with the updated UI

As a user I would like to see the first page of the Verify Vehicle Info Manual flow

Create a list of verifications required by the server.
When clicking on a verification go to the upload photo page (internally maybe this should check off the verification button).

As a user I would like to be able to start the Verify Vehicle Information Journey

This should bring me to the screen labeled "Verify Vehicle Info / Primer"
Should include everything on the design for this screen. Add tool tips for the "VIN" link and the "Proof of Ownership" links

As a user I would like to be able to upload my documents in the manual income verification flow

Make document uploader work
Include Action Required scenario
Include Multiple Documents scenerio
Include some sort of success flow (redirect or message or something if not in design)

As an engineer I would like asset URL's to work locally

And manually work when deployed

As a User I'd like to be able to see the Verifications Dashboard for a specific loan

Build enough to see the "Verifications Dashboard" screen in the Figma file - https://www.figma.com/design/IB5QRoS9xKNTRS8GFoescL/Exploration?node-id=0-1&m=dev

Should include the following:

A route with the loan ID in int
Display the loan ID
Display a back button
Display the "Sign Out" button
Display logged users first name
Display number tasks to complete
Display the a list of tasks
Display the "Help card"
Include brand colors, fonts, logos, etc

As a user I would like to see a "Sign Out" link in the header

Remove items behind the hamburger menu
Replace the hamburger menu with a "Sign Out" link

Not sure where "Sign Out" should go for now

This is a ow priority "story" as the stuff that needs to be removed is still useful as a reference for a while longer

As a user I would like to have have a OTP step before verification

Build the OTP pages
Accept any 6 digits
Just give a message for "Resend My Code" that the code was sent
Once they click "Answer questions", use that button as a flag to not prompt for OTP again till refresh; forward to verification gateway

As a user I would like to be able to verify my income

Create the "Verify Income" "Gateway" screen with dynamic 3rd party service providers (skip to manual if none are given)
Create manual income verification up to file uploader
Requests Verifications should come from the server

As a User I'd like to see a "Loan Dashboard" that lists all my loan products

Build enough to see the "Loan Dashboard" screen in the Figma file - https://www.figma.com/design/IB5QRoS9xKNTRS8GFoescL/Exploration?node-id=0-1&m=dev