Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m

Next lesson playing in 5 seconds

  • Overview
  • Transcript

1.2 App Demo

Before we get started with actual development, let me walk you through the project that we're going to be creating. Basically, this is going to be a simple project management system. Think of it as a super basic version of Basecamp or Trello, where we'll have projects and then those projects will have conversations, and you basically have a set of users that can interact in these areas. So we'll start on our home page here. And of course, notice that when we're not logged in, these links do not work. I can go ahead and log in as one of the users of the system. And once we log in, you can see that we have a Log Out button up here, which lets us know we're logged in. And now, I can go to the Projects page, which shows me a list of the projects that I have. Notice we have some icons here showing who's involved with each project. Another neat thing to notice, notice this Annual Company Dinner project, I'm actually not allowed to do anything in there. It's really just view only for this user, so we have a lock here to show that. And of course, their icon does not show up below. But let's check out this project here. You can see we have some different conversations going on here. I can open up a conversation, and I can go ahead and write a message. We could also start a New Conversation, and then I can go ahead and add a message here. And we do actually have some basic live features going on, too, for this conversation. You can see if I open up the same conversation in a different user account, I can add a message here. And notice, it immediately shows up in mine, and just a few seconds later, you can see it shows up over here for other users of our system. So in that way, we can have a dynamic conversation. So there you go. It may look like a pretty basic application, but I think you'll find that there are tons of Angular 2 features that we'll be able to use here. So if you're ready, let's begin by setting up the project in the next lesson.

Back to the top