Estando buscando cursos sobre Angular descubrí este buen libro el cual me ayudó a desarrollar mi primera web app. Les dejo la imagen del libro escrito por Sandeep Panda, el cual lleva cómo título ANGULARJS: NOVICE TO NINJA.
Es posible que encuentren el libro en https://onlybooks.org
Me gusto la manera en que el libro está diseñado y cómo de inmediato nos hace hacer cosas. No es para el completo novato pues desde la primera app ya necesitamos tener cierta soltura en esto del desarrollo wey, aunque muy básica. También les hago notar que en el código con el que creamos la primera app hay un error, un sígno de "enter", o sea la flechita que va hacia abajo y a la izquierda, que está demás. También es necesario que tengan instalado node.js y que sepan manejar mínimamente la command line, pero mínimamente, al menos para el inicio del libro.
A continuacíon les dejo los pantallazos de mi app a la cual le di estilos en CSS. Les pego el código también para que lo vean:
<!doctype html>
<html lang="es" ng-app>
<head>
<meta charset="utf-8">
<title>My First AngularJS App</title>
</head>
<style>
* {
font-size: 1.25em;
}
body {
background-color: #fff;
width:960px;
margin: 0 auto;
font-family: sans-serif;
}
#container {
width: 95%;
margin: 30px auto 0;
padding: 5px 5px 0 5px;
background-color: #E8E8E8;
border-radius: 10px;
border-style: double;
}
h3 {
margin-bottom: 0;
}
footer {
padding-top: 100px;
margin-bottom: 0px;
text-align: center;
font-size: .5em;
}
</style>
<body ng-init="salary=0;percentage=0">
<div id="container">
<h1>Primera app con AngularJS</h1>
<h3>¿Cuánto ganas mensualmente?</h3>
<input type="text" ng-model="salary">
<br/>
<h3>¿Qué porcentaje de tu ingreso gastas en libros?</h3>
<input type="text" ng-model="percentage"><strong>%</strong>
<br/>
<h4>La cantidad que gastarás en libros será: $
<span>{{salary*percentage*0.01}}</span></h4>
<script src="lib/angular/angular.js"></script>
</div>
<footer>
<p><strong>ARGON © 2015</strong><p>
</footer>
</body>
</html>
El anterior código corre bien y además ya trae el plus del CCS3 y que he pasado cosas al español. Como ven, quitando el css que yo añadí, el html es alrededor de 25 líneas.
Así quedó:
La mejor parte, la url de la app ya en mi hosting:
La verdad me ha dejado buen sabor de boca y espero poder realizar más proyectos basándome en este libro. Intenten hacer esta pequeña y sencilla app y si se atoran en algo aquí estoy para ayudarles.
