background preloader

Angular

Facebook Twitter

Using rails-api to build an authenticated JSON API with warden. An updated version of my previous tutorials on building an authenticated JSON API with Ruby on Rails In this tutorial I will build a small web application that provides a JSON API to manage customers through a REST interface.

Using rails-api to build an authenticated JSON API with warden

The requests to the endpoints will be authenticated through a token based authentication strategy, passing custom headers (X-User-Email and X-Auth-Token) containing the user’s credentials. A sessions endpoint is available to issue a new authentication token on login and disposing it on logout. The goal of the tutorial is building the base of an up-to-date, well tested, minimal and functional backend API that can be used for clients such as Angular/Ember web apps or even Mobile applications. Environment Specific Configuration In AngularJS using Grunt - Newtriks LTD.

Written by Simon Bailey One aspect of Rails I love is the simplicity of environment specific configuration.

Environment Specific Configuration In AngularJS using Grunt - Newtriks LTD

Out the box, Rails provides configuration for development and production environments and additions are effortless to implement. Using Angular, I typically create a constants module for the application configuration e.g. api url’s, third party service specific data, etc. 15 Useful AngularJS Tools For Developers - Hongkiat. Thinking of dipping your toes into Angular?

15 Useful AngularJS Tools For Developers - Hongkiat

If you have gone through our 10 best tutorials to learn AngularJS post and would like to play around with Angular on your own, you’re on the right post. We have here some tools that can streamline your development workflow. We’re looking at 15 of the best IDEs, text editors, tools for testing & debugging, modules and development tools and apps for building with Angular.

If you have your favorite tools or apps, do share them with us in the comments below. Using JSON Web Tokens to Authenticate JavaScript Front-Ends on Rails. While working on a project recently, I encountered a problem I haven't had to tangle with in a while: authenticating front-end applications against a Rails API.

Using JSON Web Tokens to Authenticate JavaScript Front-Ends on Rails

The last time I was even dabbling in this realm, jQuery was everything, CORS was still in its infancy, and JSONP was still a thing (that's not a thing anymore, right?). The only way I ever managed to scrape by in this hostile environment was to let Rails' asset pipeline serve up the front-end app and rely on same-origin requests and regular ol' cookies to handle authentication. I didn't like it, but I survived. Eventually, I got away from front-end concerns almost completely. Since those dark times, a few tools have cropped up and improved the landscape. At first, I got started by symlinking the front-end to public/ in my Rails app and setting protect_from_forgery with: :null_session. Rails 4, Cors, JWT, and Devise. Simple AngularJS Authentication with JWT. How To Handle User Authentication With AngularJSDevdactic. Implementing a login and user authentication system for your AngularJS app seems to be one of the hardest problems people encounter.

How To Handle User Authentication With AngularJSDevdactic

My article on a simple login with Ionic and AngularJS is the far most viewed article on this blog, every day! As the mentioned article only describes a basic system for a very low level security, this article will highlight everything you need for a complete user authentication and login inside your AngularJS app! In particular this means, this article will show you how to: Log in a user and store the user session (Token based auth!)

Protect your routes based on authentication status and role of the userNotice when an unauthorised request was made and a new login is required As you can see, the complete package for a solid, production ready login system! Setup everything we need As I mentioned, we will create an Ionic project, so we start with a blank project and already install a bower dependency we will need later on. Load our files inside index.html Simon. Techniques for authentication in AngularJS applications — Opinionated AngularJS. How to do loading spinners, the Angular way. Updated on 6/25/15 One interesting problem I had to solve recently was how to elegantly deal with loading spinners on the page without violating separation of concerns.

How to do loading spinners, the Angular way.

Many times, the spinner element is in an area of the DOM controlled by the relevant controller and you can simply toggle a variable in scope and it just works. For example: app.controller('myCtrl', function ($scope, $http) { $scope.loading = true; $http.get('/some/awesome/content') .success(function (data) { }) .catch(function (err) { }) .finally(function () { $scope.loading = false; });}); This works great, but what if your spinner is in a DOM tree that isn't managed by the controller that needs to show it? Even if you manage to solve this scenario, how then do you solve situations where you need to show/hide multiple loading spinners? The directive: Of course, we love directives and some kind of spinner directive seems to make immediate sense. See how the directive calls spinnerService. Transclusion The service: 10 Top Mistakes AngularJS Developers Make.

Table of Contents FREE WORKSHOP: Tips for AngularJS DevelopersMark Meyer is giving a free virtual workshop on Angular best practices and how to avoid some common mistakes.

10 Top Mistakes AngularJS Developers Make

>> Sign up to secure a spot Introduction AngularJS is one of the most popular Javascript frameworks available today. One of AngularJS's goals is to simplify the development process which makes it great for prototyping small apps, but its power allows scaling to full featured client side applications. The combination ease of development, breadth of features, and performance has led to wide adoption, and with wide adoption comes many common pitfalls. 1 MVC directory structure AngularJS is, for lack of a better term, an MVC framework. Templates/ _login.html _feed.html app/ app.js controllers/ LoginController.js FeedController.js directives/ FeedEntryDirective.js services/ LoginService.js FeedService.js filters/ CapatalizeFilter.js This seems like an obvious layout, especially if coming from a Rails background.