This media is not supported in your browser
VIEW IN TELEGRAM
26. AWS API Gateway
Melkey introduces the AWS API Gateway. It's a fully managed service that makes it easy to create, publish, maintain, monitor, and secure APIs at scale. A gateway is like a front door for an application to access backend services.
#lesson
Melkey introduces the AWS API Gateway. It's a fully managed service that makes it easy to create, publish, maintain, monitor, and secure APIs at scale. A gateway is like a front door for an application to access backend services.
#lesson
Media is too big
VIEW IN TELEGRAM
27. Defining the API Gateway Routes
Melkey defines the routes for the API gateway. Each route has a resource name, the URL path, and the necessary methods like GET or POST. The route resources are added to the gateway with a new lambda integration.
#lesson
Melkey defines the routes for the API gateway. Each route has a resource name, the URL path, and the necessary methods like GET or POST. The route resources are added to the gateway with a new lambda integration.
#lesson
This media is not supported in your browser
VIEW IN TELEGRAM
28. Logging In Users
Melkey begins adding the ability to log in users to the applications. First, a GetUser function is created to return a user from the database.
#lesson
Melkey begins adding the ability to log in users to the applications. First, a GetUser function is created to return a user from the database.
#lesson
Media is too big
VIEW IN TELEGRAM
29. Refactor RegisterUserHandler
Melkey refactors the RegisterUserHandler function to accept an APIGatewayProxRequest object and return an APIGatewayProxyResponse object. The user data is unmarshaled from the request body, and the error-checking logic is updated.
#lesson
Melkey refactors the RegisterUserHandler function to accept an APIGatewayProxRequest object and return an APIGatewayProxyResponse object. The user data is unmarshaled from the request body, and the error-checking logic is updated.
#lesson
Media is too big
VIEW IN TELEGRAM
30. Handling Login Requests
Melkey implements the LoginUser function, which receives an APIGatewayProxyRequest object and populates a LoginRequest struct from the request body. Error checking is added and a "StatusOK" is returned if the login is successful.The changes are then deployed with CDK
#lesson
Melkey implements the LoginUser function, which receives an APIGatewayProxyRequest object and populates a LoginRequest struct from the request body. Error checking is added and a "StatusOK" is returned if the login is successful.The changes are then deployed with CDK
#lesson
Media is too big
VIEW IN TELEGRAM
31. Testing with cURL
Melkey tests the API from the command line using cURL commands. A username and password are sent to the API using a POST method. If CloudWatch Logging errors appear when deploying the application, the `LoggingLevel` property in the go cdk.go file can be removed, or the instructions mentioned in the lesson can be followed.
#lesson
Melkey tests the API from the command line using cURL commands. A username and password are sent to the API using a POST method. If CloudWatch Logging errors appear when deploying the application, the `LoggingLevel` property in the go cdk.go file can be removed, or the instructions mentioned in the lesson can be followed.
#lesson
Media is too big
VIEW IN TELEGRAM
32. Creating a JWT
Melkey introduces JSON Web Tokens (JWTs), which are a URL-safe way of representing secure token-based authentication information between two parties. A CreateToken function generates the JWT and returns it as a string. The chapter 2 branch can be used as a starting reference for this lesson.
- https://github.com/Melkeydev/FrontEndMasters/tree/chapter 2
#lesson
Melkey introduces JSON Web Tokens (JWTs), which are a URL-safe way of representing secure token-based authentication information between two parties. A CreateToken function generates the JWT and returns it as a string. The chapter 2 branch can be used as a starting reference for this lesson.
- https://github.com/Melkeydev/FrontEndMasters/tree/chapter 2
#lesson
Media is too big
VIEW IN TELEGRAM
33. Middleware Package
Melkey creates a middleware to act as a wrapper around requests coming to routes only available to logged-in users. When a user requests a protected route, the middleware will extract the JWT from the Authorization headers and ensure the JWT is valid. Once the JWT is validated, the request is passed to the protected route's handler function.
#lesson
Melkey creates a middleware to act as a wrapper around requests coming to routes only available to logged-in users. When a user requests a protected route, the middleware will extract the JWT from the Authorization headers and ensure the JWT is valid. Once the JWT is validated, the request is passed to the protected route's handler function.
#lesson
Media is too big
VIEW IN TELEGRAM
34. Protected Routes
Melkey adds the protected route to the application and wraps the route's handler function with the middleware. The route details are added to the CDK infrastructure code, and the changes are deployed and tested.
#lesson
Melkey adds the protected route to the application and wraps the route's handler function with the middleware. The route details are added to the CDK infrastructure code, and the changes are deployed and tested.
#lesson
Media is too big
VIEW IN TELEGRAM
35. Wrapping Up
Melkey wraps up the course by sharing some Go resources. The final code can be found on the live workshop branch. The `cdk destroy` command can be run to remove the AWS infrastructure from your account.
- https://github.com/Melkeydev/FrontEndMasters/tree/live workshop
#lesson
Melkey wraps up the course by sharing some Go resources. The final code can be found on the live workshop branch. The `cdk destroy` command can be run to remove the AWS infrastructure from your account.
- https://github.com/Melkeydev/FrontEndMasters/tree/live workshop
#lesson
Title: Web App Testing & Tools
Description: Learn unit, integration, system, E2E testing, mock dependencies, and use Vitest & Playwright for building robust and maintainable web apps!
Link: https://frontendmasters.com/courses/web-app-testing/
Time: 3 hours, 54 minutes
Lessons: 25 / 25
Tags: #course #frontendmasters #720p
Description: Learn unit, integration, system, E2E testing, mock dependencies, and use Vitest & Playwright for building robust and maintainable web apps!
Link: https://frontendmasters.com/courses/web-app-testing/
Time: 3 hours, 54 minutes
Lessons: 25 / 25
Tags: #course #frontendmasters #720p
Frontendmasters
Master Web App Testing | Vitest & Playwright UI Testing Tools Course
Learn unit, integration, system, E2E testing, mock dependencies, and use Vitest & Playwright for building robust and maintainable web apps!
Media is too big
VIEW IN TELEGRAM
1. Introduction
Miško Hevery, the creator of the Angular and Qwik frameworks, begins the workshop by sharing some general benefits of including testing as a part of the application development process. Including tests will improve code quality, increase productivity, strengthen team collaboration, and build confidence in the product.
- https://static.frontendmasters.com/assets/courses/2024-04-02-web-app-testing/web-app-testing-slides.pdf
- https://github.com/mhevery/testing-fundamentals
#lesson
Miško Hevery, the creator of the Angular and Qwik frameworks, begins the workshop by sharing some general benefits of including testing as a part of the application development process. Including tests will improve code quality, increase productivity, strengthen team collaboration, and build confidence in the product.
- https://static.frontendmasters.com/assets/courses/2024-04-02-web-app-testing/web-app-testing-slides.pdf
- https://github.com/mhevery/testing-fundamentals
#lesson
Media is too big
VIEW IN TELEGRAM
2. Common Excuses for Not Testing
Miško discredits the common excuses for not including tests in a codebase. Often, omitting tests is not because of time or scope of work but a lack of knowledge for writing effective tests and having the tools in place to execute them.
#lesson
Miško discredits the common excuses for not including tests in a codebase. Often, omitting tests is not because of time or scope of work but a lack of knowledge for writing effective tests and having the tools in place to execute them.
#lesson
Media is too big
VIEW IN TELEGRAM
3. The Role of QA and AI in Testing
Miško answers audience questions related to the role Quality Assurance has in the testing lifecycle and how AI can facilitate testing. Traditional QA roles were responsible for application testing, whereas modern QA engineers helped define the domain-specific language for testing and the infrastructure for executing the tests.
#lesson
Miško answers audience questions related to the role Quality Assurance has in the testing lifecycle and how AI can facilitate testing. Traditional QA roles were responsible for application testing, whereas modern QA engineers helped define the domain-specific language for testing and the infrastructure for executing the tests.
#lesson
Media is too big
VIEW IN TELEGRAM
4. Types of Tests & Tradeoffs
Miško discusses different types of tests and compares the scope, speed, and isolation attributes of each. The tests discussed are unit, integration, system tests, and end-to-end tests.
#lesson
Miško discusses different types of tests and compares the scope, speed, and isolation attributes of each. The tests discussed are unit, integration, system tests, and end-to-end tests.
#lesson
Media is too big
VIEW IN TELEGRAM
5. Refactoring Code for Unit Testing
Miško explains asynchronous calls can be difficult to unit test when they are part of a more complex function. Refactoring the code and putting the asynchronous call into a separate component makes it easy for a unit test to call the code independently and ensure it's functioning properly.
- https://github.com/mhevery/testing-fundamentals
#lesson
Miško explains asynchronous calls can be difficult to unit test when they are part of a more complex function. Refactoring the code and putting the asynchronous call into a separate component makes it easy for a unit test to call the code independently and ensure it's functioning properly.
- https://github.com/mhevery/testing-fundamentals
#lesson
Media is too big
VIEW IN TELEGRAM
6. Testing with Vitest
Miško introduces Vitest and begins writing a unit test for the GitHub API to verify repository information is returned. The tests are executed in the command line. Vitest also has a user interface that provides a list of tests and reports. Snapshots are also demonstrated in this lesson. The final code is on the lesson-1 branch
- https://github.com/mhevery/testing-fundamentals/tree/lesson-2
#lesson
Miško introduces Vitest and begins writing a unit test for the GitHub API to verify repository information is returned. The tests are executed in the command line. Vitest also has a user interface that provides a list of tests and reports. Snapshots are also demonstrated in this lesson. The final code is on the lesson-1 branch
- https://github.com/mhevery/testing-fundamentals/tree/lesson-2
#lesson
Media is too big
VIEW IN TELEGRAM
7. Mocking External Dependencies
Miško demonstrates how to mock external dependencies with Vitest. Creating a mock allows developers to test APIs without wasting resources or waiting for server responses. For a mock to work, components should be written in a way that allows them to be tested more easily. The final code is located on the lesson-2 branch
- https://github.com/mhevery/testing-fundamentals/tree/lesson-2
#lesson
Miško demonstrates how to mock external dependencies with Vitest. Creating a mock allows developers to test APIs without wasting resources or waiting for server responses. For a mock to work, components should be written in a way that allows them to be tested more easily. The final code is located on the lesson-2 branch
- https://github.com/mhevery/testing-fundamentals/tree/lesson-2
#lesson
This media is not supported in your browser
VIEW IN TELEGRAM
8. Anatomy of a Test
Miško breaks down the anatomy of a test. Tests should contain a setup that initializes anything needed for the test, a stimulus that is the target of the test, and the expectations containing what is tested. A few questions about the differences between unit and end-to-end tests are also answered in this lesson.
#lesson
Miško breaks down the anatomy of a test. Tests should contain a setup that initializes anything needed for the test, a stimulus that is the target of the test, and the expectations containing what is tested. A few questions about the differences between unit and end-to-end tests are also answered in this lesson.
#lesson
Media is too big
VIEW IN TELEGRAM
9. Testing Timeouts
Miško adds a test to verify the asynchronous call times out after a set delay. Testing delays can slow down the test runner, so the test is then refactored so the delay can be resolved immediately. The final code is located on the lesson-3 branch
- https://github.com/mhevery/testing-fundamentals/tree/lesson-3
#lesson
Miško adds a test to verify the asynchronous call times out after a set delay. Testing delays can slow down the test runner, so the test is then refactored so the delay can be resolved immediately. The final code is located on the lesson-3 branch
- https://github.com/mhevery/testing-fundamentals/tree/lesson-3
#lesson
This media is not supported in your browser
VIEW IN TELEGRAM
10. Add Test Boilerplate to beforeEach
Miško simplifies the tests by moving repeated code to the parent describe block. This allows multiple tests to use the same setup logic.
#lesson
Miško simplifies the tests by moving repeated code to the parent describe block. This allows multiple tests to use the same setup logic.
#lesson