Contribute to AWS Amplify

This article is an English translation of an article published in the AWS Japan official web magazine "builders.flash".
https://aws.amazon.com/jp/builders-flash/202303/contribute-to-amplify

Did you know that AWS has released various Open Source Software (OSS)? AWS has released various OSS such as AWS Amplify, AWS CDK, OpenSearch, AWS CLI, etc.

Open Source at AWS

I'm a fan of Open Source Software (OSS), so I contribute to OSS in AWS and location-based technologies. "MIERUNE," to which I belong, was founded by members of the community called "FOSS4G（Free and OpenSource Software for Geospatial）" and actively supports OSS.

If you are interested in OSS, let's contribute together!

Contribute to AWS Amplify

Today I will show you how to contribute to AWS Amplify, the OSS of AWS. AWS Amplify is available as OSS on GitHub, with separate repositories for each product.

AWS Amplify - GitHub

An introduction page for contributors is also available.

AWS Amplify Contributor Program

There is also an AWS Amplify user group in Japan, and its community page introduces Japanese contributors.

Amplify Japan User Group

Now I will show you how to contribute. I will show you an example of AWS Amplify CLI.

AWS Amplify CLI - GitHub

For details on how to contribute, check the "CONTRIBUTING.md" of each repository.

AWS Amplify CLI - CONTRIBUTING.md

Today, I present an example in the following sequence.

1. Creating an Issue
2. Building the Environment
3. Modifying Code
4. Running Tests
5. Verify that the Code Works
6. Create Pull Request for Code
7. Modify Documentation
8. Create Pull Request for Documentation
9. Merge & Release Pull Request

1 . Creating an Issue

First, create an Issue. In this case, we will create an Issue for an additional feature request. When you find an issue, create an Issue first before creating a Pull Request.

Go to the AWS Amplify CLI repository → Click Issues → Click New Issue → Click Get started on Feature Request.

In this case, we will create an Issue to add the new map style "Open Data" to Amplify Geo. It would be helpful to include the category name in the title.

Amplify Geo: New map style (Open Data Maps)

Is this feature request related to a new or existing Amplify category?
No response

Is this related to another service?
Amazon Location Service

Describe the feature you'd like to request
A new map style was announced today, but has not yet been added to the Amplify CLI.

https://aws.amazon.com/jp/about-aws/whats-new/2022/12/amazon-location-service-open-data-maps-preview/

Describe the solution you'd like
Add New map style to "amplify add geo" in Amplify CLI.

Describe alternatives you've considered
Because it is difficult to work manually.

Additional context
No response

Is this something that you'd be interested in working on?
 👋 I may be able to implement this feature request
Would this feature include a breaking change?
 ⚠️ This feature might incur a breaking change

2 . Building the Environment

Next, prepare the development environment. Fork the AWS Amplify CLI repository and install the development environment. Also, prepare Git and Node.js environment in advance. In this example, GitHub Desktop is used as the tool, but commands or other GUI tools can also be used.

Fork the AWS Amplify CLI repository.

Create a working branch, which should include the category name.

Install the development environment in the forked directory.

Verified version at the time of writing

• node v16.10.0
• npm v7.24.0

# Linux / macOS
yarn setup-dev

