Repository files navigation

This project builds upon the existing React Native application with Typescript and Redux, aiming to fulfill the seven core requirements outlined in the challenge. In addition to addressing the primary objectives, the application introduces several notable enhancements to enrich the user experience and improve overall functionality.

• React Navigation: Implemented to introduce aTournament Details screen, providing users with a detailed view and additional information pertaining to specific Tournaments.
• React Native Reanimated: Utilised to implement smooth and aesthetically pleasing animations within the FlatList component, contributing to a more dynamic and engaging user interface.
• React Native Feather Icons: Integrated to add visually appealing icons, enhancing the aesthetic appeal and user experience on theTournament Details screen.

• Lodash: A modern JavaScript utility library delivering modularity, performance & extras, employed for various helper functions.
• Date Fns: A comprehensive, yet simple and consistent toolset for manipulating JavaScript dates, utilized to enhance date and time manipulation capabilities.
• React Native Prompt: Initially integrated for prompt dialog functionalities, though it was subsequently replaced with a custom prompt component tailored to the application’s specific needs.
• React Native Feather Icons: A collection of simply beautiful open-source icons from Feather, providing a wide range of icon options to enhance the visual experience across the application.

This is a newReact Native project, bootstrapped using@react-native-community/cli and has addtional libraries included:

• Redux
• Redux Thunk
• React Redux
• styled-components
• polished

Note: Make sure you have completed theReact Native - Environment Setup instructions till "Creating a new application" step, before proceeding.

First, you will need to startMetro, the JavaScriptbundler that shipswith React Native.

To start Metro, run the following command from theroot of your React Native project:

# using npmnpm start# OR using Yarnyarn start

Let Metro Bundler run in itsown terminal. Open anew terminal from theroot of your React Native project. Run the following command to start yourAndroid oriOS app:

# using npmnpm run android# OR using Yarnyarn android

# using npmnpm run ios# OR using Yarnyarn ios

If everything is set upcorrectly, you should see your new app running in yourAndroid Emulator oriOS Simulator shortly provided you have set up your emulator/simulator correctly.

This is one way to run your app — you can also run it directly from within Android Studio and Xcode respectively.

In the project directory, you can run:

yarn start:api

Starts the fake REST API server onhttp://localhost:4000.

• You can re-run the script to reset/regenerate the data.

Running onhttp://localhost:4000.

Get a list of tournaments.

Type:string

Search tournaments by any value

Type:number

Search tournaments by page

Type:number -10 by default

Set maximum number of items per page

[  {"id":"79218e94-91fd-4420-8278-f453574b97c4","name":"Veritatis Quam Facilis","organizer":"Rerum Perspiciatis","game":"Rocket League","participants": {"current":206,"max":256    },"startDate":"2020-02-27T11:28:02.233Z"  },  {"id":"042fddd8-882f-4dd3-9cf1-ff82a3c8be9f","name":"Cum Eveniet Quibusdam","organizer":"Id","game":"Dota 2","participants": {"current":168,"max":256    },"startDate":"2020-02-27T11:28:02.233Z"  },  {"id":"2eb5d07a-8ce5-4b36-8c0f-76b55701d9cc","name":"Numquam Fuga Totam","organizer":"Quaerat Dolorem","game":"Dota 2","participants": {"current":256,"max":256    },"startDate":"2020-02-27T11:28:02.233Z"  }]

Create a tournament.

{"name":"Foo"}

{"id":"2b86b928-a0b5-4dec-8b5a-5f3519790829","name":"Foo","organizer":"Voluptas","game":"League of Legends","participants": {"current":204,"max":256  },"startDate":"2020-02-27T11:36:27.047Z"}

Edit a tournament.

{"name":"Bar"}

{"id":"2b86b928-a0b5-4dec-8b5a-5f3519790829","name":"Bar","organizer":"Voluptas","game":"League of Legends","participants": {"current":204,"max":256  },"startDate":"2020-02-27T11:36:27.047Z"}

Delete a tournament.

{}