Web Developer's Workflow

Presented at National Informatics Center (NIC), Ministry of Rural Development on 3rd Sept, 2014

Agenda: Modern web developer's workflow and Trending Tools and Tech for Web Dev

1. Ravi Suhag Web Developer’s Workflow
2. ✤Web architect, designer, developer, hardware hacker and entrepreneur ✤Founder at Inspiration Edge, InfoClot ✤Winner of 5 National and Global Hackathons in last 1 year ! Follow on Twitter: @Ravi_Suhag Website: ravisuhag.com Email: suhag.ravi@gmail.com Ravi Suhag UI/UX and Data Viz Consultant at Harvard University (BCURE) About the Speaker
3. Web Dev’s Workflow Your Workflow defines who you really are.
4. You should know your editor more than yourself • Sublime Text • Web Storm • Pycharm • Atom • Vim • Eclipse • Visual Studio That’s my Choice. Hmmmm !
5. Upgrade it like you upgrade your car in Racing Game … ! • Plugins • Linters • Highlighters • Code Completors • Snippet Generators • Live Reload • Preprocessor • Build Support ! ! If you don’t like emmet, you like wasting time …!
6. Preprocess it so that you don’t have to overprocess … ! • SASS • LESS • Coffee Script • HAML • Slim • Handlebar ! ! $btn_color = #6fa6f6
7. Version control it … ! • Git • SVN • Mercurial • Monotone ! ! ! ! back to this, back to that ….. Wohoooooo ……!
8. Be lazy and automate it … ! • Grunt • Gulp • bower • Selenium • Sahi ! ! ! ! it will be so COOOOLLLLL if someone else can do this for me ….
9. Don’t start from scratch, Boilerplate it … ! • Bootstrap • Foundation • Web Starter Kit • HTML 5 boilerplate ! ! ! !
10. Trending Technologies and Tools Web changes faster than speed of light.
11. Languages and Frameworks ! • Python - django, scrapy, Flask • Node - Meteor, Express, Sails • Ruby- Rails, Sinatra • GO - Revel • JS- Angular, Backbone, Ember, D3, Processing • R, Scala, • HTML 5 , WebGL, CSS3, Web Components
12. Tools…. ! • Yeoman • Grunt • Bower • Gulp • Foreman • Emulators • Live Relaod • Middleman • Ripple • Docker • Chef • Travis • Phantom JS • Firebug • Chrome Dev Tools • Compass • NPM
13. Staying up to Date … ! • http://uptodate.frontendrescue.org/ • CSStricks • Codepen • Github Explore • Coderwall • Geeklist • Hackernews • Twitter Lists
14. Agile Development Image Courtesy : IBM
15. Agile Development Image Courtesy : IBM
16. Thanks ! Follow on Twitter: @Ravi_Suhag Website: ravisuhag.com Email: suhag.ravi@gmail.com