Ability to create multiple front-end apps (React plus Swift, Android, etc.)

Is your feature request related to a problem? Please describe. We would like to be able to create a website and mobile apps for a project. It is not clear if/how it possible, plus the /amplify folder setup files appear to be wired for one front-end app only.

Describe the solution you’d like It would be awesome if there was a way to add another front-end app with the CLI. For example, with a command like amplify frontend add or as a part of the amplify init workflow.

For example, let’s say I have a React app already and now I’d like to add an iOS Swift app. Going through the CLI, perhaps I can enter the amplify init flow:

? Do you want to use an existing environment? Yes
? Choose the environment you would like to use: master
? Do you want to add another frontend? Yes
? Choose your default editor: 
❯ Xcode
  Sublime Text 
  Visual Studio Code 
  Atom Editor 
  IDEA 14 CE 
  Vim (via Terminal, Mac OS only) 
  Emacs (via Terminal, Mac OS only) 
  None 
? Choose the type of app that you're building (Use arrow keys)
  android 
❯ ios 
  javascript 
? Enter the name of your source directory: ../packages/my-mobile-app
...

Note that it would be great to be able to specify Xcode as an IDE, as well as a different folder for the mobile app’s source code. This different folder would be helpful for doing a codegen, for example.

Perhaps the amplify/.config/project-config.json file could hold an array of these frontend projects:

{
  "frontends": [
    {
      "projectName": "my-website",
      "version": "1.0",
      "frontend": "javascript",
      "javascript": {
        "framework": "react",
        "config": {
            "SourceDir": "../packages/my-website/src",
            "DistributionDir": "build",
            "BuildCommand": "npm run-script build",
            "StartCommand": "npm run-script start"
        }
      },
      "providers": [
        "awscloudformation"
      ]
    },
    {
      "projectName": "my-mobile-app",
      "version": "1.0",
      "frontend": "ios",
      "ios": {
        "config": {
          "SourceDir": "../packages/my-mobile-app"
        }
      }
      "providers": [
        "awscloudformation"
      ]
    },
  ]
}

Describe alternatives you’ve considered The current work around I’ve been toying with is to use lerna to create multiple packages. In that approach, I have a packages directory that contains a sub-folder for each frontend. However, for one thing, this approach gets problematic when wanting to generate code for an API. Also, for the second front-end that you add, you have to go through a very manual process of trying to ‘hack’ the pieces together for it to work and worry about not breaking the existing app. And there are some files that don’t support multiple front-ends, such as project-config.json.

[ChristopheBougere]

Agreed with @houmark, having as single amplify project shared with multiple frontends would be the best. Something like this:

• /amplify
• /react
• /react-native The CLI could handle this with a amplify frontend add command, similarly to categories.

[UnleashedMind]

Thanks for the feedbacks, marked the feature request, we will have a discussion among the team on this.