objectpartners / angular-timesheet Goto Github PK

View Code? Open in Web Editor NEW

2.0 23.0 9.0 473 KB

Angular Training Labs

JavaScript 79.84% CSS 4.92% HTML 15.24%

angular-timesheet's Introduction

tsz UI

Getting Started

Tracklist (incorporated frameworks)

Inspiration

Dependencies

Node
Mongo
Grunt npm install -g grunt-cli
Bower npm install -g bower
Nodemon npm install -g nodemon
Docco npm install -g docco
Karma npm install -g karma

Releasing

Start by creating a release branch using the standard GitFlow conventions.
Modify the version attribute in package.json and bower.json to the official release version (without "SNAPSHOT").
Commit the changes to the release branch.
Run grunt release to build, test, and publish the release artifact to Nexus.
Once the artifact has been published, finish the release branch (including standard GitFlow practices like tagging).
Switch to the development branch and increment the version to the next release snapshot (e.g. 1.2.3-SNAPSHOT).
Commit the new development version to develop.
Push the master branch and development branches to origin.

Quick Start

Install the Node dependencies locally.

npm install

Run init task to initialize a freshly checked out project

grunt init

Grunt Tasks

These are all the Grunt.js tasks in their entirety:

clean - Remove the server dist, client dist, client docs, and client test reports.
jshint - Runs the client src and tests through the JSHint Javascript linter.
less - Compiles the less stylesheets into css.
ngtemplates - Combines the src templates into a single javascript file that populates the angular template cache. The output file path of this task is appended to the src of the concat:js task.
concat:jsdeps - Combines the javascript libraries into a single unminified file. This output file will be included in the concat:appjs task.
concat:appjs - Combines the javascript libraries, client src, and templates javascript into a single unminified file.
concat:css - Combines the application stylesheets with library stylesheets into a single unminified file.
cssmin - Minifies the output of concat:css
uglify - Run the concatenated javascript file through the Uglify2 minifier
watch:development - Watches the source files and builds the application for development on any change.
watch:debug - Watches the source files and builds the application for debug on any change.
watch:production - Watches the source files and builds the application for production on any change.
watch:server - Watches server files for any change and then runs the server-side Mocha tests.
karma:unit - Starts the karama runner for client-side unit tests. Tests are ran when the task is re-invoked from the watch task.
karma:e2e - Starts the karama runner for client-side e2e tests. Tests are ran when the task is re-invoked from the watch task.
karma:unitci - Runs the unit tests immediately (for CI builds). The application server must be started for this to work correctly.
karma:e2eci - Runs the e2e tests immediately (for CI builds). The application server must be started for this to work correctly.
mochacli - Runs the server side Mocha tests.
copy - Stages all the files for running the application. Each of these tasks are cumulative where production builds off of debug, debug off of development, and development off of vendor.
copy:vendor - Stages all of the 3rd party library files
copy:development - Stages all the files required for development mode
copy:debug - Stages all the files required for debug mode
copy:production - Stages all the files required for production mode
jade:debug - Compiles the server-side jade templates for deployment in debug mode
jade:production - Compiles the server-side jade templates for deployment in production mode
docco:client - Builds the docco for the client source
docco:app - Builds the docco for the server/app source
docco:grunt - Builds the docco for the Grunt file
docco:config - Builds the docco for the server side configuration files
runapp:development - Runs the application server in development mode inside a nodemon process that restarts the server on source changes.
runapp:debug - Runs the application server in debug mode inside a nodemon process that restarts the server on source changes.
runapp:production - Runs the application server in production mode inside a nodemon process that restarts the server on source changes.
runapp:test - Runs the application for tests. This server is ran in the background and terminated once the parent Grunt task ends.

And a couple of shortcut tasks to run various combinations:

grunt init
- Runs bower install
- Runs the production task
grunt angular
- Runs NPM install for the angular project
- Runs the Angular package Grunt task
grunt development
- Cleans the project
- Runs JSHint
- Compiles the LESS files
- Concatinates the CSS files
- Concatinates the application javascript dependencies (for the unit and e2e tests)
- Stages the vendor and application development files
grunt debug
- Runs the development build
- Runs ngtemplates to concatenate the applciation template files into javascript
- Concatenates the JavaScript dependencies, application source, and templates in a single file
- Compiles the Jade templates in debug mode
- Stages the application debug files
grunt production
- Runs the debug build
- Minifies CSS files
- Minifies JavaScript files
- Compiles the Jade templates in production mode
- Stages the application production files
grunt test
- Runs the production build
- Forks the current process and starts the application server (for e2e testing)
- Runs the karma unit tests karma:unitci
- Runs the karma e2e tests karma:e2eci
- On completion, the forked node server shuts down
grunt deploy
- Runs grunt test
- Runs maven:deploy to deploy the project zip artifact to the Nexus snapshot repository.
grunt release
- Runs grunt test
- Runs maven:release to deploy the project zip artifact to the Nexus release repository.

angular-timesheet's People

Contributors

Stargazers

Watchers

Forkers

jricesterenator jeffsheets kimballjohnson maladon akrasheninnikov jondejong mcacek douglaslira isabella232

angular-timesheet's Issues

Angular Api documentation

