This mobile application allows users to search for GitHub profiles by username, view user details, and navigate through followers and following lists. The app fetches GitHub user data using the GitHub REST API.
- A search bar enables users to fetch GitHub user profiles by username.
- If no user exists with the provided username, a "Not found" view is presented.
- If the user exists, a view displays the user's:
- Avatar
- Username
- Name
- Description
- Follower count
- Following count
- Users can tap on the follower/following counts to navigate to a list view.
- The list view displays the user's followers or the users they are following.
- Tapping on a user in the list navigates to their profile view.
- Users can navigate backward through the navigation stack.
- Add skeleton screens to provide a visual indication of loading.
- Implement pull-to-refresh functionality to allow users to manually refresh data.
- Implement profile caching to improve app performance.
- Add cache invalidation mechanisms to keep data up-to-date.
- Verify the presence of the search bar.
- Test searching for a user that exists.
- Test searching for a user that doesn't exist.
- Verify the "Not found" view is displayed appropriately.
- Ensure user details are displayed correctly.
- Test navigating to a user's followers list.
- Test navigating to a user's following list.
- Verify the avatar, username, name, description, follower count, and following count.
- Test tapping on a follower/following count.
- Verify the list view displays the correct user information.
- Test tapping on a user in the list and verify navigation to their profile view.
- Test navigating backward through the app.
- Ensure the expected views are displayed after navigation.
The completion of this project required a thoughtful investment of time. The total hours dedicated to the development, testing, and refinement of the GitHub Profile App amounted to 16 hours.
- Organize code into modular structures.
- Enhance error handling and logging.
- Optimize performance by employing techniques such as memoization, lazy loading, and image optimization.
- Consider implementing a caching mechanism for frequently requested data.
- Ensure secure handling of sensitive information, such as API keys, by using environment variables.
- Implement loading states and error messages to provide better feedback to users.
- Optimize the Redux store by selectively connecting components and avoiding unnecessary re-renders.
- Implement testing, optimization, and security measures.
- Ensure a good user experience, accessibility, and code quality.
- Follow best practices for version control, commit messages, and branching strategies.
- Set up a CI/CD pipeline for automated testing and deployment.
- Clone the repository:
git clone https://github.com/jekingohel/GitHubProfileApp.git
- Change into the project directory:
cd GitHubProfileApp
- Install dependencies:
# using npm
npm install
# OR using Yarn
yarn install
Let Metro Bundler run in its own terminal. Open a new terminal from the root of your React Native project. Run the following command to start your Android or iOS app:
# using npm
npm run android
# OR using Yarn
yarn android
# using npm
npm run ios
# OR using Yarn
yarn ios
If everything is set up correctly, you should see your new app running in your Android Emulator or iOS 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.
# using npm
npm test -- -u
# OR using Yarn
yarn test -- -u