background preloader

User Authentication/Password Forms

Facebook Twitter

Plunker. On the Bleeding Edge: Advanced AngularJS Form Validation - Real Code by RealCrowd. (Note: This article has been updated to use AngularJS 1.0.8 and Bootstrap 3.0.0.

On the Bleeding Edge: Advanced AngularJS Form Validation - Real Code by RealCrowd

If you are using earlier versions the syntax may be slightly different.) We’ve been using AngularJS for the past few months and in general it has been really great. There has definitely been a learning curve, but the best part of the design is that it really encourages you to extend it properly. Whenever you try to hack something, it just feels wrong and you are forced to look at your problem from a different perspective. The benefit is the resulting solution is usually much more modular and portable.

I have had several occasions where I’ve had to write my own directives, providers, filters, etc. One of the cool features of angular is the form validation. Result: The above example is functional and works fine. So now our controls are conditionally decorated with an ‘has-error‘ css class if they are currently invalid courtesy of the ‘ng-class‘ directive. Authentication in Single Page Applications with Angular.js - A Modest Proposal. 9/2/2014 update:The GitHub repo now uses UI-router instead of the standard ngRoute routing module.

Authentication in Single Page Applications with Angular.js - A Modest Proposal

This blog post will still illustrate the original technique utilizing ngRoute, while information regarding the UI-router approach can be found in the GitHub repo as well as this blogpost. The example app in the repo has been deployed to Heroku, so now you can test it out live for yourself right here. A separate blogpost discussing the complementing server-side code can be found here. I have been working a lot with Angular.js lately, and love how easy it makes it to create web applications with rich client-side functionality. It's an extremely useful asset in keeping your own client-side code lean, making it easy to separate business logic and declarative markup for anything view specific. Authentication in Single Page Applications with Angular.js Part 2 - A Modest Proposal.

As you may have gathered from the title, this is a follow-up to a post I wrote a some time ago regarding role-based authentication/authorization in single page applications.

Authentication in Single Page Applications with Angular.js Part 2 - A Modest Proposal

This time I'd like to highlight how I implemented routing and authorization in the Node.js server that complements my Angular client. Ng-include - Sign-In. Authentication in Single Page Applications with Angular.js - A Modest Proposal. Authentication in Single Page Applications with Angular.js - A Modest Proposal. Facebook authentication in your AngularJS web app. Recently I already wrote about how to handle user authentication in a web app built over AngularJS, and I suggest you to read that article before continuing with the reading of this.

Facebook authentication in your AngularJS web app

This time, even moved by a comment to my previous post, I would like to make a step further, trying to implement a login system based on the Facebook’s authentication system. Spoiler: at the end you’ll find that all this is more easy of how you can think. Deal with users authentication in an AngularJS web app. This post is meant to share some thought about the main issues related to the user’s authentication in an AngularJS web app.

Deal with users authentication in an AngularJS web app

This post is about how to maintain, and recognize, the status of authentication of an user (that is, if he’s logged in, or not) between the different routes of a web application. Moreover it also explains how to handle the case of a not authenticated user, who is trying to access to a page, that requires the user to be logged in. Before going into the details of my approach, it is very important to clarify that, because the user has full controll of the browser, each control implemented with front end technologies, must (!)

AngularJS Directive to test the strength of a password. Recently I’m working a lot with AngularJS and validation of forms, and maybe you have noticed this (see: form validation, and pwCheck directive).

AngularJS Directive to test the strength of a password

The topic of today is not strictly related to form validation, but, like also the form validation, it could be useful to improve the form usability, and even the user’s data security. Always more frequently during the registration on a new website, I happen to see that the password that I chose is judged, and I’m informed about its strength value. I think this is very useful for a lot of reasons, that everybody can understand alone. AngularJS Directive to check that passwords match. I already wrote about form validation some time ago.

AngularJS Directive to check that passwords match

And in that occasion I had the opportunity to show you how much powerful is the native form validation system of AngularJS. But no matter how powerful, of course, it can not cover all possible scenarios. For example we all are used to fill two times the password fields during the registration on a new website. Currently AngularJS has not a native method to check, during the form validation, if the typed passwords have the same value. If you’ve read the previous article, you also know that validation system of AngularJS could even be extended with custom directives.