Skip to content

footworkjs/skeleton-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

This is meant to be used as a base/example starting point for a FootworkJS web application. It includes several things pre-scaffolded and setup, including:

  • Uses Bower for frontend dependencies
  • Uses Gulp for tasks
  • Uses RequireJS + text plugin (so Footwork can automatically load assets)
    • Includes r.js for optimization and includes example working build.js
  • Includes example viewModel, and component which are resolved and bootstrapped dynamically at run-time
  • Includes the Karma test runner, all pre-configured and ready to run out of the box.
  • Includes Bootstrap3 via Bower
  • CSS concatentation and minification
  • CSS prefixing during build

Files/directories of note:

  • public/index.html - Main index HTML file
  • public/app/main.js - Application main starting module
  • public/app/router.js - router module
  • public/app/config/assets-config.js - Footwork viewModel/component/etc asset registrations
  • public/app/config/require-config.js - RequireJS configuration
  • public/app/app/component/navigation - Navigation component
  • tests - Unit tests

Running this code/website

Note that steps 1 and 2 are not necessary if you installed via Yeoman.

  1. Clone the repo from here:
git clone git@github.com:footworkjs/skeleton-app.git
cd skeleton-app
  1. Acquire npm and bower (javascript) dependencies:

Make sure you have node.js and bower installed in your environment, then run the following:

npm install && bower install
  1. Run the local webserver: (if necessary)

If you are not running this on a pre-existing server which already has an HTTP provider (Apache, nginx, etc) then you will need to run the local webserver in order to view the application. First off, make sure you have Gulp installed, then run:

gulp webserver

You can now access the site at: http://localhost:8000 (or whatever host you have it running on, this assumes localhost)

Running Unit Tests

The included test runner is Karma, to run the unit tests you can either:

Run them via Karma directly (recommended). Note that you need to have Karma CLI installed:

# If you need to install Karma CLI, use the following command
sudo npm install -g karma-cli
# Once Karma CLI is installed, you can run the tests with:
karma start

Run them manually via Gulp:

# Run the unit tests under /tests
gulp tests

Run the watch-and-test task which compiles everything and runs the tests everytime a change is detected:

gulp watch-and-test

NOTE: If you get a 'No binary for PhantomJS browser on your platform' error, do the following:

sudo npm install -g phantomjs
export PHANTOMJS_BIN=`which phantomjs`

Other Included Tasks

The gulpfile.js included in this repository has several runnable tasks included with it, they are as follows:

# (default task) Compile the LESS into CSS, and bundle/compile/optimize the javascript
gulp
# Watch the styles and Javascript files for changes and recompile as needed
gulp watch
# Watch the styles files for changes and recompile as needed
gulp watch-styles
# Watch the Javascript files for changes and recompile as needed
gulp watch-js
# Compile the LESS into CSS
gulp build-styles
# Bundle/optimize the javascript (the RequireJS config is located in public/scripts/require-config.js)
gulp build-js

About

Skeleton FootworkJS application including fully scaffolded bower, gulp, requirejs, etc

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors