Scribd
Upload
2 views

React + TypeScript Assignment

The assignment involves creating a frontend web application for Trading Studio, an online platform for developing and backtesting trading strategies using React and TypeScript. Users can create, save, submit, and track strategies through various stages including Scanner, Buy, Sell, and Simulation steps. The evaluation will focus on implementation quality, user experience, code quality, and UI design, with a submission requirement to push the code to a cloud git repository and provide a README file with instructions.

Uploaded by

Living Lords
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
2 views

React + TypeScript Assignment

The assignment involves creating a frontend web application for Trading Studio, an online platform for developing and backtesting trading strategies using React and TypeScript. Users can create, save, submit, and track strategies through various stages including Scanner, Buy, Sell, and Simulation steps. The evaluation will focus on implementation quality, user experience, code quality, and UI design, with a submission requirement to push the code to a cloud git repository and provide a README file with instructions.

Uploaded by

Living Lords
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

React + TypeScript Assignment

Problem Statement:
Trading Studio is an online platform that allows users to create trading/investment strategies and backtest their performance
on historical data. Users can perform the following actions on the platform:

● Create a new strategy


● Save an incomplete strategy and work on it later
● Submit a strategy for simulation
● Track the execution status of an in-progress strategy
● Load results for a strategy whose execution is completed
● Fetch the list of all previously saved strategies
● Copy a previously saved strategy to a new strategy

Strategy Structure

A strategy consists of 4 stages:

● Scanner step
○ The goal of this step is to identify all financial instruments that meet a certain set of scanner rules on a given day.
● Buy step
○ The goal of this step is to identify all financial instruments that meet a certain set of buy-trigger rules on a given
day.
● Sell step
○ The goal of this step is to identify all financial instruments that meet a certain set of sell-trigger rules after being
shortlisted in the buy step.
● Simulation step
○ The goal of this step is to simulate the portfolio using a given portfolio configuration, based on the items
shortlisted in the above steps.

Example:
SAMPLE SCANNER-STEP-CONFIG RULE:

exchange = NSE
AND
instrument_type = EQUITY
AND
(
(
last 300 days price growth is greater than 0%
AND
price of the instrument is greater than 99
)
OR
(
instrument is among the top 10% instruments when ranked by market capitalisati
AND
instrument's 90 day average daily transaction value is greater than 300000000
)
)

Explanation of scanner rule: This rule ensures that only instruments of type EQUITY from NSE are included in the strategy.
Additionally, on any given day, only those instruments are filtered whose: (last 300 days price growth is greater than 0% AND
price of the instrument is greater than 99), OR (the instrument is among the top 10% instruments when ranked by market
capitalisation AND instrument's 90 day average daily transaction value is greater than 300000000)

SAMPLE BUY-STEP-CONFIG:

last price is greater than or equal to last 30 day close


AND
last price is greater than or equal to last 30 day moving average

Explanation of buy rule: For a given day, from all the shortlisted instruments after the scanner step, only instruments whose:
(last price is greater than or equal to last 30 day close AND last price is greater than or equal to last 30 day moving average)
are shortlisted for entry.

SAMPLE SELL-STEP-CONFIG:

trailing_stoploss = 10%
AND
hold positions for at least 5 days

Explanation of sell rule: This sell rule defines that open positions will not be exited before 5 days from entry, and they will be
exited if trailing stoploss crosses 10%.

SAMPLE SIMULATION-STEP-CONFIG:

start_margin = 100000
AND
simulation_start_date = '01/01/2000'
AND
simulation_end_date = '20/03/2025'
AND
max_positions = 20
AND
max_positions_per_instrument = 1
AND
order_sorting_type = 300-days-top-gainer-first
Explanation of simulation rule: This rule defines that:

● Margin available on day 1 ('01/01/2000') is 100000


● Simulation will run from '01/01/2000' to '20/03/2025'
● At any given time, the user's portfolio will not contain more than 20 open positions
● New positions will not be taken for an instrument if there already exists an open position for that instrument
● order_sorting_type defines the priority of the instrument for entry. There could be more than 20 instruments eligible for
entry on any given day. All shortlisted entry instruments are ranked based on price growth in the last 300 days, and
higher-ranked instruments are picked first

Notes:
This example is only intended to increase your understanding. You are NOT required to implement the simulator backend or
any backend/database-related features. Your task is to create the frontend web page(s) for this platform using React +
TypeScript.

Evaluation Criteria:

This assignment is expected to take 4-6 hours based on your current familiarity with React + TypeScript. You are not expected
to implement all user workflows. Pick 1 or 2 workflows which will allow you to demonstrate your skills in the best way. Your
submission will be evaluated on the following areas:

● Quality of React/TypeScript application implementation


● Ease of use (user experience)
● Code quality
● You should focus on a desktop-only version first and use responsive design for only 1 of the pages if time permits
● UI design skills
○ The wireframes provided with this assignment are meant to provide a basic starting point. You may use them as a
reference or come up with your own design.
○ Your ability to demonstrate design skills will score you bonus points

Submission:
● Push your code to any cloud git repository (example - GitHub) and either add '[email protected]' to that
repository or make the repository public
● Add a README file with instructions on how to run your app locally
● Mention any assumptions you have made
● Specify any other relevant information that you think will be useful
● Send an email to [email protected] when you have completed the assignment

You might also like