Test Outcomes

• Apache

sudo apt-get install php-cgi libapache2-mod-php nodejs 
sudo apt-get install build-essential
sudo apt-get install npm gulp

• NPM

#Install PM2 - A process manager for Node.js applications
npm install -g pm2

• Clone the repository

  git clone https://github.com/kareemhb/cheque-writing-demo.git

• The repository was built on node v12.20.1. To avoid package version compatibility issues, change your nodeJS version to v12 if you are using a different version. You can do so by installing n https://github.com/tj/n

  npm install -g n
  n 12.20.1

• Install packages

  npm install

• Build, run and watch

  #start and the express seerver
  pm2 start server.js
  #build the code
  gulp build
  #run browserSync & watch (default gulp task)
  gulp

• Access the UI on http://localhost:3016

• Custom focus styling applied when the focus is initiated with an input device other than a mouse, such as a keyboard, for further assistance for users with visual impairment.

  Success Criterion 2.4.7

  No Focus

  

  Mouse Focus

  

  Keyboard Focus

  

• Uses WAI-ARIA labels and and adjusts their values in the DOM as the user interacts with the application.

  Success Criterion 1.3.1

• Accessibility checked and passed.

• 4 breakpoints; mobile, table, laptop & desktop.

• Responsive on all screen sizes with an identical experience on viewports as narrow as 200px.

Some global JS functions and CSS classes were built to mimic the extension and use of frameworks. These global structures include:

• SCSS mixins: /src/global_top/_scss/__global_sass/_mixin.scss

• SCSS loops: /src/global_top/_scss/_global_classes/icon_font/icons.scss

• A custom icon font using icomoon /dest/_global/fonts/icomoon

• A simple client-side input validation setup /src/global_top/js/form

/src/module/cheque/_outcome.php

• A simple server-side data validation process using PHP has been added to avoid DDoS attacks.

• The numbers are converted to text using the PHP class NumberFormatter

• Some adjustments have been added to improve the grammar and formatting of the output.

• Compile SCSS, group it into breakpoints, minify the CSS code and concat it into a single file.

• Transpile ES6 and churn out as widely supported "plain" JavaScript and uglify the code without removing licence notices in the JS files.

• Render pages from templates and minify HTML.

• Watch and inject SCSS edits and reload pages on JS and HTML edits.