How I Found A Job With Node + Angular, Part 4: Strap The Boot

In the previous posts we learned some Node.JS (and express) basics, incorporated CouchDB as our database and used some Angular.JS code to present our list of jobs.

But the final result we got is not a pretty sight, and not very usable or friendly. Those who know me, agree that I’m not that strong in UI desigbootstrapn or implementation, so to make our application prettier and more usable, let’s use some framework for that. There are a lots of frameworks out there, but I had my eye on Bootstrap. Maybe it’s my strong mobile orientation, maybe the ease of use or maybe it’s just one of the frameworks I encountered first. In any case, I like the thinking of Bootstrap makers, I like that it is a remarkable responsive UI framework, and that it is fairly easy to us. So you can download Bootstrap from here, and lets make some changes to our application, using Bootstrap styles:

<html ng-app="geojob">
<head>
  <title>GeoJob Finder - Bootstrap GeoJob</title>
  <link rel="stylesheet" href="bootstrap-3.1.1-dist/css/bootstrap.min.css" />
  <link rel="stylesheet" href="bootstrap-3.1.1-dist/css/bootstrap-theme.min.css" />
  <link rel="stylesheet" href="css/geojob.css" />
</head>
<body>
  <section class="container"  ng-controller="JobsController">
    <div class="header"><h1>GeoJob Finder <small>Bootstrap GeoJob</small></h1></div>
    We have a total of: {{jobs.total_rows}} jobs
    <div class="list-group">
      <a href="#" class="list-group-item" ng-repeat="job in jobs.rows">{{job.key}}</a>
    </div>
  </section>
  <script type="text/javascript" src="js/angular.min.js"></script>
  <script type="text/javascript" src="js/geojob-app.js"></script>
</body>
</html>

Continue reading

How I Found A Job With Node + Angular, Part 3: The Angular Angle

In the first post, I explained my frustration about seeking possible close (geographically) and awesome future employers. I started my journey towards geo aware job finding application by discussing Node.JS basics. In the previous post we added some database functionality with CouchDB.jquery

Now it is time to start showing some UI, to display the jobs stored in our database. There are many modern UI/Web frameworks that can do the job. My favorites are jQuery (mainly because of jQuery mobile anjquery-mobiled me being mobile oriented) and Angular.JS. I’ve chosen Angular for this tutorial. Download and install the Angular files. I would also recommend the excelleAngularJS-largent Angular free tutorial to get you started with basic Angular concepts.

Continue reading

How I Found A Job With Node + Angular, Part 2: Let’s Level Some Jobs

In the previous post, I explained my frustration about seeking possible close (geographically) and awesome future employers. I started my journey towards geo aware job finding application by discussing Node.JS basics.

In this post, I would like to serve some companies that offer positions in my field, from the node web server we just created. This means, we need to retrieve them from somewhere. Aha! A database? Well, this could be anything from hard coded JS array, a file and of course – a database. Following this short presentation about using LevelDB with Node.JS I decided to use LevelDB for this tutorial. This turned to be a bad decision. While my tests on Amazon EC2 cluster went very well, installing level on a Windows machine became a sisyphic task. Simply trying

> npm install level

Will fail. Looking at the logs you can see some rants about leveldown failed installation. LevelDB is composed from 2 main packages: levelup – which provide a high level API to the DB, and leveldown which provide the low level hard core DB functions. Trying to follow the instructions on Richard’s blog by installing only levelup:

> npm install levelup

will give a wrong first impression. While the installation goes by ok, the DB will fail on first try:

c:\Dev\node\geojob&gt;node
&gt; var level = require('levelup');
undefined
&gt; var db = level('./DatabaseDirectory');
LevelUPError: Could not locate LevelDOWN, try <code>npm install leveldown</code>
    at getLevelDOWN (c:\Dev\node\geojob\node_modules\levelup\lib\util.js:109:11)
    at LevelUP.open (c:\Dev\node\geojob\node_modules\levelup\lib\levelup.js:109:37)
    at new LevelUP (c:\Dev\node\geojob\node_modules\levelup\lib\levelup.js:82:8)
    at LevelUP (c:\Dev\node\geojob\node_modules\levelup\lib\levelup.js:44:12)
    at repl:1:10
    at REPLServer.self.eval (repl.js:110:21)
    at repl.js:249:20
    at REPLServer.self.eval (repl.js:122:7)
    at Interface.&lt;anonymous&gt; (repl.js:239:12)
    at Interface.emit (events.js:95:17)
&gt;

Again, because of our friend leveldown. Trying to install leveldown directly will fail as well.
Continue reading