1. BreizhCamp 2015 #BzhCmp
#45tools #BzhCmp
BreizhCamp 2015 #BzhCmp
45 Tools
to Boost Your Front-End
Nicolas Pennec - @NicoPennec
2015/06/12

2. Nicolas Pennec
● Full-Stack Web Developer
○ JavaScript
○ PHP
○ JEE
● Rennes, France
● Co-Founder of RennesJS
● @NicoPennec / pennec.io (WIP)
#45tools

3. RennesJS.org #45tools

4. Rules #45tools
● 1 min / slide
● Auto Play
● Questions at the end
● #45tools #bzhcmp

5. $document.ready() #45tools

6. DevDocs.io #45tools

7. Angular.io (2.0 alpha) #45tools

8. Aurelia.io #45tools

9. Polymer-project.org #45tools

10. Materializecss.com #45tools

11. Boostrap-Material-Design #45tools

12. Cmder #45tools

13. sass/node-sass #45tools

14. Babeljs.io #45tools

15. cssnext.io #45tools

16. JSCS.info #45tools

17. CSSLint.net #45tools

18. danielstjules/JSInspect #45tools

19. JSPM.io #45tools

20. browserify.org #45tools

21. webpack.github.io #45tools

22. Pesticide.io #45tools

23. FontFace.Ninja #45tools

24. callmecavs/layzr #45tools

25. giakki/UnCSS #45tools

26. Fontello.com #45tools

27. zeman/Perfmap #45tools

28. addyosmani/Critical #45tools

29. BrowserSync.io #45tools

30. NightwatchJS.org #45tools

31. Webdriver.IO #45tools

32. marmelab/gremlins.js #45tools

33. WebPageTest.org
WPT Private Instance + Vagrant
https://github.com/NicoPennec/vagrant-webpagetest
#45tools

34. gmetais/grunt-devperf #45tools

35. VorlonJS.com #45tools

36. djfarrelly/MailDev #45tools

37. typicode/json-server #45tools

38. FrisbyJS.com #45tools

39. jariz/vibrant.js #45tools

40. imsky/holder #45tools

41. MomentJS.com #45tools

42. connoratherton/Loaders.css #45tools

43. astoilkov/console.message #45tools

44. NVD3.org #45tools

45. jsPDF.com #45tools

46. ionicframework.com #45tools

47. facebook/React-Native #45tools

48. Wappalyzer.com #45tools

49. Master your Dev Tools
● Chrome Dev Tools + Chrome Canary
● Firefox Dev Tools / Firefox Developer Edition
● Microsoft F12 Developer Tools
● …
#45tools

50. GitHub.com/Trending #45tools

51. Communities!!! #45tools

52. Success… #45tools

53. Resources (1/3)
● http://devdocs.io/
● http://angular.io/
● http://aurelia.io/
● https://www.polymer-project.org/
● http://materializecss.com/
● http://fezvrasta.github.io/bootstrap-material-design/
● http://gooseberrycreative.com/cmder/
● https://github.com/sass/node-sass
● https://babeljs.io/
● http://cssnext.io/
● http://jscs.info/
● http://csslint.net/
● https://github.com/danielstjules/jsinspect
● http://jspm.io/
● http://browserify.org/
#45tools

54. Resources (2/3)
● http://webpack.github.io/
● http://pesticide.io/
● http://fontface.ninja/
● http://callmecavs.github.io/layzr.js/
● https://github.com/giakki/UnCSS
● http://fontello.com/
● https://github.com/zeman/perfmap
● https://github.com/addyosmani/critical
● http://www.browsersync.io/
● http://nightwatchjs.org/
● http://webdriver.io/
● https://github.com/marmelab/gremlins.js
● http://www.webpagetest.org/
● https://github.com/gmetais/grunt-devperf
● http://vorlonjs.com/
#45tools

55. Resources (3/3)
● https://github.com/djfarrelly/MailDev
● https://github.com/typicode/json-server
● http://frisbyjs.com/
● https://github.com/jariz/vibrant.js/
● https://github.com/imsky/holder
● http://momentjs.com/
● https://github.com/ConnorAtherton/loaders.css
● https://github.com/astoilkov/console.message
● http://nvd3.org
● http://jspdf.com/
● http://www.ionicframework.com/
● https://facebook.github.io/react-native/
● https://wappalyzer.com/
● Press F12 
● https://github.com/trending?since=monthly
#45tools

56. Thanks!
@NicoPennec / pennec.io
#45tools