yarn run v1.18.0
$ yarn dev-build && yarn rm-dev-link && yarn link-dev && yarn rm-aa-dev-link && yarn link-aa-dev
$ yarn --cache-folder ~/.cache/yarn && nx run-many --target=build --all
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
[4/4] 🔨  Building fresh packages...
    ✔  nx run amplify-cli-logger:build (3s)
    ✔  nx run amplify-function-plugin-interface:build (3s)
    ✔  nx run amplify-storage-simulator:build (3s)
    ✔  nx run amplify-cli-shared-interfaces:build (3s)
    ✔  nx run amplify-headless-interface:build (3s)
    ✔  nx run amplify-util-import:build (3s)
    ✔  nx run amplify-go-function-template-provider:build (2s)
    ✔  nx run amplify-python-function-template-provider:build (2s)
    ✔  nx run amplify-java-function-template-provider:build (2s)
    ✔  nx run amplify-util-headless-input:build (2s)
    ✔  nx run amplify-prompts:build (3s)
    ✔  nx run amplify-dotnet-function-runtime-provider:build (2s)
    ✔  nx run amplify-cli-core:build (3s)
    ✔  nx run @aws-amplify/amplify-opensearch-simulator:build (4s)
    ✔  nx run @aws-amplify/amplify-category-custom:build (4s)
    ✔  nx run amplify-category-interactions:build (5s)
    ✔  nx run @aws-amplify/amplify-environment-parameters:build (10s)
    ✔  nx run @aws-amplify/amplify-util-uibuilder:build (10s)
    ✔  nx run amplify-category-geo:build (10s)
    ✔  nx run amplify-container-hosting:build (5s)
    ✔  nx run amplify-dotnet-function-template-provider:build (5s)
    ✔  nx run @aws-amplify/amplify-e2e-core:build (10s)
    ✔  nx run amplify-category-predictions:build (10s)
    ✔  nx run amplify-java-function-runtime-provider:build (5s)
    ✔  nx run amplify-go-function-runtime-provider:build (5s)
    ✔  nx run amplify-nodejs-function-template-provider:build (5s)
    ✔  nx run amplify-nodejs-function-runtime-provider:build (5s)
    ✔  nx run amplify-python-function-runtime-provider:build (4s)
    ✔  nx run @aws-amplify/cli-extensibility-helper:build (4s)
    ✔  nx run amplify-category-notifications:build (4s)
    ✔  nx run amplify-category-analytics:build (4s)
    ✔  nx run amplify-console-hosting:build (4s)
    ✔  nx run amplify-category-function:build (7s)
    ✔  nx run amplify-dynamodb-simulator:build (12s)
    ✔  nx run @aws-amplify/amplify-category-storage:build (4s)
    ✔  nx run @aws-amplify/amplify-category-auth:build (6s)
    ✔  nx run amplify-provider-awscloudformation:build (6s)
    ✔  nx run @aws-amplify/amplify-graphiql-explorer:build (37s)
    ✔  nx run @aws-amplify/amplify-appsync-simulator:build (5s)
    ✔  nx run amplify-util-mock:build (5s)
    ✔  nx run @aws-amplify/cli-internal:build (5s)
    ✔  nx run @aws-amplify/cli:build (2s)

 ——————————————————————————————————————————————————————————————————————————————

 >  NX   Successfully ran target build for 42 projects (54s)

$ rimraf -f "$(yarn global bin)/amplify-dev"
$ cd packages/amplify-cli && ln -s "$(pwd)/bin/amplify" "$(yarn global bin)/amplify-dev" && cd -
/Users/dayjournal/Documents/GitHub/amplify-cli
$ rimraf -f "$(yarn global bin)/amplify-app-dev"
$ cd packages/amplify-app && ln -s "$(pwd)/bin/amplify-app" "$(yarn global bin)/amplify-app-dev" && cd -
/Users/dayjournal/Documents/GitHub/amplify-cli
✨  Done in 130.87s.

3 . Modifying Code

Next, modify the code. Modify the files related to the Amplify Geo category to add the new map style "Open Data."

packages/amplify-category-geo/src/service-utils/mapParams.ts

- export type MapStyleType = EsriMapStyleType | HereMapStyleType;
+   /**
+   * The type of Map styles for Open data provider
+   */
+   export enum OpenDataMapStyleType {
+     StandardLight = "StandardLight"
+   }
+ 
+ export type MapStyleType = EsriMapStyleType | HereMapStyleType | OpenDataMapStyleType;

/**
 * Supported Geo Map Styles
 */