Since we really have no internet connection on the UP presentation laptop, maybe we could pull down the Angular docs and include them in our thumb drive so that they can be referenced more easily during lectures.

No Nodemon

Need to create a grunt shell task to run the server without nodemon...because windows.

Change error console logging to use JSON.stringify

Currently, when an error is output to the console, the output looks like this:

error: [Object object]

Probably should at least use JSON.stringify() to have a more meaningful message.

Timeunit save on edit does not work

When editing a timeunit, making the call to the server results in a 404 because the timeunit does not have a user_id, and the api (resource) declaration for timeunit requires it.

// in timeunits/timeunits.js
url: '/users/:user_id/timesheets/:timesheet_id/timeunits'

This can be worked around by adding the user_id from $stateParams manually in the controller or the resolve block in the route.

// in timeunits/controllers.js in the TimeunitEditCtrl
$scope.timeunit.user_id = $stateParams.user_id;

Do we want to add the user_id to the timeunit in the database?

Folders by Feature: add templates

The templates should be in the same directory as the controller/services/routing
https://github.com/johnpapa/angular-styleguide#style-y152

add $http and $resource to lab 4

We should have the student first fetch a resource via $http and then $resource to demonstrate the flexibility of talking to a backend, before introducing the api / data services.

Fix join('.').split('.')

Lab 3

Replace console.log statements with $log

Probably should do this The Angular Way^TM.

interceptor tests are broken

the chai.as.promised library does not seem to be working for testing the interceptors. It is not blocking the test execution and/or failing as a result when it should.

Filter lecture add markup for examples

In the filter slides, we need to add slides that will show the actual markup being used for the example slides so that the students can actually see what is happening in the background.

Add lab work for component in the directives lab

Need to add something in the labs to use the new Angular 1.5 component API. https://toddmotto.com/exploring-the-angular-1-5-component-method

Remove the $ from control and api

The $ seemed to be a point of confusion.

Maybe rename them too and move them into the services directory.

Controller example in Directive slides

Need to add an example of directives using a controller.

Unit testing section for directives slides

Need to add a section on unit testing directives for the lecture.

Feature File Names: controllers.js

The controllers should be in separate files and named ***.controller.js
https://github.com/johnpapa/angular-styleguide#style-y121

Utilize controllerAs syntax

Once Angular and UI router are upgraded, utilize 'controllerAs' syntax rather than $scope:

https://github.com/johnpapa/angular-styleguide#controllers

Exclude watching deps.js in karma config

Exclude watching deps.js in karma config. Karma seems to crash on windows when the grunt development task and the karma task run around the same time.

Add a testing section to the filter slides

A section on unit testing filters needs to be added to the slide deck

JSHint: add the relaxing option for mixed tabs and spaces

JSHint: add the relaxing option smart tabs to the jshint config

{
    '-W099': false,
    smarttabs: true
}

Single root element in directive templates

Make sure to mention the single root element requirement for directive templates.

Fix alert text

The alert text on the login page is the same color as the alert box.

Fix broken tests in directives labs

Since the pagination function is not in the controllers at the beginning of the labs, all of the previously passing tests are failing. The initial flush of the httpBackend has nothing to flush.

Probably need to provide the implementation of the controller and have the students just review the changes before implementing the pagination directive.

Add grunt shell task

Remove grunt-runapp-mixtape from the project (npm and grunt).

Also remote the 'test' task since we're no longer using runapp-mixtape

User grunt-shell to fire up node
export NODE_ENV="development"; node api/server.js

Deprecation warning: moment construction falls back to js Date

A warning is given when any random string is used to construct a date in momen.js.
This is visible in the console when running the unit tests.

See issue: moment/moment#1407

Update date.js to correctly create a new Date().

set up index.html for all labs

do it

Lab 5 - UI router needs some love

We need to refactor the lab and docs so that it isn't so much of a behemoth. Maybe?

Migrate to ES6 or TypeScript

Just to stay ahead of the curve, we should probably look at using ES6 or TypeScript and transpiling down to ES5.

Switch ui-select for ui-select2

ui-select is better and more flexible.

new user email field needs validation

https://www.dropbox.com/s/r6y3zhcafyi74o4/Screenshot%202014-04-03%2010.50.37.png

Left over references to $control

There are still some left over references to $control in lab-8-directives

Make a backup repository

make a backup repository with all dependencies checked in so that in the event we can get npm install or bower install to work, we'll have a project with all of those dependencies checked in.

lab 8 wording does not match code state in lab 8 branch

See https://github.com/objectpartners/angular-training/blob/develop/labs/lab-08-directives.md#create-a-timesheet-progress-indicator

Lab markdown states that the module is already created. However, in ../client/src/directives/timesheet.js on the lab-8-directives branch, it's mentioned in the TODO, but not actually implemented.

Suggest to either update the branch to include the module declaration and dependency in main.js OR update the lab markdown to include the work.

{
  "storage" : {
    "packages" : ".bower-cache",
    "registry" : ".bower-registry"
  },
  "tmp" : ".bower-tmp"
}

Jade

I would like to remove Jade from the training class - makes it simpler and teams, once they are comfortable with developing Angular projects, can add it at a later date.