Application Permissions and Dependencies

Make sure the below-mentioned Permissions are Allowed or Accepted:

  1. Internet Access

  2. FileStore Read and Write

  3. BlueTooth Connection

  4. Request Packages

  5. Query all packages

Code snippet

 

https://github.com/misdwss/punjab-mgramseva/blob/master/frontend/mgramseva/pubspec.yaml

 

Steps to setup the Project

  1. Download the flutter sdk 3.0.4 from https://docs.flutter.dev/development/tools/sdk/releases for respective platform (Windows, Linux, Mac).

  2. Install Android Studio for setting the IDE.

  3. Open Android Studio, Open plugin preferences (File > Settings > Plugins) and select Marketplace, select the Flutter plugin and click Install as shown in below image and also click Yes when prompted to install the Dart plugin.

  4. Set the Flutter SDK path in android studio by navigating to (File > Settings > Plugins > Language & Frameworks >>flutter) flutter as shown in below image.

  5. Add the flutter path to the System path variable for running the flutter commands as shown in below image.

  6. Open a new terminal and run the flutter doctor command, this will download the respective Dart sdk version, run flutter doctor --android-licenses to accept the android licenses.

  7. Below steps will guide us to run the project in both Web and Mobile
    1. Clone the project from Git repo.
    2. Open the project in android studio by selecting (File > open), select the flutter project (punjab-mgramseva/frontend/mgramseva) from cloned path as shown in below.

     

  8. Replace the base Url with respective env Url.
    File → app.config.dart
    _baseUrl: kIsWeb ? (window.location.origin ?? '') + "/" : const String.fromEnvironment('BASE_URL')
    =>    
    _baseUrl: https://mgramseva-dev.digit.org/



    Running on Android Emulator

    Navigate to the build.gradle file by using below mentioned path and modify the signingConfigs.release to signingConfigs.debug in the line number 70 as shown in below screenshot
    Path : punjab-mgramseva → frontend → mgramseva → android → app → build.gradle


    Navigate to the below path and comment the line which is highlighted in below attached screenshot
    Path : punjab-mgramseva → frontend → mgramseva → External Libraries → Dart Packages → js-0.6.3 → js.dart

    Comment it by adding two forward slashes to the line
    //export 'dart:js' show allowInterop, allowInteropCaptureThis;



    Select the AVD manager from right side top corner as shown in image, from their select any device by tapping on play button, therefore android studio will the launch the emulator and device will be auto selected, two modes will be there for running the application play and debug, we can tap on any one of the mode, this will launch the mgramseva application in emulator as shown in image.


Steps to build the apk in different environments
QA
flutter build apk --dart-define=BASE_URL=https://mgramseva-qa.egov.org.in/

UAT
flutter build apk --dart-define=BASE_URL=https://mgramseva-uat.psegs.in/

PROD APK
flutter build apk --dart-define=BASE_URL=https://mgramseva-dwss.punjab.gov.in/

PROD APP BUNDLE
flutter build appbundle --dart-define=BASE_URL=https://mgramseva-dwss.punjab.gov.in/


Running on Web

Navigate to the below path and uncomment the lines from 307 to 315 which is highlighted in below attached screenshot
Path : punjab-mgramseva → frontend → mgramseva → web → index.html


Select the chrome option from device selection and tap on play button it will the launch the application on a chrome window.

Note : To resolve cors error follow the steps in this link.

Steps to build Prod App Bundle and IPA

  1.  Clone the Repo → git clone https://github.com/misdwss/punjab-mgramseva.git

  2. Navigate to mgramseva Folder → cd punjab-mgramseva/frontend/mgramseva

  3. .upgrading the version in the pubspec.yml ( version: 1.0.2+3)
    1.0.2 => version name (which displayed in playstore)

    +3 => version code (increment by +1 every time)

  4. Navigate to the below path and comment the line which is highlighted in below attached screenshot
    Path : punjab-mgramseva → frontend → mgramseva → External Libraries → Dart Packages → js-0.6.3 → js.dart

    Comment it by adding two forward slashes to the line
    //export 'dart:js' show allowInterop, allowInteropCaptureThis;

  5. Executing flutter clean command →    flutter clean

  6. Execute the flutter pub get command. →  flutter pub get

  7. Navigate to the build.gradle file by using below mentioned path and modify the signingConfigs.debug to signingConfigs.release in the line number 70 as shown in below screenshot
    Path : punjab-mgramseva → frontend → mgramseva → android → app → build.gradle

  8. Download the key.properties file from the below attachments 
    Add this properties file to the android app folder as shown in below image
    android → key.properties

  9. Download the google-service.json file from Firebase Console
    Add this json file to the android app folder as shown in below image
    android → app → google-services.json

  10. Below are the steps to build the App bundle(Playstore) and IPA(AppStore).
    App Bundle Creation
    Build the prod app bundle using below command

    flutter build appbundle --dart-define=BASE_URL=https://mgramseva-dwss.punjab.gov.in/


    Path → D:\mgramseva_prod\punjab-mgramseva\frontend\mgramseva\build\app\outputs\bundle\release\app-release.aab

    IPA Creation
    1.Open the mgramseva IOS folder using xcode.
    Path → punjab-mgramseva/frontend/mgramseva/ios
    2.In Runner navigate to general tab, check the identity properties(Version, build, app name, build identifier).
    3.Navigate to signing & capabilities tab, check whether provisioning profile is set properly or not.
    4.From Xcode tool bar, select Product option, in that select Archive option it will generate the build and automatically deploy the build to App store connect (where can test and deploy the app to App store).

    Note :
    Kindly check the attached mGramseva release version sheet below which includes key-store, version tracker and also updated the version and release date in sheet.
    https://docs.google.com/spreadsheets/d/1aH596FxtPISIlQzxw9jO_Ex1dttpJJvweib2F9nJj9o/edit?usp=sharing

    Attachments

 

Steps to build Web

  • Check the release version in Package.json whether it is sync with Mobile application or not.

  • Navigate to Jenkins frontend mgramseva builds.

  • Select build with parameter option and select the master branch from filter as shown in screenshot and tap on build button, it will take some time to build.

  • Once successfully build happen, copy the build id and share it with the implementation team, they will take care of Prod deployment.


Steps to Run the Integration Test in your Android Device :
1. Enable USB debugging option in your Mobile Phone. ( Reference Link )

2. Connect your Phone to the system and enable File transfer.

3. Select the AVD manager(your Phone) from right side top corner in Android Studio

4. Go to the frontend/mgramseva/utils/execute_integration.sh file and run it.

5. Integration test will start on your device.