export enum MapStyle {
    VectorEsriNavigation = "VectorEsriNavigation",
    VectorEsriStreets = "VectorEsriStreets",
    VectorEsriTopographic = "VectorEsriTopographic",
    VectorEsriDarkGrayCanvas = "VectorEsriDarkGrayCanvas",
    VectorEsriLightGrayCanvas = "VectorEsriLightGrayCanvas",
    RasterEsriImagery = "RasterEsriImagery",
    VectorHereBerlin = "VectorHereBerlin",
    VectorHereExplore = "VectorHereExplore",
    VectorHereExploreTruck = "VectorHereExploreTruck",
    RasterHereExploreSatellite = "RasterHereExploreSatellite",
-   HybridHereExploreSatellite = "HybridHereExploreSatellite"
+   HybridHereExploreSatellite = "HybridHereExploreSatellite",
+   VectorOpenDataStandardLight = "VectorOpenDataStandardLight"
}

    switch(mapStyle) {
        case MapStyle.VectorEsriDarkGrayCanvas:
            return { dataProvider: DataProvider.Esri, mapStyleType: EsriMapStyleType.DarkGrayCanvas };
        case MapStyle.VectorEsriLightGrayCanvas:
            return { dataProvider: DataProvider.Esri, mapStyleType: EsriMapStyleType.LightGrayCanvas };
        case MapStyle.VectorEsriNavigation:
            return { dataProvider: DataProvider.Esri, mapStyleType: EsriMapStyleType.Navigation };
        case MapStyle.VectorEsriStreets:
            return { dataProvider: DataProvider.Esri, mapStyleType: EsriMapStyleType.Streets };
        case MapStyle.VectorEsriTopographic:
            return { dataProvider: DataProvider.Esri, mapStyleType: EsriMapStyleType.Topographic };
        case MapStyle.RasterEsriImagery:
            return { dataProvider: DataProvider.Esri, mapStyleType: EsriMapStyleType.Imagery };
        case MapStyle.VectorHereBerlin:
            return { dataProvider: DataProvider.Here, mapStyleType: HereMapStyleType.Berlin };
        case MapStyle.VectorHereExplore:
            return { dataProvider: DataProvider.Here, mapStyleType: HereMapStyleType.Explore };
        case MapStyle.VectorHereExploreTruck:
            return { dataProvider: DataProvider.Here, mapStyleType: HereMapStyleType.ExploreTruck };
        case MapStyle.RasterHereExploreSatellite:
            return { dataProvider: DataProvider.Here, mapStyleType: HereMapStyleType.RasterSatellite };
        case MapStyle.HybridHereExploreSatellite:
            return { dataProvider: DataProvider.Here, mapStyleType: HereMapStyleType.HybridSatellite };
+       case MapStyle.VectorOpenDataStandardLight:
+           return { dataProvider: DataProvider.OpenData, mapStyleType: OpenDataMapStyleType.StandardLight };
        default:
            throw new Error(`Invalid map style ${mapStyle}`);
    }

packages/amplify-category-geo/src/tests/service-utils/mapParams.test.ts

