Finding Falcone is a Geektrust front-end coding challenge, where a user needs to select 4 planets out of 6 and assign provided space vehicles to search for Queen Falcone.
Upon selecting planets and assigning vehicles the user can view the result (a game of chance) provided by an api.
- cd into the directory 'FindingFalcone'.
- run the command 'npm install'
(to install all the required packages) - run the command 'npm run dev'
(this command runs a local development server)
- First select 4 planets by clicking them
- Drag and drop a vehicle image onto a planet images to assign the vehicle to the planet
- Upon selecting 4 planets and assigning vehicles to each, click 'show result' button to see result
- If no vehicle is assignable to a planet, hit reset button
NOTE - Vehicles cannot be dropped on:
- planets which are not selected
- planets which are farther away than the maximum distance the vehicle can travel
- planets which already have a vehicle assigned
- React
- Typescript
- SCSS
- Webpack
I used typescript to build this app, thus it provided nice opportunity to learn about some of its features like making custom types and using typescript in React.
Also I learned about using drag and drop functionality without using any external library.
- Adding tests (RTL, JEST, Enzyme)
- Find solution for deployment so that dist folder doesn't needs to be uploaded on git repo
- Deploying (current version not working)
- code splitting not working in deployed app
- tweak webpack.config.js for production build