aboutsummaryrefslogtreecommitdiffstats
path: root/docs/content/tutorial/step_00.ngdoc
diff options
context:
space:
mode:
authorIgor Minar2011-06-15 22:31:40 -0700
committerIgor Minar2011-06-15 22:31:40 -0700
commitb842642b574a2b95c53b791308ed1bf8ff9d304d (patch)
treefb26431c5372be74de2105df77e94dea4f198489 /docs/content/tutorial/step_00.ngdoc
parentd428c9910e66246c2af46602499acaeaf187d75b (diff)
downloadangular.js-b842642b574a2b95c53b791308ed1bf8ff9d304d.tar.bz2
docs - stripping extra new lines
Diffstat (limited to 'docs/content/tutorial/step_00.ngdoc')
-rw-r--r--docs/content/tutorial/step_00.ngdoc42
1 files changed, 1 insertions, 41 deletions
diff --git a/docs/content/tutorial/step_00.ngdoc b/docs/content/tutorial/step_00.ngdoc
index 09b06109..a8243d47 100644
--- a/docs/content/tutorial/step_00.ngdoc
+++ b/docs/content/tutorial/step_00.ngdoc
@@ -2,19 +2,14 @@
@name Tutorial: 0 - angular-seed
@description
-
<ul doc:tutorial-nav="0"></ul>
-
-
You are now ready to build the phonecat application. In this step, you will become familiar with
the most important source code files, learn how to start the development servers bundled with
angular-seed, and run the application in the browser.
-
-
<doc:tutorial-instructions show="true">
<doc:tutorial-instruction id="git-mac" title="Git on Mac/Linux">
<ol>
@@ -25,7 +20,6 @@ angular-seed, and run the application in the browser.
the number of the step you are on. This will cause any changes you made within
your working directory to be lost.</p></li>
-
<li>To see the app running in a browser, do one of the following:
<ul>
<li><b>For node.js users:</b>
@@ -50,8 +44,6 @@ directory.</li>
</doc:tutorial-instruction>
-
-
<doc:tutorial-instruction id="git-win" title="Git on Windows">
<ol>
<li><p>Open msysGit bash and run this command (in angular-phonecat directory):</p>
@@ -84,8 +76,6 @@ directory.</li>
</doc:tutorial-instruction>
-
-
<doc:tutorial-instruction id="ss-mac" title="Snapshots on Mac/Linux">
<ol>
<li><p>In angular-phonecat directory, run this command:</p>
@@ -118,8 +108,6 @@ href="http://localhost:8000/app/index.html">http://localhost:8000/app/index.html
</doc:tutorial-instruction>
-
-
<doc:tutorial-instruction id="ss-win" title="Snapshots on Windows">
<ol>
<li><p>Open windows command line and run this command (in angular-phonecat directory):</p>
@@ -153,15 +141,11 @@ href="http://localhost:8000/app/index.html">http://localhost:8000/app/index.html
</doc:tutorial-instructions>
-
-
You can now see the page in your browser. It's not very exciting, but that's OK.
-
The static HTML page that displays "Nothing here yet!" was constructed with the HTML code shown
below. The code contains some key angular elements that we will need going forward.
-
__`app/index.html`:__
<pre>
<!doctype html>
@@ -173,10 +157,8 @@ __`app/index.html`:__
</head>
<body>
-
Nothing here yet!
-
<script src="lib/angular/angular.js" ng:autobind></script>
</body>
</html>
@@ -184,73 +166,51 @@ __`app/index.html`:__
-
-
-
## What is the code doing?
-
* xmlns declaration
-
<html xmlns:ng="http://angularjs.org">
-
This `xmlns` declaration for the `ng` namespace must be specified in all angular applications in
order to make angular work with XHTML and IE versions older than 9 (regardless of whether you are
using XHTML or HTML).
-
* angular script tag
-
<script src="lib/angular/angular.js" ng:autobind>
-
This single line of code is all that is needed to bootstrap an angular application.
-
The code downloads the `angular.js` script and registers a callback that will be executed by the
browser when the containing HTML page is fully downloaded. When the callback is executed, angular
looks for the {@link api/angular.directive.ng:autobind ng:autobind} attribute. If angular finds
`ng:autobind`, it creates a root scope for the application and associates it with the `<html>`
element of the template:
-
- <img src="img/tutorial/tutorial_00_final.png"/>
-
+ <img src="img/tutorial/tutorial_00_final.png">
As you will see shortly, everything in angular is evaluated within a scope. We'll learn more
about this in the next steps.
-
-
## What are all these files in my working directory?
-
Most of the files in your working directory come from the {@link
https://github.com/angular/angular-seed angular-seed project} which is typically used to bootstrap
new angular projects. The seed project includes the latest angular libraries, test libraries,
scripts and a simple example app, all pre-configured for developing a typical web app.
-
For the purposes of this tutorial, we modified the angular-seed with the following changes:
-
* Removed the example app
* Added phone images to `app/img/phones`
* Added phone data files (JSON) to `app/phones`
-
-
# Summary
-
Now let's go to step 1 and add some content to the web app.
-
-
<ul doc:tutorial-nav="0"></ul>