72h Skyscraper - CM - MT Limit Setup - Angular Prototype

Challenge Overview

Welcome to the Topcoder Skyscraper Challenge Series! We are looking for amazing front end developers to jump into our new challenge series focused on rapid Angular 9 development. WIN big being part of the Skyscraper development team.

 

We are looking at a continuous series of Topcoder Angular Challenges until the end of 2020 with minimal development activity as Skyscrapers major application components have already been developed. Jump in to enjoy weekly prizes and enough work for parallel challenges. You will experience a clear workflow with detailed specifications, designs and a great Topcoder team looking forward to working with you.

 

1. Project Context:

Create an angular prototype for the provided design.  

2. Expected Outcome:

An angular prototype for the provided design.

3. Challenge Details

INDIVIDUAL REQUIREMENTS

We have created the prototype in the previous challenges. Now we would like to extend the prototype to add some new screens/pages. The tables in the new screens are already developed in the current codebase, you should reuse it in your implementation. 

 

Here is the design for which will cover the following user stories (refer to screens #4 - 19): https://xd.adobe.com/view/92b2c3e7-6e29-4367-8ce9-95c57aad9b4f-c7e1/grid

• Navigation (screen 4)

  • A new menu icon and 3 sub-menus are to be implemented, but only MT Limit Setup menu is in the scope of this challenge

• CM-326 (Modify via GUI, screens #11 - 18)

• CM-327 (Modify via file upload, screens #19)

  • Uploading a file will import the data into the UI as shown in screen 19, then the rest is the same as Modify via GUI

• CM-328 (Query, screens #6 - 9)

 

You need to follow the key points noted below:

• The cover screens are not needed.

• The acceptance criteria documents and other documents are provided in the forum.

• Please create a new sub-folder for these screens and put all its pages inside this sub-folder. It is also required to put all page specific components inside the sub-folder of the page.

• For the tables in the design, please follow the existing table style in the current code.

• Note that the existing code style should be followed, it should have no lint error and it should define interfaces properly, etc.

• Please define reasonable APIs instead of using a large JSON file.

• There should be no errors with the production build.

GENERAL REQUIREMENTS

• Make sure the code best practice is followed: https://angular.io/guide/styleguide

• Secured Coding Guideline:

  • Make sure the used libraries have no vulnerabilities

  • Should avoid XSS attack

TECHOLOGY STACK

• Angular 9

• All Browsers should be supported (Chrome, Firefox, Safari, Edge and IE11)

Final Submission Guidelines

Please submit a single zip file containing the updated source code along with the following:

• Verification guide

• Change log (new components, pages, services, etc. added or updated)