AWS App Composer: Visual Drag and Drop Building Made Easy

Overview of AWS re:Invent 2023

Imagine an AI fashion show, where AI is the highlight in everything. In the tech world, if you're not conversing with AI, you're living in the past. At AWS re:Invent 2023, AI was everywhere, from qui trivia, casual tea talks to the keynotes.

AWS re:Invent 2023 was packed with major announcements like new AI tools, advanced chips(Graviton4), and serverless tech. Highlights include Amazon Q(good for legacy code binding with modern security practices: Java based ), an AI assistant, and updates to Amazon Bedrock(AI Model Development Compliance) and Sage Maker AI/ML capabilities.(50 different Gen-AI announcements) ,new Storage Class S3 Express OneZone and One Enterprise

These innovations gave developers and businesses new ways to build and grow their projects.

Introduction to AWS App Composer

Launched at AWS re:Invent 2022, it's a tool that streamlines building serverless apps through a drag-and-drop interface, making architecture design as simple as sketching.

AWS Application Composer syncs real-time visual architecture with Infrastructure as Code (IaC), ensuring changes are mirrored both ways.

Enables building applications visually using over 1,000 CloudFormation resources.

Offers multiple tools: visual design, direct code editing, and AI-powered code suggestions in IDEs.

Supports integration with Workflow Studio for visual orchestration of AWS services or HTTP endpoints via Step Functions workflows.

Deep Dive into AWS App Composer

Here's a concise, technical summary:

Initialize: Import existing AWS SAAM/CloudFormation file or start anew.
Design: Use AWS Application Composer for visual assembly of services.
Organize: Drag and drop resources on canvas.
Connect: Link resources to form application architecture.
Standardize: Obtain IaC definitions based on best practices.
Sync : Automatically synchronize changes between visual architecture and IaC, as done.

AWS App Composer enhances the Developer Experience

Now, developers can use AWS Application Composer along with Code Whisperer and Code Catalyst directly in Visual Studio Code, speeding up into infrastructure-as-code development and minimizing the need to switch between contexts.

Going to a sweet shop where you can find all kinds of sweets, from chocolate to traditional Indian sweets, is like using AWS Application Composer.

https://www.youtube.com/shorts/Lh87fERtzQQ

AWS added more features, including support for over 1000 CloudFormation resources. It's AWSome how it went from supporting 13 services to here.Now Step Functions Workflow Studio works directly inside AWS Application Composer.

By the 2023 re:Invent, AWS made it even easier by integrating AWS Application Composer into the AWS Toolkit for Visual Studio Code, making it like picking up your favorite sweet easily.

Comparison AWS App Composer with Cloud Formation Designer

If we visit CloudFormation, we find a designer that essentially performs the same tasks. It has been around for about six or seven years.

With the CloudFormation designer, we can easily drag and drop components like Lambda functions to generate a CloudFormation template or vice-versa paste your existing IaC to generate diagram. We can pick between JSON and YAML formats, which is easy for converting between the two. Moreover, if we already have a CloudFormation template, example VPC based architecture.

Similarity AWS App Composer and Cloud Formation Designer

AWS CloudFormation Designer v/s AWS Application Composer

Real-world applications / Project Scenarios using AWS App Composer

Prerequisites

Visual Studio Code

https://code.visualstudio.com/

AWS Toolkit for Visual Studio Code

download from here https://marketplace.visualstudio.com/items?itemName=AmazonWebServices.aws-toolkit-vscode

We can prepare one list to improve user experience after testing scenarios with:-

Layers

Merge diagram

AI (Amazon Q/GPT)

testing and comparing with working from CDK (keeping diagram in sync, my pov is to use for documentation perspective only)

Future Room for Development in AWS App Composer.

Canvas support for full properties is required while using Cloud Formation resources.

Pre-Configured VPC

Pre-Configured task definitions

Collaboration within account or guest based permissions for review (export and uploading option works)

Multi-layer IaC support

Conclusion

AWS App Composer takes care of the implementation details. Service infrastructure diagrams are valuable for explaining new features, onboarding new team members.

In my experience high-level designs and turn them into low-level designs, we use draw.io / Lucidcharts and prepare but when new features are rolled out, original design gets changed,old idea gets dropped and loses it value as changes in production infrastructure that we as a a team are proud of core infra part.

Optimal solution would be to sync the service infrastructure diagram with the service code.To update the diagram constantly, is huge pain. Nobody does that.Here AWS Composer comes and play significant role.

It allows you to generate deployable code without requiring deep expertise in AWS Cloud Formation.

About Author

Yashvi Kothari, an Information Communication Technology Engineering graduate from Adani Institute with notable JEE scores (AIR 90K, JEE Advanced 60), specializes in cloud infrastructure operations and security architecture, by direct involvement in POCs, Pre-Prod, UAT,Product Dev and Testing Projects. Certified in AWS Cloud and Microsoft | Oracle Cloud, she's experienced in project management, web development, and have exposure in various IT verticals(AR filter & Web development,IoT,Robotics). Passionate about technical writing and creative graphic design.

For further inquiries or collaborations, reach out to Yashvi Kothari at [email] yashvikothari@outlook.com OR [Contact/WhatsApp number] +91 7990512915.

Site Terms, Privacy, and more.