This is a React Native technical challenge. It's a very simple, bootstrapped Expo app and lightweight back-end. This app is meant to approximate what the real app is like (in tech stack, code, and functionality), but it's boiled down to only the essentials.
It uses:
- Typescript
- React Native
- Expo CLI's basic bootstrapped template (we don't actually use Expo in our full-scale application, but it's quicker to set up)
- json-graphql-server for the back-end, database, and GraphQL
- Apollo Client (React client for GraphQL requests)
- Import this repo to your Github account IMPORTANT: Select "Private", not "Public"
- Clone your repo locally and
cd
into it - Run
yarn
ornpm i
- Open a couple of terminal windows.
- In the first, run
yarn start
,yarn ios
,yarn android
, oryarn web
(depending on the platform you want to develop on). If you choose web, your app will load up at http://localhost:19006. - In the second, run
yarn serve
. This runs the back-end server, which generates routes and mutations fromdb.js
.
- In the first, run
- You should now be presented with a very basic app with a portfolio of some holdings of various types.
- Open the GraphiQL environment for your local server: http://localhost:3005/graphql. You can try queries against the back-end here, with autocomplete. Use this as the source of all back-end data.
- The app will automatically use the light/dark color scheme that your device's OS has set. See docs here to change this, but note that we don't intend to judge based on support for both. Just note which scheme you focused on in your Readme notes below.
This challenge is intended to take between one and two hours. Pick one of the following challenges to complete.
- Build out a P2P Send flow, where you can:
- Select a holding
- Set an amount to send
- Find and select a recipient
- See
users
list indb.js
-- GraphQL queries for these are available in the back-end (see HoldingsList for an example). Do not import directly fromdb.js
. - Ideally, pick a user from a list which filters on a text input
- See
- See an overview & submit the transaction
- Reduce the user's holdings by the 'transferred' amount (in a real app there would be a real 'send' mutation, but let's pretend)
- Get a success screen with a summary of the transaction
- Improve the portfolio page:
- Display all holdings BY CATEGORY, such that each category has its respective holdings' information displayed nicely.
- Format all numbers and strings appropriately (denominations, currency symbols, thousands delineation, etc)
- Add a pie chart of the holdings
- Add 'pull to refresh' for updated holdings on the Portfolio page
We will evaluate your submission on:
- Fulfillment of requirements and functionality (as limited by time taken)
- Code quality (is this code mergeable as-is, or would the PR be rejected?)
- Usable UI & navigation (no need for high polish)
Push up your repo/branch to Github and give read access to the users provided by your recruiter.
In this README (below), please include:
- Your goal and primary focus
- The amount of time you took
- Any assumptions and/or constraints you came up with while working through this challenge
- What you would change or add if you had more time
- A screen recording or screenshots of your app