describe('map style construction works as expected', () => {
    const mapStyles = [
        "VectorEsriStreets",
        "VectorEsriNavigation",
        "VectorEsriTopographic",
        "VectorEsriDarkGrayCanvas",
        "VectorEsriLightGrayCanvas",
        "RasterEsriImagery",
        "VectorHereBerlin",
        "VectorHereExplore",
        "VectorHereExploreTruck",
        "RasterHereExploreSatellite",
-       "HybridHereExploreSatellite"
+       "HybridHereExploreSatellite",
+       "VectorOpenDataStandardLight"
    ];

packages/amplify-category-geo/src/service-utils/resourceParams.ts

export enum DataProvider {
    Esri = 'Esri',
-   Here = 'HERE'
+   Here = 'HERE',
+   OpenData = 'OpenData',
}

packages/amplify-category-geo/src/service-walkthroughs/mapWalkthrough.ts

export const mapStyleWalkthrough = async (parameters: Partial<MapParameters>): Promise<Partial<MapParameters>> => {
    const mapStyleChoices = [
        { name: 'Streets (data provided by Esri)', value: MapStyle.VectorEsriStreets },
        { name: 'Berlin (data provided by HERE)', value: MapStyle.VectorHereBerlin },
        { name: 'Explore (data provided by HERE)', value: MapStyle.VectorHereExplore },
        { name: 'ExploreTruck (data provided by HERE)', value: MapStyle.VectorHereExploreTruck },
        { name: 'RasterSatellite (data provided by HERE)', value: MapStyle.RasterHereExploreSatellite },
        { name: 'HybridSatellite (data provided by HERE)', value: MapStyle.HybridHereExploreSatellite },
        { name: 'Topographic (data provided by Esri)', value: MapStyle.VectorEsriTopographic },
        { name: 'Navigation (data provided by Esri)', value: MapStyle.VectorEsriNavigation },
        { name: 'LightGrayCanvas (data provided by Esri)', value: MapStyle.VectorEsriLightGrayCanvas },
        { name: 'DarkGrayCanvas (data provided by Esri)', value: MapStyle.VectorEsriDarkGrayCanvas },
-       { name: 'Imagery (data provided by Esri)', value: MapStyle.RasterEsriImagery }
+       { name: 'Imagery (data provided by Esri)', value: MapStyle.RasterEsriImagery },
+       { name: 'StandardLight (data provided by OpenStreetMap)', value: MapStyle.VectorOpenDataStandardLight }
    ];

packages/amplify-headless-interface/schemas/geo/1/AddGeoRequest.schema.json

        "MapStyle": {
            "description": "Supported Geo Map Styles",
            "enum": [
                "VectorEsriDarkGrayCanvas",
                "VectorEsriLightGrayCanvas",
                "VectorEsriNavigation",
                "VectorEsriStreets",
                "VectorEsriTopographic",
                "RasterEsriImagery",
                "VectorHereBerlin",
                "VectorHereExplore",
                "VectorHereExploreTruck",
                "RasterHereExploreSatellite",
-               "HybridHereExploreSatellite"
+               "HybridHereExploreSatellite",
+               "VectorOpenDataStandardLight"
            ],
            "type": "string"
        }

packages/amplify-headless-interface/src/interface/geo/add.ts

/**
 * Supported Geo Map Styles
 */
 export enum MapStyle {
  VectorEsriNavigation = "VectorEsriNavigation",
  VectorEsriStreets = "VectorEsriStreets",
  VectorEsriTopographic = "VectorEsriTopographic",
  VectorEsriDarkGrayCanvas = "VectorEsriDarkGrayCanvas",
  VectorEsriLightGrayCanvas = "VectorEsriLightGrayCanvas",
  RasterEsriImagery = "RasterEsriImagery",
  VectorHereBerlin = "VectorHereBerlin",
  VectorHereExplore = "VectorHereExplore",
  VectorHereExploreTruck = "VectorHereExploreTruck",
  RasterHereExploreSatellite = "RasterHereExploreSatellite",
- HybridHereExploreSatellite = "HybridHereExploreSatellite"
+ HybridHereExploreSatellite = "HybridHereExploreSatellite",
+ VectorOpenDataStandardLight = "VectorOpenDataStandardLight"
}

packages/amplify-headless-interface/API.md

// @public (undocumented)
export enum MapStyle {
    // (undocumented)
    HybridHereExploreSatellite = "HybridHereExploreSatellite",
    // (undocumented)
    RasterEsriImagery = "RasterEsriImagery",
    // (undocumented)
    RasterHereExploreSatellite = "RasterHereExploreSatellite",
    // (undocumented)
    VectorEsriDarkGrayCanvas = "VectorEsriDarkGrayCanvas",
    // (undocumented)
    VectorEsriLightGrayCanvas = "VectorEsriLightGrayCanvas",
    // (undocumented)
    VectorEsriNavigation = "VectorEsriNavigation",
    // (undocumented)
    VectorEsriStreets = "VectorEsriStreets",
    // (undocumented)
    VectorEsriTopographic = "VectorEsriTopographic",
    // (undocumented)
    VectorHereBerlin = "VectorHereBerlin",
    // (undocumented)
    VectorHereExplore = "VectorHereExplore",
    // (undocumented)
-   VectorHereExploreTruck = "VectorHereExploreTruck"
+   VectorHereExploreTruck = "VectorHereExploreTruck",
+   // (undocumented)
+   VectorOpenDataStandardLight = "VectorOpenDataStandardLight"
}

4 . Running Tests

Next, we will run the test and build relationships.

Run in the forked directory.

yarn lint-fix

yarn run v1.18.0
$ git diff --name-only --cached --diff-filter d | grep -E '\.(js|jsx|ts|tsx)$' | xargs eslint --fix --quiet
✨  Done in 0.06s.

Run in the directory of the category to be modified. We will run the test in the "amplify-cli/packages/amplify-category-geo" directory.

yarn build

yarn run v1.18.0
$ tsc
✨  Done in 4.51s.

yarn test

yarn run v1.18.0
$ jest --logHeapUsage
 PASS  src/__tests__/service-utils/validateGeoJSONObj.test.ts (10.153 s, 853 MB heap size)
 PASS  src/__tests__/service-utils/serviceUtils.test.ts (14.444 s, 977 MB heap size)
 PASS  src/__tests__/service-walkthroughs/mapWalkthrough.test.ts (14.546 s, 984 MB heap size)
 PASS  src/__tests__/commands/geo/add.test.ts (14.427 s, 984 MB heap size)
 PASS  src/__tests__/service-walkthroughs/placeIndexWalkthrough.test.ts (14.658 s, 1058 MB heap size)
 PASS  src/__tests__/service-utils/resourceUtils.test.ts (14.504 s, 1063 MB heap size)
 PASS  src/__tests__/commands/geo/update.test.ts (14.516 s, 1052 MB heap size)
 PASS  src/__tests__/service-walkthroughs/geofenceCollectionWalkthrough.test.ts (14.612 s, 1042 MB heap size)
 PASS  src/__tests__/commands/geo/remove.test.ts (1063 MB heap size)
 PASS  src/__tests__/index.test.ts (14.818 s, 1053 MB heap size)
 PASS  src/__tests__/service-utils/mapParams.test.ts (999 MB heap size)
 PASS  src/__tests__/service-stacks/mapStack.test.ts (1053 MB heap size)
 PASS  src/__tests__/service-stacks/placeIndexStack.test.ts (1053 MB heap size)
 PASS  src/__tests__/provider-controllers/index.test.ts (1124 MB heap size)
 PASS  src/__tests__/service-stacks/geofenceCollectionStack.test.ts (1132 MB heap size)
-------------------|---------|----------|---------|---------|-------------------
File               | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s
-------------------|---------|----------|---------|---------|-------------------
All files          |   68.84 |    58.41 |   56.81 |   67.26 |
 src               |      55 |       25 |      40 |   51.78 |
  constants.ts     |     100 |      100 |     100 |     100 |
  index.ts         |   52.63 |       25 |      40 |   49.05 | ...58,62-63,76-85
  ...edServices.ts |     100 |      100 |     100 |     100 |
 src/commands/geo  |   53.27 |        0 |      50 |   50.49 |
  add.ts           |   56.52 |        0 |     100 |   54.54 | 21-22,27-36
  console.ts       |   57.14 |        0 |       0 |   53.84 | 11-18
  help.ts          |   55.55 |      100 |       0 |      50 | 8-35
  import.ts        |   33.33 |        0 |       0 |   28.57 | 8-20
  remove.ts        |   56.52 |        0 |     100 |   54.54 | 16-17,23-32
  update.ts        |   56.52 |        0 |     100 |   54.54 | 21-22,27-36
 ...er-controllers |   43.36 |    38.04 |   15.78 |   39.27 |
  ...Collection.ts |   61.53 |       75 |   33.33 |      60 | 23-34,40-51
  import.ts        |   18.42 |        0 |       0 |    17.8 | ...09-120,129-142
  index.ts         |      39 |    21.62 |   18.75 |   31.76 | ...40-152,163-172
  map.ts           |   60.71 |       75 |   14.28 |   56.25 | ...,94-98,105-111
  placeIndex.ts    |   60.52 |       75 |   33.33 |   58.82 | 15-26,32-43
 ...service-stacks |     100 |    93.75 |     100 |     100 |
  baseStack.ts     |     100 |      100 |     100 |     100 |
  ...ctionStack.ts |     100 |      100 |     100 |     100 |
  mapStack.ts      |     100 |    88.88 |     100 |     100 | 35
  ...IndexStack.ts |     100 |      100 |     100 |     100 |
 src/service-utils |   69.41 |    68.57 |   54.92 |    67.4 |
  constants.ts     |     100 |      100 |     100 |     100 |
  ...tionParams.ts |   41.66 |        0 |       0 |   33.33 | 15-17,21-24
  ...ctionUtils.ts |   56.06 |    71.42 |    37.5 |   52.45 | ...98-102,110-119
  importParams.ts  |     100 |      100 |     100 |     100 |
  mapParams.ts     |    89.7 |    97.14 |   66.66 |   90.47 | 66-68,72-75
  mapUtils.ts      |   59.49 |       75 |      50 |   56.16 | ...93-105,112-122
  ...ndexParams.ts |   53.33 |    66.66 |      25 |      50 | 24-26,30-33
  ...IndexUtils.ts |   56.16 |    68.75 |    37.5 |   52.94 | ...96-110,117-128
  ...urceParams.ts |     100 |      100 |     100 |     100 |
  resourceUtils.ts |   64.07 |    36.84 |   57.89 |   59.77 | ...95-200,215-229
  ...GeoJSONObj.ts |   98.14 |    94.11 |     100 |   98.03 | 47
 ...e-walkthroughs |   83.69 |    64.95 |   81.81 |   83.05 |
  ...alkthrough.ts |   84.44 |    71.79 |   88.88 |   84.14 | 65-74,138-143,164
  ...alkthrough.ts |   85.88 |    62.96 |      80 |   85.33 | ...07,130-135,157
  ...alkthrough.ts |    87.8 |       68 |    87.5 |   86.48 | ...94,117-122,144
  ...alkthrough.ts |     100 |      100 |     100 |     100 |
  ...alkthrough.ts |   70.17 |       52 |      60 |   70.37 | ...2,59,78,88-102
-------------------|---------|----------|---------|---------|-------------------

Test Suites: 15 passed, 15 total
Tests:       72 passed, 72 total
Snapshots:   20 passed, 20 total
Time:        17.207 s
Ran all test suites.
✨  Done in 17.89s.

5 . Verify that the Code Works

Next, check the functionality. Create an empty working directory and execute it.

Configure initial settings for AWS Amplify.

/Users/[User Name]/.yarn/bin/amplify-dev init

⚠️ Amplify command hooks are disabled in the current execution environment.
⚠️ See https://docs.amplify.aws/cli/usage/command-hooks/ for more information.
Note: It is recommended to run this command from the root of your app directory
? Enter a name for the project amazonlocationservic
The following configuration will be applied:

Project information
| Name: amazonlocationservic
| Environment: dev
| Default editor: Visual Studio Code
| App type: javascript
| Javascript framework: none
| Source Directory Path: src
| Distribution Directory Path: dist
| Build Command: npm run-script build
| Start Command: npm run-script start

? Initialize the project with the above configuration? Yes
Using default provider  awscloudformation
? Select the authentication method you want to use: (Use arrow keys)
❯ AWS profile
? Select the authentication method you want to use: AWS profile

For more information on AWS Profiles, see:
https://docs.aws.amazon.com/cli/latest/userguide/cli-configure-profiles.html

? Please choose the profile you want to use default
Adding backend environment dev to AWS Amplify app: xxxxx

Deployment completed.
Deployed root stack amazonlocationservic [ ===========================
 amplify-amazonlocationservic-… AWS::CloudFormation::Stack     CREATE_
 AuthRole                       AWS::IAM::Role                 CREATE_
 DeploymentBucket               AWS::S3::Bucket                CREATE_
 UnauthRole                     AWS::IAM::Role                 CREATE_

✔ Help improve Amplify CLI by sharing non sensitive configurations on failures (y/N) · yes

Deployment state saved successfully.
✔ Initialized provider successfully.
✅ Initialized your environment successfully.

Your project has been successfully initialized and connected to the cloud!

Some next steps:
"amplify status" will show you what you've added already and if it's locally configured or deployed
"amplify add <category>" will allow you to add features like user login or a backend API
"amplify push" will build all your local backend resources and provision it in the cloud
"amplify console" to open the Amplify Console and view your project status
"amplify publish" will build all your local backend and frontend resources (if you have hosting category added) and provision it in the cloud

Pro tip:
Try "amplify add api" to create a backend API and then "amplify push" to deploy everything

Configure the authentication settings.

/Users/[User Name]/.yarn/bin/amplify-dev add auth

⚠️ Amplify command hooks are disabled in the current execution environment.
⚠️ See https://docs.amplify.aws/cli/usage/command-hooks/ for more information.
Using service: Cognito, provided by: awscloudformation

 The current configured provider is Amazon Cognito.

 Do you want to use the default authentication and security configuration? Default configuration
 Warning: you will not be able to edit these selections.
 How do you want users to be able to sign in? Username
 Do you want to configure advanced settings? No, I am done.
✅ Successfully added auth resource xxxxx locally

✅ Some next steps:
"amplify push" will build all your local backend resources and provision it in the cloud
"amplify publish" will build all your local backend and frontend resources (if you have hosting category added) and provision it in the cloud

Configure the map function. Select the new map style "Open Data."

/Users/[User Name]/.yarn/bin/amplify-dev add geo

⚠️ Amplify command hooks are disabled in the current execution environment.
⚠️ See https://docs.amplify.aws/cli/usage/command-hooks/ for more information.
? Select which capability you want to add: Map (visualize the geospatial data)
✔ Provide a name for the Map: · xxxxx
✔ Who can access this Map? · Authorized and Guest users
Available advanced settings:
- Map style & Map data provider (default: Streets provided by Esri)

✔ Do you want to configure advanced settings? (y/N) · yes
✔ Specify the map style. Refer https://docs.aws.amazon.com/location-maps/latest/APIReference/API_MapConfiguration.html · StandardLight (data provided by OpenStreetMap)

⚠️ Auth configuration is required to allow unauthenticated users, but it is not configured properly.
✅ Successfully updated auth resource locally.
✅ Successfully added resource xxxxx locally.

✅ Next steps:
"amplify push" builds all of your local backend resources and provisions them in the cloud
"amplify publish" builds all of your local backend and front-end resources (if you added hosting category) and provisions them in the cloud

After completing the settings, deploy the environment.

/Users/[User Name]/.yarn/bin/amplify-dev push

⚠️ Amplify command hooks are disabled in the current execution environment.
⚠️ See https://docs.amplify.aws/cli/usage/command-hooks/ for more information.
⠙ Fetching updates to backend environment: dev from the cloud.⠋ Building resource auth/xxxxx
✔ Successfully pulled backend environment dev from the cloud.

    Current Environment: dev

┌──────────┬──────────────────────────────┬───────────┬───────────────────┐
│ Category │ Resource name                │ Operation │ Provider plugin   │
├──────────┼──────────────────────────────┼───────────┼───────────────────┤
│ Auth     │ xxxxx                        │ Create    │ awscloudformation │
├──────────┼──────────────────────────────┼───────────┼───────────────────┤
│ Geo      │ xxxxx                        │ Create    │ awscloudformation │
└──────────┴──────────────────────────────┴───────────┴───────────────────┘
? Are you sure you want to continue? Yes

Deployment completed.
Deployed root stack amazonlocationservic [ ===========================
 amplifyxxxxx                   AWS::CloudFormation::Stack     UPDATE_
 authxxxxx                      AWS::CloudFormation::Stack     CREATE_
 geomapxxxxx                    AWS::CloudFormation::Stack     CREATE_
Deployed auth xxxxx                      [ =========================
 UserPool                       AWS::Cognito::UserPool         CREATE_
 UserPoolClientWeb              AWS::Cognito::UserPoolClient   CREATE_
 UserPoolClient                 AWS::Cognito::UserPoolClient   CREATE_
 UserPoolClientRole             AWS::IAM::Role                 CREATE_
 UserPoolClientLambda           AWS::Lambda::Function          CREATE_
 UserPoolClientLambdaPolicy     AWS::IAM::Policy               CREATE_
 UserPoolClientLogPolicy        AWS::IAM::Policy               CREATE_
 UserPoolClientInputs           Custom::LambdaCallout          CREATE_
 IdentityPool                   AWS::Cognito::IdentityPool     CREATE_
 IdentityPoolRoleMap            AWS::Cognito::IdentityPoolRol… CREATE_
Deployed geo mapc9d7723d [ ======================================== ]
 CustomMapLambdaServiceRole4EE… AWS::IAM::Role                 CREATE_
 CustomMapLambdaServiceRoleDef… AWS::IAM::Policy               CREATE_
 CustomMapLambda51D5D430        AWS::Lambda::Function          CREATE_
 CustomMap                      Custom::LambdaCallout          CREATE_
 MapPolicy                      AWS::IAM::Policy               CREATE_

Next, build the environment for displaying the map application. Use the starter "amazon-location-service-starter" and others introduced in the article "Amazon Location Service and AWS Amplify to Use Various Map Library" and place the necessary files in the directory you have created.

Install the packages

npm install

Start local server

npm run dev

The new map style "Open Data" will appear.

6 . Create Pull Request for Code

Next, create a Pull Request for the code. It is helpful to include the category name in the title.

feat(category-geo): add new map style 2022.12

Description of changes
  - New map styles were added.
    - "VectorOpenDataStandardLight"

Issue #, if available
#11620

Description of how you validated changes
Checklist
 PR description included
 yarn test passes
 Tests are changed or added
By submitting this pull request, I confirm that my contribution is made under the terms of the Apache 2.0 license.

7 . Modify Documentation

Next, modify the documentation. After modifying the code, it is helpful to modify the documentation as well.

Fork the Amplify Documentation repository, create a working branch, and modify the target files.

src/pages/cli/geo/maps.mdx

? Specify the map style:
❯ Streets (data provided by Esri)
  Berlin (data provided by HERE)
  Explore (data provided by HERE)
  ExploreTruck (data provided by HERE)
  RasterSatellite (data provided by HERE)
  HybridSatellite (data provided by HERE)
  Topographic (data provided by Esri)
  Navigation (data provided by Esri)
  LightGrayCanvas (data provided by Esri)
  DarkGrayCanvas (data provided by Esri)
  Imagery (data provided by Esri)
+ StandardLight (data provided by OpenStreetMap)

8 . Create Pull Request for Documentation

Next, create a Pull Request for the document. It is helpful to include links to the Issue and Code Pull Request in the body of the message.

Map Style Add

Issue #, if available:
aws-amplify/amplify-cli#11620
aws-amplify/amplify-cli#11621

Description of changes:
New map styles were added.
StandardLight (data provided by OpenStreetMap)
By submitting this pull request, I confirm that my contribution is made under the terms of the Apache 2.0 license.

9 . Merge & Release Pull Request

Finally, the Pull Request is merged and released. Merge is pending confirmation from the maintainer. If there are no problems, the request is merged as is, but if modifications are necessary, the maintainer will send comments to be addressed. After the merge, the release will take several weeks to a month to complete.

Release after the merge will take several weeks to a month to complete.

AWS Amplify CLI - Release v10.7.0

Amplify Docs - Geo Maps

Summary

Contributing to AWS Amplify will help many users. It is also great to see the features you add become available worldwide. Contributing to creating Issues for bug reports and feature requests will also help users.

Let's start where you can together! I hope this example is helpful to anyone who wants to contribute to AWS Amplify!

If you continue to contribute, you could be contacted by maintainers and possibly get a limited SWAG！

AWS Amplify has an active community. There's an official Discord and Slack, so be sure to join! You'll connect with engineers from all over the world!

AWS Amplify - Discord (ENG)
Amplify Japan User Group - Slack (JPN)

Related Articles

Amazon Location Service and AWS Amplify to Use Various Map Library

Yasunori Kirimoto for AWS Heroes ・ Jan 5 ・ 10 min read

#amazonlocationservice #amplify #aws #foss4g

Build a Unique Domain Hosting Environment for Google Domains with AWS Amplify

Yasunori Kirimoto for AWS Community Builders ・ Apr 25 '22 ・ 2 min read

#amplify #aws #s3 #cloudfront

Build a Unique Domain Hosting Environment with AWS Amplify

Yasunori Kirimoto for AWS Community Builders ・ Feb 21 '22 ・ 7 min read

#amplify #amplifyconsole #route53 #aws

Trying Out Various Settings for AWS Amplify Publishing

Yasunori Kirimoto for AWS Community Builders ・ Feb 14 '22 ・ 5 min read

#amplify #amplifyconsole #aws

References
AWS Amplify

Comments

[Basit Mustafa]

Your time, energy, and talents are worth WAY more than giving free labor to a project designed solely by market strategists at AWS to further their revenue stream and lock in. Go contribute to actual OSS projects: not just ones built as closed cloud Trojan horses.

Amplify is a great name for this offering. Because you’re asking us to contribute to an open source ecosystem solely dedicated to further increasing AWS vendor lock in and drive usage on their proprietary cloud services, this Amplifying AWS’ lock-in, revenue stream, and proprietary plays.

What’s next, an article inviting us to come build hotels for Hilton so we get some choice in the paint and a free t-shirt but still have to pay to stay there? Or sharpen sticks that will then be used to poke us in the eye? Knock yourselves out but don’t fool yourself that you are doing Habitat for Humanity or something that even helps you (spoiler: ultimately, it hurts you).

I fully believe in the FOSS (and even the COSS) model. But it’s not truly the OSS model when it simply exists for AWS to get free labor so they don’t have to write their own SDKs and frameworks for their actually closed and proprietary offerings.

And while the academic/theoretical argument could be made one could write a full stack clone of the services involved, it’s also theoretically possible I could run a 4 minute mile and be the next world marathon champion all the whole rating nothing but Cheetos and Mtn Dew, too, so save us all the “benevolent cloud monster” claim that is just fanciful dreaming. The only part of the actual stack that has any credible path to independence is OpenSearch, and that’s just because they got called out and forced to do that by Elastic not putting up with their chicanery.

Don’t be an AWS shill because they’re gonna send you a $10 water bottle, y’all are worth more than some lame swag.