Overview of Web and App development process

797 views

Published on

Websites: https://www.designveloper.com
Visit our blog: https://www.designveloper.com/blog
Like Facebook page: https://www.facebook.com/designveloper/
Youtube: http://bit.ly/29PTtFS

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

  • Be the first to like this

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

No notes for slide

Overview of Web and App development process

  1. 1. Designveloper Overview of Web and App development process March 11th, 2014 Hung Vo - CEO Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  2. 2. Agenda - Web development process - Design - Convert to HTML/CSS - Manipulate animation - Create JS template - Database and logic processing - Focus on - What is important - How to get things done faster Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  3. 3. Design  Using PSD, Illustrator  Arrange workspace  Understand different screen size  Color types, color profile  Layers, layer comp  Text styling  Image Sprite  Image types: JPEG, GIF, PNG  Grid system http://guideguide.me/ http://www.gridsystemgenerator.com/  Ref: http://www.lynda.com/Photoshop-tutorials/Photoshop-Web-Design/105368-2.html  http://www.lynda.com/Photoshop-tutorials/Photoshop-CC-One-One-Fundamentals/124096- 2.html Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  4. 4. HTML/CSS  HTML5  Tags http://www.w3schools.com/tags/  Attributes  Validate your HTML - http://validator.w3.org/  CSS3  CSS selector - http://www.w3schools.com/cssref/css_selectors.asp  CSS specificity - http://coding.smashingmagazine.com/2007/07/27/css- specificity-things-you-should-know/  Validate your CSS - http://jigsaw.w3.org/css-validator/ Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  5. 5. PSD to HTML/CSS  Keyboard shortcuts  How to get info about:  Text  Image  Color  Dimension Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  6. 6. Frameworks  Bootstrap - http://getbootstrap.com/, http://bootswatch.com/  Zurb Foundation - http://foundation.zurb.com/  jQuery Mobile - http://jquerymobile.com/ Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  7. 7. CSS preprocessor  LESS / SASS - http://lesscss.org/ - http://sass-lang.com/  http://www.lynda.com/CSS-tutorials/CSS-LESS-SASS/107921-2.html Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  8. 8. Animation manipulation  HTML5 Canvas - http://www.lynda.com/HTML-5-tutorials/HTML5-Graphics- and-Animation-with-Canvas/80782-2.html  CSS http://www.lynda.com/CSS-tutorials/CSS-Animations/115434-2.html http://www.lynda.com/Dreamweaver-tutorials/CSS-Transitions- Transforms/101072-2.html  jQuery Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  9. 9. JavaScript  Animation manipulation  Database and logic manipulation  Focus:  Objects – how it works, define objects  Events - http://www.w3schools.com/js/js_events_examples.asp  JSON - http://www.w3schools.com/json/  Ajax - http://www.w3schools.com/ajax/default.asp https://api.jquery.com/jQuery.ajax/  Ref: http://www.w3schools.com/js/DEFAULT.asp http://www.lynda.com/JavaScript-tutorials/Essential-Training/81266-2.html Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  10. 10. NoSQL  Not Only SQL http://www.lynda.com/NoSQL-tutorials/Up-Running-NoSQL-Databases/111598- 2.html  Saves data as BSON objects (Binary JSON)  MongoDB http://try.mongodb.org/  Redis: http://try.redis.io/  Pub/Sub for realtime processing http://redis.io/topics/pubsub Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  11. 11. jQuery  Write less, do more  $:object  $ = select  $(css expression)  $. Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  12. 12. Backbonejs  MVC for frontend  Event  Model  Collection  View  http://www.lynda.com/Backbonejs-tutorials/Up-Running- Backbonejs/120900-2.html Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  13. 13. Nodejs  JavaScript that runs on server  Event-driven  Non-blocking IO model  Perfect for data intensive real time apps that run across distributed devices  Soket.io : realtime processing  http://www.lynda.com/JavaScript-tutorials/Nodejs-Essential- Training/141132-2.html Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City
  14. 14. JS template  Mustache.js http://www.lynda.com/JavaScript-tutorials/JavaScript-templating- mustachejs/114901/125776-4.html  Handlebar  EJS Website: http://designveloper.com Address: 250/6 Bau Cat, Ward 11, Tan Binh District, HCM City

×