Angular is a new JavaScript framework from Google. If you are looking into developing rich web applications, Angular is your friend. Angular embraces HTML and CSS, allowing you to extend HTML towards your application, and uses plain JavaScript which makes your code easy to reuse, and test. In this workshop we will start from the ground up, and build our way through a simple application that will let us explore the various constructs, and the familiarize ourselves with some of the new terminology in Angular.
- Java 1.6 or greater
- Please note that if you are running a JVM other than the standard SDK we might run into issues. It's preferred that you have the standard Oracle installation on your machine
- FireFox or Google Chrome
- Git
- There are downloads available for all major platforms. Note that if you use HomeBrew simply
brew install git
- There are downloads available for all major platforms. Note that if you use HomeBrew simply
- Leiningen
- There are downloads available for all major platforms. Note that if you are on a Mac and have HomeBrew installed this is a one-liner
- You favorite text editor or JavaScript IDE. Some suggestions are
- SublimeText
- Emacs/VI
- IntelliJ
-
Make sure Git is available on your path
Open up a new terminal window $ git --version > # Anything greater than 2 will do > git version 2.1.3
-
Make sure leiningen is available
$ lein --version > Leiningen 2.5.1 on Java 1.8.0_40 Java HotSpot(TM) 64-Bit Server VM
-
If you have an account on Github, feel free to fork the repository and then clone it.
-
Clone the repository on Github
- At a terminal,
cd
into a directory and rungit clone git@github.com:looselytyped/angudone-workshop.git
. Note that if you did fork the repository under your account your URL will be something likegit@github.com:<YOUR-ACCOUNT-NAME>/angudone-workshop.git
- At a terminal,
-
Wake up the application
# at the terminal # cd to where you cloned the repository above. $ git checkout master-1.4 $ lein ring server # This will download a whole bunch of files from Maven Central # and will end with # Started server on port 3000
- This should automatically open up your default browser to
http://localhost:3000/
(If it does not just go to that URL). You should see a HTML page announcingAngudone
- This should automatically open up your default browser to
-
Ensure that the
REST
endpoints are active- If you are using FireFox then
Right-Click -> Inspect Element
(this will open the Inspector) and then go to theConsole
tab - If you are using Chrome then
Right-Click -> Inspect Element
(this will open the Chrome Inspector) and then go to theConsole
tab (right most)
- If you are using FireFox then
-
Both
Console
s give you the ability to run JavaScript code. Run the followinghttp.get("todos") .success(function(data, status, headers, config) { console.log("There are " + data.length + " todos"); }).error(function(data, status, headers, config) { console.error("Oh Noes! Something went wrong" + data); });
You should see a a valid response indicated by
There are 0 todos