Quick prototyping apps using JS - Ciklum, Vinnitsa
Download as PPTX, PDF0 likes656 views
The document discusses quick prototyping of applications using JavaScript. It provides biographies of Yuriy V. Silvestrov and Mikhail Valkov, and then discusses topics like when quick prototyping is useful, how to quickly prototype an app, JavaScript techniques like MVC, jQuery, AngularJS and RequireJS, design tips including responsive design, and includes links to example applications and code on BitBucket and GitHub.
More Related Content
Similar to Quick prototyping apps using JS - Ciklum, Vinnitsa (20)
Quick prototyping apps using JS - Ciklum, Vinnitsa
- 1. Application in 24h Quick prototyping of application using JavaScript by Yuriy V. Silvestrov, Mikhail Valkov
- 2. About us Yuriy V. Silvestrov 10+ years record in IT, 8+ years devoted to managing projects. Now working for Ciklum, managing a team of 30+ persons making different software for Danish financial organizations; also I am CTO in PromoRepublic startup. Twitter: @ysilvestrov Please visit my website http://yuriy.silvestrov.com for more info or contact me at [email protected].
- 3. About us Mikhail Valkov 10+ years record in IT. 2+ years devoted to system architecture. Now working for Ciklum. for more info contact me at [email protected].
- 4. Based on our own About lection experience Useful for startups and pet projects Not the right way, not the best way, but the fast one. Divide and conquer
- 5. ⌛ < 60 Time is counting
- 6. Have tried to do a startup? Have experience with JavaScript/HTML5? Participated in Hakatons or similar events? Is AngularJS/RequireJS expert? We’ll try to adapt How many of you
- 7. Startup mode ON ◦ When do we need quick prototyping? ◦ How to quick prototype an app? JavaScript tricks ◦ MVC in JavaScript ◦ jQuery and jQuery plugins ◦ AngularJS ◦ RequireJS, Modules and AMD Design tips ◦ Using bootstraps (twitter etc.) ◦ Responsive design Q&A Content
- 8. A way to write something useful and not to spend years on it Fits to Minimum Valuable Product approach ◦ If you’ll fail, it would be fast ◦ If not, you’ll have plenty of time to refactor the application ◦ …while the “prototype” is still in use Prototyping
- 9. Alarm clocks with skinning and time synchronization See on BitBucket: ◦ http://bitbucket.org/ysilvestrov/alarm-clock See online demo: ◦ http://jayostudio.net/app/ Demo application
- 10. What is startup? Act like startup! Implement main idea only Throw away everything else Startup mode ON
- 11. Lack of resources Fast show results If to fail at all – fail fast! Why quick prototyping?
- 12. Choose platform Download seed for chosen platform Quick UI Choose vital functionality to prototype Find the frameworks/solutions realizing the functionality Compose all together … PROFIT How to prototype
- 13. Client-Side JS & HTML5 Development perspective Platform independency Client-side JavaScript
- 14. Use 3-rd party components Existing online services ◦ Prefer ones implementing REST interface Use dependency managers to integrate Component development
- 15. JavaScript MVC
- 16. 85% of WebApps made with jQuery Pros ◦ Modularity ◦ Speed ◦ Small footprint ◦ Json Visit http://jquery.com/ for more details jQuery and plugins
- 17. One of 20+ MVC JS frameworks Supported by Google Integrated ◦ Templates ◦ Directives and filters ◦ Module systems ◦ Resources ◦ Asynchronous programming Visit http://angularjs.org for details Angular JS
- 18. Dependency isolation Dependency management Modules loading and cashing Visit http://requirejs.org/ for details RequireJS
- 19. AMD = Asynchronous Module Definition CommonJS See https://github.com/amdjs/amdjs-api Modules and AMD
- 20. Use advanced CSS and JS Throw away old browsers Build one version of web app for all the devices Responsive design and mobile first Design tips
- 21. Twitter bootstrap http://twitter.github.com/bootstrap/ ◦ Made for everyone ◦ Packed with features Bootstrap usage
- 22. Jasny bootstrap(http://jasny.github.com/bootstrap/) ◦ Row links, Input mask, File upload ◦ … and much more Kickstrap (http://getkickstrap.com/) ◦ Bootstrap with blackjack and hookers ◦ actually, with apps and themes Twitter bootstrap extensions @ysilvestrov, @valkovnet
- 23. Using media queries Mobile first Responsive design
- 25. ??? Questions?
- 26. [email protected] [email protected] Thank you! Waiting for your demos