On the 9Lessons.info site they've posted a tutorial walking you through the creation of an application using Iconic 3, Angular 4 and a PHP restful API and how to handle user authentication and signup. It's a continuation from this previous post that kicked off the series.

Today’s post explains how to implement login authentication system for your AngularJS applications. It will show you how to log in with a user and store the user session, so it deals with token based authentication. Since we are using token based authentication, it protects if any unauthorized request is made and notices for a new login if required. This makes your application’s authentication to be more secured compared with any other authentication system. Every user details will be stored in an external database and a PHP based API is used in the backend for handling this authentication. Hope you’ll find it more easily using this as your authentication system in your AngularJS projects.

They assume you've worked through the previous post and already have the basic structure of the application set up. They share a screencast showing the process but also include the key details - database tables, code and markup - in the post for those that prefer to follow along that way.

The TutsPlus.com site has kicked off a new tutorial series today with part one of a look at using the WordPress REST API and AngularJS to create an API-powered frontend application.

In this series about building a WordPress-powered front end with the WP REST API and AngularJS, we will put the knowledge acquired in the introductory series to use. We will learn how we can leverage this knowledge to decouple the conventional theme-admin model supported by WordPress until now. We will plan and build a single-page application (that I've named Quiescent) with a WordPress back end which will feature posts, users, and categories listing pages. We will configure AngularJS routing and build a custom directive and controllers for the resources mentioned above.

In this first part of the series they walk you through some of the planning steps before the application even gets written (including wireframes). From there they get a bare-bones HTML structure setup for the Angular app to live in and make a matching WordPress plugin. This plugin will return a featured image, author name, associated categories and image resize data related to a post. The code for the plugin is included.

The SitePoint PHP blog has posted a new tutorial from author Francesco Malatesta that continues their series looking at combining AngularJS and PHP, more specifically Laravel, to create a basic application. In this part of series he builds on the server-side code created in part one and creates the Angular frontend.

In part 1, we built our server part. Now we can build our client. We are going to use AngularJS to make a Single Page Application. We will use a very basic bootstrap template, built on the fly.

The application is simple enough and will consist of three "screens" (not "pages" since it's a single page application): a login, a signup and a main screen. He walks you through the setup of a standard frontend development environment including tools and software you'll need to get started. He makes the simple route and Blade template for the single-page app and defines some AngularJS routes for each of the screens. He then includes the code to set up both the signup and login controllers and how to detect if the user is successfully logged in. From there he gets into the functional part of the application: managing the books and the user's wishlist with the standard CRUD (create, read, update and delete) operations. Screenshots are also included at some spots so you can ensure your progress matches the tutorial.

The SitePoint PHP blog has a tutorial posted showing you how to combine Laravel and AngularJS to create flexible and easily maintainable applications on both the frontend and backend of the app. He also covers a topic he says other tutorials leave out: scaling.

In this article, we’re going to set up a Laravel API with Angular Material for the front end. We’re also going to follow best practices that will help us scale with the number of developers working on the project and the complexity behind it. Most tutorials cover this topic from another perspective – they completely forget about scaling. While this tutorial is not targeted at small todo apps, it is extremely helpful if you’re planning to work with other developers on a big project.

He includes a link to the final product in action and spends the rest of the tutorial walking you through it's construction. First he sets up the Laravel application, also installing the debug bar for easier debugging. He installs gulp, bower and the "laravel-elixir-angular" package to make creating the AngularJS frontend simpler. He shows how to create the folders for the Angular application and the creation of the gulpfile.js configuration to build out the app. He uses bower to install the latest Angular, builds out the main module and connections the frontend to the backend.

From there he starts building out the actual application that outputs some basic content, generated by Angular. He hooks in some other pieces of functionality and libraries including: ui-router, Restangular, Toast and the use of dialogs. He ends with a look at deploying the application and maintaining code quality via jshint, phpcs and JSCS.

Barry vd. Heuvel has a post to his site sharing a step by step guide to setting up OAuth in a Lumen+AngularJS application via Socialite and Satellizer (an AngularJS library for OAuth and token based authentication).

In the last few weeks, Socialite was a popular topic to blog/tweet about. Coincidentally, I also needed Socialite for a project. But in my case, I wanted to use it in an Angular app, distributed using Cordova (Phonegap) as hybrid app on Android/iOS. There were some examples, but I couldn’t find much about it at the time. A few people asked to share my experience about it, so here it is!

He starts by linking to all of the tools you'll need to help get some background on them including a helpful guide to installing Satellizer. He then goes over the flow of the entire process, from the initial call from the AngularJS side to authenticate, through the backend Lumen/Socalite/Satellizer handling and then back out to the Javascript where the token is then stored. With this established, he gets into the implementation details starting with the Lumen code to make the API request to GitHub then working with the JWT tokens and responding back to the AngularJS frontend with the result.

Scotch.io has posted the second part of their series (here's part one) continuing their look at using tokens for authentication in an AngularJs+Laravel application. They pick up where they left off in the previous part and focus on adding more of the systems around the token.

In the tutorial on Scotch.io we created a new app called jot-bot to look at how to implement token-based authentication in AngularJS and Laravel by using jwt-auth and Satellizer together. On the Laravel side, jwt-auth let’s us generate JSON web tokens when the user inputs their credentials. [...] There were a few things for a complete authentication solution that we didn’t get to in the last tutorial, including: Setting the logged-in user’s data (such as name and email address) and their authentication status, a way to redirect the user to the login page if they become logged out and how to log the user out and the implications of token-based authentication on logout.

He starts by updating the AuthenticateController to handle getting the authenticated user based on the token information. He also adds the matching route and show the kind of data it should return. He then switches to the Angular side and creates the controller to hook into the backend and get the current user information. The tutorial then shows how to relay user information back to the view and what it might look like. He then goes through a similar process for adding the logout handling including redirecting the user when logged out. Finally, he shows how to initialize the user on the frontend when the application loads, pulling the data from localstorage and checking for a valid existing session.

Scotch.io has posted the second part of their series today showing you how to build a simple time tracking application with Laravel and AngularJS. In this latest part of the series he finishes the application and connect the two pieces.

This is the second of a two-part series on using Laravel 5 and AngularJS together to build a simple time tracking application. If you’ve gone through part 1, you’ll have seen that we put together the front-end first and used a simple JSON file with some mocked-up data to test with. We left off with the ability to add new time entries and have the total time from all of them display on the side. We didn’t include any way to edit or delete the time entries, and of course there was no persistence to a database. In this part we will complete the application so that the time entries get stored in a database and our Angular front-end and Laravel backend work together to create, read, update and delete from it.

He starts by helping you get a Laravel application up and running (time-tracker-2), set up the database and modify the configuration to point to the database location. He helps you run the migrations to set up the database tables and generate the related model code. Next up he shows how to inject the seed data, setting up the main index view and adding in routes for the Angular code to access. The rest of the article is just about as detailed and covers steps to:

• View all the Available Routes
• Return all Time Entries
• Return All Users
• Updating the front-end
• Setting up the users list
• Creating time entries
• Updating time entries
• Deleting time entires

Finally he wraps it all up with a few possible things that could be done to improve the application, both simple and a bit more complex. He challenges you the developer to implement those features.

On the Scotch.io site there's a new tutorial showing you how to build a time tracking application with a combination of Laravel and AngularJS. This is the first part of a new series and focuses on the basic principles and getting some of the first parts of the application up and running.

Laravel and AngularJS work great together, but it can be a little tricky to get going at first, especially if you are new to the frameworks. In a previous article, Chris showed you how to make a Single Page Comment App with Laravel and Angular. This tutorial will again bring the two frameworks together as we build out a simple time tracking application.

We’ll be going into a lot of detail in this tutorial, so to make things manageable it has been broken into two parts. The first part will focus on getting the front-end setup with AngularJS and the second part on getting the backend setup with Laravel 5.

He starts with an overall look at the application and what functionality it will have. From there he walks you through:

• Setting up the folder structure
• Installing dependencies
• Creating Javascript files
• Setting up the view
• Adding extra styling
• Fetching the time data

He makes use of the Moment.js library to perform some of the time calculations for the difference and total time elapsed. He ends the post by tying up some loose ends with the controller and updating the view with the new calculated time values.

On the SitePoint PHP blog there's a new tutorial posted (by Daniel Sipos) about combining Drupal and AngularJS to make for more front-end focused, responsive applications.

Angular.js is the hot new thing right now for designing applications in the client. Well, it’s not so new anymore but is sure as hell still hot, especially now that it’s being used and backed by Google. It takes the idea of a JavaScript framework to a whole new level and provides a great basis for developing rich and dynamic apps that can run in the browser or as hybrid mobile apps. In this article I am going to show you a neat little way of using some of its magic within a Drupal 7 site. A simple piece of functionality but one that is enough to demonstrate how powerful Angular.js is and the potential use cases even within heavy server-side PHP frameworks such as Drupal.

He walks you through the creation of a simple addition of a block that lists out the titles of some other nodes. You'll need an existing Drupal installation to follow along (no setup instructions here) as well as an Angular structure for a small application. He starts with the module configuration and creates custom handling to return the JSON result back to the waiting JS connection. Then he creates the custom template and block that the AngularJS will output the results too. Finally, with that rendering, he glues them both together in an Angular controller that loads the results when an "Open" button is clicked.

On the Angular Tips site today they have a tutorial posted showing you how to combine the power of the Angular JS frontend framework with a Laravel backend. They walk you through the full process of getting an application up and running, including a bit of actually functionality (not just a "Hello World").

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.

They start by getting everything you'll need installed, both on the Laravel and Angular sides. Then it gets into the actual development of the application, changing up the default Laravel page to include Angular and a little test to be sure it's working correctly. With this working correctly (after a little route updating too) they get to the more real-world application: a listing of TV shows generated from a dataset on the Laravel backend. They include all the code you'll need to create the frontend app and display the results.