Enter Your Email Address to Watch This Lesson

Your link to unlock this lesson will be sent to this email address.

Unlock this lesson and all 832 of the free egghead.io lessons, plus get Angular 1.x content delivered directly to your inbox!



Existing egghead members will not see this. Sign in.

Just one more step!

Check your inbox for an email from us and click link to unlock your lesson.



Building an Angular App: Eggly Introduction

1:54 Angular 1.x lesson by

In this lesson, we introduce our sample AngularJS application and discuss our objectives for this series.

Get the Code Now
click to level up

egghead.io comment guidelines

Avatar
egghead.io

In this lesson, we introduce our sample AngularJS application and discuss our objectives for this series.

Avatar
Tony

Are there any dates on when the parts of this series were uploaded? Your comment says "less than a minute ago" but I find it hard to believe I stumbled on this as it was being posted. :)

In reply to egghead.io
Avatar

Hey, the video starts with the project layout already complete. It would be interesting how the author came to this layout with some comments on why this way. Is there a video series that predates this one?

Avatar
john

why not just use the code format of egghead.io. This is annoying. I don't want to have to do something different for this lesson because you don't want to follow the egghead.io code standard. Really? How hard can a getting started code base be?

Avatar
wil

You need to point more deliberately and explicitly with your mouse when you are referring to elements in the markup or javascript. There are many times when it is extremely difficult to see what you are referring to.

Avatar
Julien

It's important to note that you should download and install the WebStorm IDE (30-day free trial: https://www.jetbrains.com/webstorm/download/) to easily run the code on localhost:63342. I started in Sublime Text 3 and my index.start.html looked completely different when I ran it.

Hello, this is Lukas Ruebbelke, and I want to introduce a new series that I'm starting, where we are going to learn how to build an AngularJS application from the ground up.

We are literally going to start with a blank JavaScript file, and a completely static HTML file. Through a series of steps, we are going to go from this basic HTML page and build it up to where it is a fully functional AngularJS application called Eggly, where you can essentially create, read, update and delete, in other words manage, your bookmarks.

For instance, if I click this, it will go to the site, but I can also click and I can edit it. I can delete it. We can click and sort our bookmarks by categories.

We are going to start from scratch, and we're going to build it up piece by piece. The first thing we're going to do is bootstrap AngularJS, then we're going to focus on the views and the controllers, and add in the functionality.

From there we're going to start to look at sub-modules and services, and how to put those together so that your application can scale. We're going to look at how to handle complex state management using UI-router, and from there we're going to get into some fun things, like animations and directives, and then even testing. The sky is the limit.

But for the first part of this, we are going to focus on getting started with AngularJS, and how to add in functionality using views and controllers. I'm super excited to start this series with you, and I look forward to seeing you on the following videos. See you soon.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?