Stellar 2021 Test Project - Frontend Developer

Task Management - Edit Task

Overview

Here are the following requirements for this takehome project.

1. Project Summary

Please provide me a summary of how you would implement the test project to:

demonstrate your understanding of the requirements.

2. Project Estimate

Please also provide an estimate (in number of hours)

broking down how you see fit to allocate the time you would anticipate requiring in order to complete each core aspect and,
recognizing that unit tests are one such core aspect.

Remember, you do not need to actually complete the test project, just the aforementioned summary and estimates.

3. Final Interview

After I receive and review your summary and estimates, I will shoot you a Calendly link to schedule a final interview to review the information you put together.

Overview
Table of Contents
1. Purpose
2. Definitions
3. Project Summary
4. Project Management Estimates
- Purpose
- Scope management
4.1 Initial High-Level Timeline
- 4.2 Cost - Benefit Analysis
  - 4.2.1 Project Estimate Question Guide
  - Schedule and budget management

1. Purpose

The purpose of this document is to provide an overview of the project. This includes the scope, objectives, high-level project approach and requirements, as well as benefits and a high-level cost estimate.

2. Definitions

The following additional terms and abbreviations are used in this document.

Term	Definition
BA	Business Area
CM	Change management
CR	Change Request
FDS	Functional Design Specification
PM	Project Manager
PMM	Project Management Methodology
SOPs	Standard Operating Procedure
WIs	Work Instructions
Rfi	Request for Information
RfP	Request for Proposal
TM	Task Management
TMM	Task Management Module
TMET	Task Management Edit Task
TMS	Task Management Software

3. Project Summary

The purpose of thie project is to provide a cost effective and user friendly TMS that allows the business to plan, track and manage their tasks efficiently and transparently.

There is an articulated need from the BAs for a TMET screen that forms part of a larger TMM. This "Edit Task" screen should provide a means to open the edit task screen for each task by way of an unformatted list of tasks.

3.1 Business Needs

The business has identified a series of needs that the TMET project must fulfill.

Support proactive task management planning and global operations of Stellar IMS
Imporve oversight of and maintain the knowledge from task management activities across business areas.
Improve transparency of task creation, and relationship management via the following functional specifications:
1. Audit Logs
2. Editable Fields
3. Requestor Fields
4. Associated Record Fields
5. Category Fields

3.2 Objectives

The objectives of the Stellar 2021 Test Project - Front End Developer project is to:

Plan. Implement a standard Task Management - Edit Task (TMET) screen according to the technical requirements illustrating various functions defined in the functional specifications
Milestones. Align the Task Management - Edit Task screen processes across all major phases in the software development lifecycle
Dependencies. List all key dependencies/technical requirements and what their importance is to the project.
Resource Plan. Provide a resource plan with a breakdown estimate of labor (in hours)

3.3 Scope

The scope section specifies the boundaries for the project both in terms of processes, functionality and user groups.

Changes to any of those areas will require a change request approved by the Steering Committee

3.3.1 In Scope

FUNCTIONAL SPECIFICATIONS

Epic: I can use an Edit Tasks page to edit tasks and view an audit log that shows all previously made edits to tasks. Stories:

