Angular Tips

Join us in our way to learning Angular.js

Migrating Directives to Angular 2

| Comments

Angular 2 it is just around the corner and people are still afraid because Angular 2 changes too much and it will hard to migrate. That is not true at all, in fact you will see how easy is Angular 2 by highlighting the semantic shift between those two.

Let’s migrate a directive from Angular 1 to Angular 2. I love accordions, everybody love accordions! Let’s migrate ui-bootstrap accordion to Angular 2. I can’t assume that you’re familiar with it, so we are code both at the same time, explaining the differences along the way. I highly recommend you to, at least, replicate yourself the Angular 2 one.

Use this plunker to code the Angular 1 version.

Use this plunker to code the Angular 2 version.

Why Will Angular 2 Rock?

| Comments

This article has been update in September 1st. Now it is using TypeScript and angular 2.0.0-alpha.36

Note: If the “foo” alerts from the plunkers starts popping out without reason, please leave a comment and I will look for a different solution.

DISCLAIMER: Angular 2 is still in Alpha stage so the syntax I present in here is subject to be changed and|or simplified. I am using Angular 2.0.0-alpha.36. Also, what I write in here is just my opinion and I could be wrong.

Angular 2 is around the corner and there are mixed opinions about it. Some people can’t wait for it and other people are not any happy with it. Why is that? People are afraid to change, thinking that they wasted their time learning something that is now going to change in a radical way.

Angular is a great framework, but it is 6 years old, and that for a framework is too much. The web evolved a lot since Angular inception in 2009 and the Angular team can’t simply implement those new stuff without breaking half of the actual implementation.

So if they have to break Angular to be able to make it “modern”, it is better to write it from scratch. How so? Angular itself has other problems like the complex syntax for directives, 5 types of services that confuses new users, writing stuff in the wrong scope…

They decided to kill 2 birds with one stone. A new simplified Angular with all the new stuff like shadow dom and also none of the Angular 1 problems.

So my friend, don’t worry, Angular 2 will rock.

An Introduction to Angular 2

| Comments

DISCLAIMER: Angular 2 is still on a developer preview, so it has a lot of missing features, broken stuff and it is also subject to change.

Ready for Angular 2? You bet!

For this demo, we are going to code an application which requests german words. The word will also come with its translation if the user is authenticated.

First, grab the KOA backend from here, then:

$ npm install
$ node server.js

A Backend-less Plunker

| Comments

So you are asking for help and someone says… hey plunk it so we can see it.

Right, even when we should be able to reproduce any problem in a small example, there are some difficult ones.

Imagine this conversation:

  • Hey I am creating a todo list but when I try to update a todo it changes and then immediately changes back.
  • Good, can you make a plunker for that?
  • Uhm no, it uses my (insert here a backend) and I can’t use it on a plunker.

It is not an uncommon issue at all. What could be a good solution? Swap our service that talks with the backend with a different one swapping the $http calls with fake data? Yeah, we could, but if you start modifying your original implementation, it will be harder to debug, because the problem could lie on that original service and it is not there to test.

Working With Laravel + Angular - Part 2

| Comments

Last time we saw a couple of different options on how to integrate Angular and Laravel. Today we are going to learn how to create our backend and frontend as separate applications but having them work together under the same domain. Every request will go to angular except the ones for /api which are going to be managed by Laravel.

Working With a Laravel 4 + Angular Application

| Comments

So you decided that Laravel is a great choice for a backend and that Angular is going to fit perfectly as the framework of choice for the frontend. Yeah! That is correct and I am starting to like you.

How to start? So many question, so little time (someone said :P)

My New Angular Workflow With Gulp

| Comments

NOTE: The workflow readme will be always a little more updated than this article.

Here is yet another angular boilerplate opinionated in how I work with Angular. I made it for myself but if you find that my opinions are good for you, feel free to use it and collaborate with issues or pull requests.

Let’s start with the app folder:

App folder