Giter Club home page Giter Club logo

perl-dancer-angular-seed's Introduction

perl-dancer-angular-seed

A project template to jumpstart a Perl Dancer/Angular application

What it does

Provides a starting folder to help create a complete web application with Perl Dancer and AngularJS.

It's designed to be used to create an AngularJS Single Page Application (SPA) using Perl Dancer as a backend.

What's included

  • AngularJS application template with examples for directives, services, controllers and filters.
  • Perl Dancer (version 1 and 2) application to use as a backend. Also contains templates to configure popular Dancer plugins like: Dancer::Plugin::Database, Dancer::Plugin::Auth::Extensible and Dancer::Plugin::DBIC.
  • Preconfigured:
  • web package manager (bower) to include popular packages like AngularJS, Bootstrap, jQuery and Font Awesome.
  • task runner (grunt) to help automate concatenation and minification of web project assets (js/css) for production.
  • node.js package manager (npm) to manage node.js modules.
  • perl and perl module managers (plenv and carton) to locally install perl and perl modules.

Dependencies

You need the following softwares installed on your system:

Installation

$ git clone git://github.com/jacqueslareau/perl-dancer-angular-seed.git MyApp
$ cd MyApp
$ npm install
$ bower install

For a Dancer2 project, check the bin/app.pl file.

Start the app in development mode:

$ bin/start-dev.pl

And then point your browser to:

http://localhost:5555

Remove git remote:

$ git remote rm origin

Production

To deploy for production, create a script that will clone your project in your production folder. Your script will then have to run the following commands to install needed packages and modules:

$ npm install
$ bower install
$ carton install
$ grunt

Documentation

Configure assets

You can declare your AngularJS source files and css files in dancer's config.yml file.

assets: 
  js: 
    build-folder: "public/app/build"
    build-file: "app.js"
    build-file-min: "app.min.js"
    files: 
      - "public/app/app.js"
      - "public/app/directives/MyDirective.js"
      - "public/app/services/MyService.js"
      - "public/app/filters/MyFilter.js"
      - "public/app/controllers/MyController.js"
  css:
    build-folder: "public/css/build"
    build-file: "styles.css"
    build-file-min: "styles.min.css"
    files: 
      - "public/css/styles.css"

This is used by grunt to build the files that will be used in production.

At development stage, use the normal html tags to include javascript and css files. This allows us to develop our AngularJS apps and not have to grunt after each modifications. For this to work, we use template toolkit to select between compiled and normals assets. You can view how it's done in the views/layouts/main.tt file.

Notes

Be sure to use AngularJS array notation to declare functions. It is required to make sure uglify doesn't break your code.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.