Function Spec Task	Description
1. Audit Log	The audit log will display all changes that are made to a task using a `[Timestamp]` `[Who]` changed `[Field]` from `[Old Value]` to `[New Value]` format. If no changes have been made the audit log will display a message stating, “No changes have been made.”
2. Editable Fields	Ability to make changes to all fields on a task including, but not limited to: Creator, Requestor Type (defaults to Customer, dropdown also shows Internal), Requestor (see #3), Department, Status, Category (see #5), Requested By Date, Requested By Time, Due Date, Due Time, and Associated Record (see #4). Use the attached “Add Task” and “Edit Task” visuals for the template of the edit screen and full list of fields and functions required. All task fields should be editable. Refer to the stories 3, 4, and 5 for information on the set up of the Requestor, Associated Record, and Category fields respectively.
3. Requestor Field	When editing the Requestor field, if the Requestor Type is set to Internal, they are presented with a list of all employees/back end users. From the Requestor menu, I can search by any or all of the following fields: Customer ID, First Name, Last Name, Slip and/or Boat. When the user searches via one or more of these fields, they are presented with an autocomplete list of possible choices. These choices will display one option per boat per customer record, and will display the Customer ID, First Name, Last Name, Slip, and Boat. If there is no boat associated with a customer record, the boat field will appear as N/A. Use the attached Add Task visuals to determine the layout of the requestor field as well as the set-up of the auto complete dropdown.
4. Associated Record Field	When editing the Associated Record field, they can select records from other modules that can be attached to the task they are currently editing. This will appear as an auto-complete drop down that provides them with options for records they can associate the task with.
5. Category Field	When editing the Category field, a dropdown appears that lists all the Categories and any Categories with sub-categories (or categories that are of a lower hierarchy) can be found through an additional dropdown. Within each sub-category, any sub-categories that have more sub-categories of a lower hierarchy can be accessed via more dropdowns, so on and so forth, until you reach a sub-category with no sub- categories of a lower hierarchy. Users can then select the Category from the dropdown at the lowest hierarchy or Other at any level the hierarchy. At the bottom of all dropdowns is an Other option that will be hard-coded and not presented as an option via JSON/the backend.

3.3.2 Out of Scope

No header, footer or menu is required; simply the edit task screen itself.
Effectively demonstrate your ability to match the visuals provided alongside all documented frontend functionality,
Recognize that no backend, i.e. server-side development, is required for this test project.
Remember that this test project is specifically the Edit screen, not the main screen, however a means to open the Edit screen for each task in an unformatted list of tasks is required.

3.4 Workflow

This workflow is divided into five core processes:

Initiation:
- Ideation and evaluation,
- Project Charter
Planning:
- Work Breakdown Structure (WBS)
- Functional Specification Consulting
Build / Implementation / Execution
- product design,
- product development,
  1. Backend Development
  2. Frontend Web Development
  3. Mobile Application Development
  4. Infrastructure Management
- product test
Control:
- Project maintenance & Support
- Process
- Software
- Team
Deploy / Closeout:
- Audit

3.5 Project Approach

The implementation will start in February 2021 with a planned go-live for March 2021, followed by a 3 month iterative process that incorporates customer participation for the purpose of:

functionality prioritization,
getting user feedback ASAP, and
ensuring we build exactly what the client wants.

The project will follow the PMM System Route (agile)

3.5.1 Project Methodology (PMM)

Process Scope

Stage 1: Backend Development

Start from engineering the application backend. Stellar IMS web developers create the application and database architecture, business logic, and interfaces. To ensure code quality, our team lead and other developers on the team perform a code review.

No backend, frontend only

Backend Development Toolkit

Programming languages:
- Node.js
web application frameworks
- Express.js
Business logic framework:
- Trailblazer
Testing frameworks:
- Jest
- RSpec
Data stores (RESTful and JSON objects/arrays)
- static .json files only
- All data should be dummy and self-explanatory of what the data represents,
  - view/edit a name: “John Smith”, or associated record/ “Module 1 – Record 7",
  - view/edit an associated record as a link: “/[module]/edit/[id]”
- SCRUD (Search, Create, Read, Update, Delete) implementation
  - Record searches via GET/POST (POST due to size limitations on GET requests)
  - Record creation via POST
  - Record reads via GET
  - Record update via PUT
  - Record deletions via DELETE
  - All auto-completes, searches, etc should make use use of the record search capability.
Future API endpoints/backends
- TODO: API endpoints action plan to implement a real database
- PostgreSQL
- MySQL
- Redis
- Memcached
- MongoDB
- Cassandra
- Neo4j
- ElasticSearch

Stage 2: Frontend web development

After the backend is ready, our frontend developers work in close cooperation with our UX designers to create the client side of the application. An emphasis on building a robust Edit Task screen user interface that is responsive, and mobile-friendly.

Web frontend development toolkit

Programming Languages:
- SASS
- CSS3
- JavaScript
Frameworks and libraries
- React.js
- Redux
- ContextAPI
- Bootstrap 4
- Reactstrap
- Font Awesome
- React-Bootstrap-Table2
Testing Tools:
- Jest
- Enzyme
REST Clients:
- Axios
- Fetch
- Formik
- Yup
GraphQL Clients:
- Apollo Client

Stage 3: Mobile app development

Our iOS and Android app developers create custom mobile applications for our clients who want to reach their customers on mobile devices. We use native technologies to build mobile apps and also provide cross-platform mobile application development with React Native.

Mobile development toolkit

Programming languages
- Swift
- Objective-C
- Kotlin
- Java
- JavaScript
- Typescript
Testing tools
- Quick
- Nimble
- JUnit
- RoboElectric
- Espresso
Libraries
- React.js
- Redux
- ContextAPI
Testing frameworks
- Jest
- Enzyme
IDE
- Xcode
- Android Studio

Stage 4: Infrastructure management

At Stellar IMS, we configure a reliable, scalable, and secure cloud-based application infrastructure. Software configuration tools allow us to automate infrastructure management and reduce maintenance costs, while performance monitoring services notify our team about errors and crashes.

DevOps toolkit

Cloud hosting platforms
- AWS
- Heroku
Configuration management tools
- Chef
- Teraform
Containerization tool
- Docker
Container orchestration system
- Kubernetes
Software monitoring services
- NewRelic
- Airbrake
- Monit
Continuous integration services
- CircleCI
- TravisCI

4. Project Management Estimates

Proper control and well-structured processes can prevent low-quality results, never-ending projects, going over budget, and late delivery.

Purpose

Project Management is responsible for the successful delivery of projects from the initiation stage through final delivery. Project management duties include the monitoring of each project on a daily basis and respond to all emerging issues.

Scope management

Our PMO refines, validates, and manages the scope of the project. The team defines all tasks and breaks down complex activities into smaller manageable ones.

What you get

Work breakdown structure (WBS)

A work breakdown structure (WBS) provides a visual representation of all tasks and lays the foundation for time and money estimates.

4.1 Initial High-Level Timeline

The timetable for the project is shown in the following section

4.2 Cost - Benefit Analysis

The Cost-Benefit Analysis consists of the project cost and expenses until its go-live date, including some post-implementation expenses. In addition, the post-implementation savings and ongoing costs are juxtaposed.

Cost / benefit calculated with currency: $USD

4.2.1 Project Estimate Question Guide

Whether you’re estimating a project based on a formal request, a discussion, or an email from a stakeholder or manager, you need to know as many project details as possible before you can provide a realistic estimate of time or cost.

Schedule and budget management

Our PMO facilitates the estimation process. Our project managers collect estimates from the development team and experts and measure risks. They develop and maintain schedule and cost management plans to keep the project within your budget and time limits.

What you get

Work performance report A work performance report describes updates on the progress of your project. This report shows where the project stands in terms of the planned schedule and budget.

fredsiika/stellar-test-project