Alright, time to take end to end (e2e) testing to the next level.
If you’re new to end to end testing, our previous article is a good place to start. It will help you understand why you need e2e testing and how you can get started.
This article takes things to the next level. We’ll talk about –
- Different end to end testing frameworks and which one you should choose.
- Reducing test rigidity and flakiness using the Page Object model design pattern.
- Protractor’s element explorer for playing around and debugging.
We also have a simple demo application for you to play with.
Moving forward we’re assuming you’re already familiar with Protractor’s syntax. If not, have a look at Protractor’s API.
“What is a Custom Component in Angular?”
We get this question ALL the time. It’s time to address it through this article.
By the end of this article, you’ll know a lot more about –
- Custom Components
- How they are different from Regular Components
- How you can create your own Custom Components in Angular
- Best practices for writing Components
If you read till the end of the article, we also have a little something for you. This special something changed the way I structured my applications.
Wait…! Didn’t I just upgrade to Angular 2?
Now you’re telling me I need to upgrade to Angular 4?! Is this project even stable…?
And what on planet Earth happened to Angular 3?
Before we start, calm down. Your existing application code is not useless, and you don’t need to learn a new framework all over again.
The good news is that Angular 4 is almost exactly the same as Angular 2, from a development point of view. Most of the changes are “in” the framework. Upgrading is as simple as installing the new dependencies. But more on that later…
Angular 4 is going to be faster, much faster, and according to the Angular team up to 60% smaller applications!
Before we talk about how all this works, let’s answer the question you have…
What happened to Angular 3?
In this article, you’ll learn how to connect your Angular application to a backend service or API.
You’ll learn about –
- The HTTP protocol and how our application will use it to communicate with the server.
- Observables and how you can use them to make async requests.
- A teeny tiny bit of RxJS – map, and catch.
- Angular’s HTTP service.
- Protecting your app from CSRF (Cross Site Request Forgery).
Now even though that may sound like a lot of work, it isn’t a bad thing! These tools and high-level frameworks can save you a lot of time and trouble.
Today we’ll talk about TypeScript and how you can work with it’s types.
“Data-driven web applications”. That’s what most of us are building. That means our application takes in data, processes it and then displays the processed (and / or raw) data in some form.
If you’ve been developing websites for a while, you’ve probably had to deal with DOM manipulations of some sort. These DOM manipulations aren’t straightforward and the code that we end up with isn’t very pretty. Libraries like jQuery made DOM manipulation easier, but the resulting code still looks clunky.
Displaying data isn’t the only challenging task. Dealing with user inputs and updating values can become tiring very quickly.
That’s exactly why we have front-end frameworks like Angular. They make it easier for us to mainpulate and bind data.
Recently, we spoke about the basics of routing with Angular 2. We covered everything from configuring the router to adding basic routes to your application. If you’re just getting started with Angular 2 routing, glance over the other article.
We’ve equipped our users with the ability to move around our application. They can see different components based on the route they are on. We can link our users to different parts of our application with
RouterLink and highlight those links when the route is active with
We’ve also covered how to add routes in child modules instead of having a massive
But there is so much more in a data-driven application. Many applications move from list view to item view – where a user selects one item from a list and is shown the details of that item in a new route. This means we need to figure out how to send arguments in our routes and read them in the components.
Strap your coding gloves on, because we’ll be covering that and a lot more!
Did you sit in one place all day, every day last week? Or did you make a few trips to work, the grocery store or the theater?
If you aren’t locked up in your room most of the day, chances are you move around a lot.
Users are no different. When they’re on your next killer web application, they are going to update their profile picture, place an order, monitor their stats or just change their settings.
We wouldn’t want to show them all this information in one place. That would just cramp things up. Imagine cooking, eating, working, and sleeping on your study desk. Not so much fun…!
That’s why our web application needs different places to show the user different sets of data.
But the user can’t get there all by himself. We need to show him the route.
All applications have some amount of asynchronous code. Imagine if you had to wait for every application on your computer to complete a task before you could do something else.
What if you had to wait for all the posts to load on Facebook before you could see your Facebook home page.
That’s just not how the internet works. Everything is asynchronous. Google Analytics is asynchronously tracking your every move as you read this article…