AngularJS Workshop: Create DBCityFinder app

sala de grados de la EPS 1

Hi everyone!

This is a learn-by-practice AngularJS tutorial, I consider that the best and most fun way to learn!

For that we will create a meaningful app on the fly, following this step-by-step tutorial I've created on Github (https://github.com/alexjoverm/MeetUp_DBCityFinder). That is DBCityFinder, an app that use DBPedia (http://wiki.dbpedia.org/) as a RESTful backend.

The speech will be organized in 2 parts:

• A 30 min overview to AngularJS

• The creation of DBCityFinder (60 min approx)

• (optional) We can have a beer afterwards in a nearby place

It is a beginner-intermediate level oriented. If have zero knowledge of AngularJS, please take a look at documentation and some examples. Otherwise it can be a bit hard for you.

http://photos1.meetupstatic.com/photos/event/1/e/5/600_442020485.jpeg

Wikipedia about AngularJS (https://en.wikipedia.org/wiki/AngularJS):

AngularJS (commonly referred to as "Angular") is an open-source (https://en.wikipedia.org/wiki/Open-source_software) web application framework (https://en.wikipedia.org/wiki/Web_application_framework) maintained by Google (https://en.wikipedia.org/wiki/Google) and by a community of individual developers and corporations to address many of the challenges encountered in developing single-page applications (https://en.wikipedia.org/wiki/Single-page_application). It aims to simplify both the development and the testing (https://en.wikipedia.org/wiki/Software_testing) of such applications by providing a framework for client-sidemodel–view–controller (https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller) (MVC) and model–view–viewmodel (https://en.wikipedia.org/wiki/Model_View_ViewModel) (MVVM) architectures, along with components commonly used in rich Internet applications (https://en.wikipedia.org/wiki/Rich_Internet_Application).

The AngularJS library works by first reading the HTML (https://en.wikipedia.org/wiki/HTML) page, which has embedded into it additional custom tag attributes (https://en.wikipedia.org/wiki/HTML_attribute). Angular interprets those attributes as directives to bind input or output parts of the page to a model that is represented by standard JavaScript (https://en.wikipedia.org/wiki/JavaScript) variables. The values of those JavaScript variables can be manually set within the code, or retrieved from static or dynamicJSON (https://en.wikipedia.org/wiki/JSON) resources.

According to JavaScript (https://en.wikipedia.org/wiki/JavaScript) analytics service Libscore (https://en.wikipedia.org/wiki/Libscore), AngularJS is used on the websites of NBC (https://en.wikipedia.org/wiki/NBC), Walgreens (https://en.wikipedia.org/wiki/Walgreens), Intel (https://en.wikipedia.org/wiki/Intel), Sprint (https://en.wikipedia.org/wiki/Sprint_Nextel), ABC News (https://en.wikipedia.org/wiki/ABC_News), and approximately 8,400 other sites out of 1 million tested in July 2015.[1] (https://en.wikipedia.org/wiki/AngularJS#cite_note-1)

AngularJS is the frontend part of the MEAN stack (https://en.wikipedia.org/wiki/MEAN_(software_bundle)), together with Node.js runtime, Express.js backend framework and MongoDB (https://en.wikipedia.org/wiki/MongoDB) database.

Location

The location is the Sala de Grados of the Escuela Politecnica Superior 1:

https://maktub.eps.ua.es/servicios/laboratorios/planoEPS/edificio16/planoUA16.gif (http://www.eps.ua.es/en/infraestructuras-espacios/infrastructures-and-spaces/politecnica-i-edificio-docente-y-de-administracion.html)