Challenge Overview
Welcome to Merlin Query Builder - Dashboard Page contest. We will be creating the UI prototype for an app as part of this contest.
Project Overview
Our app allows users to query a database without the need to write a SQL statement. Users can specify the sql query parameters and execute the query to get the results. The manner in which the sql query parameters are specified is through a simple form which adheres to certain business rules.
Contest Details
We ran a contest to prepare the design for our app. Now that it’s ready, we wish to implement the designs as a prototype. We want you to implement the user interface using Angular (please use version 6).
The user interface is straightforward and most of the elements are self explanatory. However, we have lots of business logic for this app that you need to implement which determines which fields are shown and what values these fields will contain.
After registration, we will share a document with you in the contest forum that will go into the details of this business logic. It will also contain information on the design and screens in scope for this contest. Additionally, you need to implement a guiding tour for the dashboard page using Introjs
Points To Note
-
The width of the pages is fluid. It will expand and contract based on the screen size and occupy full width. You need to support a width of 1366px and above.
-
You need to use version 6 of Angular and create the app using Angular CLI.
-
The screens need to work on IE11, latest Edge, Google Chrome and Firefox browsers for desktop. Only Desktop is in scope. No mobile or tablet versions exist.
-
You are expected to follow best practices in Angular development
-
Use texts wherever possible. Images are only for icons and logos.
-
Ensure your submission has no lint errors
-
You are not required to store any dynamic data or retrieve data during runtime. All the text will be static. The only requirement is the implementation of the business logic which will be shared in the contest forum.
-
You can use twitter bootstrap. You need not customize the theme and can use bootstrap classes as you see fit.