kRouter

390 views
325 views

Published on

AngularJS router without location.hash.
https://github.com/kelp404/kRouter

Published in: Technology, Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
390
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

kRouter

  1. 1. kRouter https:/ /github.com/kelp404/kRouter
  2. 2. Kelp github/kelp404! iOS App Developer! Front-end Developer! Objective-C, CoffeeScript, Python
  3. 3. kRouter Reason! CoffeeScript! kRouter! Unit Test! Conclusion
  4. 4. kRouter SEO! location.hash `#`
  5. 5. CoffeeScript
  6. 6. CoffeeScript
  7. 7. JavaScript https:/ /github.com/madrobby/semicolon.js
  8. 8. CoffeeScript
  9. 9. JavaScript } } } }
  10. 10. CoffeeScript
  11. 11. JavaScript return { id: 1002
 , name: ‘Kelp’
, email: ‘kelp@phate.org’
 };
  12. 12. CoffeeScript id: 1002
 name: ‘Kelp’
 email: ‘kelp@phate.org’

  13. 13. JavaScript function (members, name) {
 var result = [];
 for (var index = 0; index < members.length; index++) {
 if (members[index].name == name) {
 result.push(members[index]);
 }
 }
 return result;
 }
  14. 14. CoffeeScript (members, name) -> x for x in members when x.name is name
  15. 15. JavaScript $(function () { $(document).on(‘click’, ‘#link’, function () { var s = $(‘#text’).text(); $(this).html(‘Hello ‘ + s + ‘!!’); }); });
  16. 16. CoffeeScript $ -> $(document).on ‘click’, ‘#link’, -> s = $(‘#text’).text() $(@).html “Hello #{s}!!”
  17. 17. JavaScript angular.module(‘app’, []) .controller(‘HomeController’, function ($scope) { $scope.text = ‘hello’; });
  18. 18. CoffeeScript a = angular.module ‘app’, [] a.controller ‘HomeController’, ($scope) -> $scope.text = ‘hello’
  19. 19. CoffeeScript npm install -g coffee-script
  20. 20. kRouter Routes! history.pushState()! window.onpopstate
  21. 21. kRouter common.coffee! directive.coffee! module.coffee! provider.coffee
  22. 22. common.coffee getUri: (href=location.href) ->! matchRoute: (url, routes) ->! parseQueryString: (queryString) ->
  23. 23. directive.coffee kr-view! kr-go
  24. 24. module.coffee angular.module 'kRouter', [
 'kRouter.provider', 'kRouter.directive'
 ]
  25. 25. provider.coffee $kRouterProvider.register = (name, args={}) ->! routers: []! state:
 current: {}
 params: {}! go: (href, push=true) ->
  26. 26. Unit Test Travis CI! karma! jasmine
  27. 27. Conclusion npm install -g coffee-script! git clone https:/ /github.com/kelp404/kRouter.git
 cd kRouter
 git submodule update --init

×