The technical debt has been piling up fast in our FeedComponent. It’s time to refactor that business logic out into services - and today on the show we’ll teach you how to get started.

(Spoiler: If you’ve done any Spring or Guice or Java EE6+ - this will be a piece of cake!)

You can always grab tagged source code on the GitHub repo which will be tagged day1, day2, etc.

You can Subscribe to my Fresh Bytecode channel for regular Java/Web-related screencasts, or if you’re just into Angular, checkout the YouTube Playlist where I update all the episodes in this series as they come out.

Here’s the script so you can follow along at home:

[ ] If you’ve used Spring or @Inject, this is all super familiar!

[ ] First we’ll create a user service

ng g s User

[ ] Note the @Injectable

[ ] Then we’ll implement a current user method

getCurrentUser() : string {
    return 'Glen';
  }	

[ ] Let’s write a test for that service (using Jasmin)

expect(service.getCurrentUser()).toBe('Glenz');

[ ] Run the test

ng test --build=false --watch=false 

[ ] Fix the test

[ ] Inject the UserService into the FeedComponent

import { UserService } from '../user.service';

providers: [UserService],

constructor(private userService : UserService) { }

[ ] Replace all our backing component refs to ‘Glen’

[ ] Replace all our view component refs to ‘Glen’

[ ] Move the provides to the ng Module level

[ ] Talk about implications of exporting ngModule services

[ ] Cue Applause. Tomorrow we’ll tackle the FeedService