Learn AWS as a Frontend Developer
Tags: aws, javascript, react, serverless
Published: 2021-12-25 13:45:34

Amazon Web Services — AWS, the leading cloud-computing platform, is historically being associated with backend technologies such as DevOps, API development, Databases, etc. This is true, given that AWS and other cloud platforms are mentioned randomly in the jobs for backend developers.

However, you can learn relevant AWS technologies for your web apps. Most of those are discussed below.

## **1. AWS Amplify**

![Source: GitHub.com](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pmyrnrhqhp8349nw8zy2.png)

AWS Amplify is a set of purpose-built tools and features that enables frontend web and mobile developers to quickly and easily build full-stack applications on AWS. Amplify provides two services: Amplify Hosting and Amplify Studio.

**1. Hosting**
a. AWS Amplify hosting provides a git-based workflow for hosting full-stack serverless web apps with continuous deployment.
b. Amplify supports the common SPA frameworks, for example, React, Angular, Vue.js, Ionic, and Ember, as well as static site generators like Gatsby.
c. Manage production and staging environments for your frontend and backend by connecting new branches.
d. Set up rewrites and redirects to maintain SEO rankings and route traffic based on your client app requirements.

**2. Amplify Studio**

a. The Studio is a visual development environment that simplifies the creation of scalable, full-stack web and mobile apps.
b. Set up authentication for your app.
c. Powerful and easy-to-understand authorization.
d. Infrastructure-as-code configures all backend capabilities with AWS CloudFormation.
e. Use Studio’s visual designer to build frontend UI components. Choose from dozens of designs in the pre-built UI component library.
f. Import Figma prototypes built by designers into Studio as React code.

## 2. AWS AppSync
AWS AppSync is a service to create GraphQL based APIs for interaction between multiple data sources such as AWS DynamoDB, AWS Lambda, etc.

![Source: GitHub.com](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g1ghzvrjezf9ygyro3b6.png)
source: AWS

Some of its features are:

**1. Real-time, collaborative mobile, and web apps**

AWS AppSync lets you build collaborative apps with shared data that is updated in real-time.

**2. Offline data sync support**

For mobile and web apps, AppSync provides local data access when devices go offline, and data synchronization with 
customizable conflict resolution, when they are back online.

**3. Integrating data from multiple sources**

AWS AppSync allows access data in Amazon DynamoDB, triggers AWS Lambda functions, or runs Amazon OpenSearch queries, etc.

**4. Data collision detection and conflict resolution**

AWS AppSync can automatically resolve conflicts on data that is shared between multiple users and devices.

**5. Secure data access**

Amazon AppSync integrates with Amazon Cognito and AWS Identity and Access Management, so you can set fine-grained permissions on GraphQL operations and keep users and app data secure.

## 3. Amazon Device Farm

AWS Device Farm provides an extensive range of desktop browsers and mobile devices to test web and mobile applications. It creates videos and logs to help identify issues.

**a. Automated testing in parallel on multiple devices.**
![Source: GitHub.com](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k685u3ykaqtjhr51fj7v.png)
Source: AWS

**b. Test your app on any device directly from your browser.**
![Source: GitHub.com](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7r314oxcns7qvxqft4h9.png)
Source: AWS

## 4. Amazon Location Service

The location service provides maps, trackers, route calculators, and more services. All queries are anonymous and user data is not passed. Esri and HERE services are used for routes, tracking, and geofencing.

## 5. AWS CodeCommit

You might have been using GitHub, BitBucket, and GitLab for hosting your codebase, however, AWS CodeCommit is also another solution for your scalable private repos. It is highly available, secure, fully managed, and can store anything.

## 6. AWS X-Ray

AWS X-Ray helps developers analyze and debug production, distributed applications. With X-Ray, you can understand how your application and its underlying services are performing to identify and troubleshoot the root cause of performance issues and errors. X-Ray provides an end-to-end view of requests as they travel through your application, and shows a map of your application’s underlying components. It helps developers with:

a. Review request behavior

b. Discover application issues and improve application performance

c. Designed for a variety of applications

![Source: GitHub.com](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/iiffft606zi141xs1kpd.png)
Source: AWS

The above-mentioned services are more suitable for frontend development and can be a good addition to your skillset.
Let’s connect on [Linkedin](https://www.linkedin.com/in/thealiraza/), [Twitter](https://twitter.com/nowaliraza)
Thank you.