This project uses SpaceX open API to show the latest missions and launch details
- ✅ Latest launches displayed chronologically
- ✅ Launch card
- Mission name
- Launch date formatted
- Mission cover image if available
- ✅ Launch details screen
- Mission name
- Launch date formatted
- Rocket name
- Details if available
- Article button link if available
- ✅ Images carousel with 3 items at most if available
- ✅ Individual toggle favorite image on tap it
- ✅ Favorite heart animated
- ✅ Favorite button animated
- ✅ Animated empty feedback
- ✅ Animated error feedback
- ✅ Animated loading feedback
- ✅ Image caching
- ✅ Data caching
- ✅ Cache persisting
- ✅ Unit testing
- ☑️ Full compatibility with dark theme
- ☑️ Infinite scroll
- ☑️ Pull to refresh
- ☑️ Icon
- ☑️ Splashscreen
- ☑️ e2e tests
- ☑️ Sort by launch date asc or desc
- ☑️ Continuous integration
- ☑️ Automated build
- ☑️ Automated store deployment
- ☑️ Code push
- ☑️ Continuous deployment
- ☑️ Performance monitoring
- ☑️ Crash monitoring
- TypeScript - Typed JavaScript
- React Native - Hybrid mobile development
- React Navigation - Routing and navigation
- Apollo GraphQL
- Lottie - Lightweight and scalable animations
- Snap carousel - React native carousel library
- date-fns - Date utility library
- Ramda - Practical functional library
- Jest - Testing framework
- Testing library - Well... a testing library
- Faker.js - Generate fake data for tests
- ESLint - Static testing
- Husky - Git hooks
- Lint staged - Lint files staged by git
These instructions will get you a base project structure and running on your local machine for development and testing purposes.
Setting up the development environment
You can follow the React Native CLI quickstart for your development OS target OS.
Installing Dependencies:
yarn install
Installing Pods (only for iOS):
cd ios && pod install
Running the app:
yarn start
For starting the app on a specific OS:
yarn ios
yarn android
-
Eslint is used in the project to enforce code style and should be configured in your editor.
-
Prettier is also used and apply automatically by eslint
-
Typescript is used in the project for type-checking and should be configured in your editor.
You can check this manually by running:
yarn lint
You can ask eslint to fix issues by running:
yarn lint:fix
Use the following command to run unit tests:
yarn test
Use the following to update the snapshots of unit tests:
yarn test -u
Use the following to run unit tests in watch mode while developing:
yarn test --watch