Web Developer's Workflow

Transcript

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