Flutter Pokédex

A Flutter app that utilizes a free open API to view Pokémon, search for specific ones, and access basic details.

Table of Contents

• Getting Started 🚀
  • Prerequisites
    • Flutter SDK
    • Dart SDK
    • FVM
    • Android Studio/Xcode
    • Verify Environment Setup
  • Installation
    • Clone the Repository
    • Get project dependencies
    • Analyze the project code
• Usage 📱
• Running Tests 🧪
• Troubleshooting 🛠️

Getting Started 🚀

• Prerequisites

  • Flutter SDK:

    Flutter is required for running and building the app.

    • You can install Flutter by following the official installation guide.
    • Verify your Flutter installation with:

      flutter --version

  • Dart SDK:

    Dart is included with Flutter, but you can install it separately if needed.

    • Verify with:

      dart --version

  • FVM:

    FVM(Flutter Version Management) makes it easier to manage different Flutter versions.

    • Install FVM using Dart:

      dart pub global activate fvm

    Note: Other ways to install FVM into your system: FVM Installtion.

    • Verify the FVM installation:

      fvm --version

    • Install a specific Flutter version:

      Note: Flutter version use is stable(3.29.0). Check FVM configuration for future updates.

      fvm install stable

    • Set the Flutter version for the current project:

      fvm use stable

    • Verify list of installed versions:

      fvm list

  • Android Studio/Xcode:

    For setting up emulators and building the app on Android or iOS devices.

    • Install Android Studio for Android development.
    • Install Xcode for iOS development (macOS only).

  • Verify Environment Setup:

    Flutter helps you ensure that everything necessary is correctly installed and configured before starting development.

    Instead of using flutter, we’ll use fvm flutter command to ensure the correct version is used.

      fvm flutter doctor

• Installation

  • Clone the repository:

      git clone https://github.com/louieseno/flutter_pokedex.git

  • Set up your .env files:

  Copy .env.example into your .env file, it should look like this:

    BASE_API_URL="https://pokeapi.co/api/v2"

  Note: The value in .env.example is already set to https://pokeapi.co/api/v2 since this project uses a free public API for testing. You don't need to modify this unless you're using a different API or self-hosting a backend.

  • Get project dependencies

      fvm flutter pub get

  • Analyze the project code

    fvm flutter analyze

Usage 📱

This project contains 3 flavors (only supported for iOS and Android):

• development
• staging
• production

macOS flavor support has not been configured.

To run the desired flavor either use the launch configuration in VSCode or use the following commands:

  # Development
  fvm flutter run --flavor development -t lib/main_development.dart -d <device-id>

  # Staging
  fvm flutter run --flavor staging -t lib/main_staging.dart -d <device-id>

  # Production
  fvm flutter run --flavor production -t lib/main_production.dart -d <device-id>

You can also utilize VSCode launch config.

Running Tests 🧪

To run all unit tests use the following command:

fvm flutter test --coverage --test-randomize-ordering-seed random

To generate and view a coverage report, you need lcov. If it's missing, install it with:

• macOS (Homebrew):

brew install lcov

• Linux (Debian Based):

sudo apt-get install lcov

Generate and Open Report

# Generate Coverage Report
genhtml coverage/lcov.info -o coverage/

# Open Coverage Report
open coverage/index.html

Troubleshooting 🛠️

If you encounter any issues while using the app, please open an issue.

Your contributions help me to improve the app.