WebMatrix, see what the matrix can do for you!!

2,096 views

Published on

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

  • Be the first to like this

No Downloads
Views
Total views
2,096
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
11
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

WebMatrix, see what the matrix can do for you!!

  1. 1. WebMatrix: See What theMatrix Can Do For You!!Frederic HarperDeveloper EvangelistMicrosoft Canada
  2. 2. Agenda• What is WebMatrix?• Who is WebMatrix for?• Razor syntax• Database access• Helpers• App Gallery & OSS Apps
  3. 3. My goals
  4. 4. My goals
  5. 5. My goals1. Show you how it’s easy to use WebMatrix to create awesome websites or Web applications
  6. 6. WebMatrix
  7. 7. What is WebMatrixIt’s a free tool that makes it easy to Create Configure Publishyour websites and web applications
  8. 8. What is WebMatrix1. Web App Gallery & Templates
  9. 9. What is WebMatrix1. Web App Gallery & Templates2. Web Server: IIS Express
  10. 10. What is WebMatrix1. Web App Gallery & Templates2. Web Server: IIS Express3. Standards Support: HTML, CSS, JavaScript
  11. 11. What is WebMatrix1. Web App Gallery & Templates2. Web Server: IIS Express3. Standards Support: HTML, CSS, JavaScript4. Scripting Support: ASP.NET & PHP
  12. 12. What is WebMatrix1. Web App Gallery & Templates2. Web Server: IIS Express3. Standards Support: HTML, CSS, JavaScript4. Scripting Support: ASP.NET & PHP5. DB Manager: SQL Server & MySQL
  13. 13. What is WebMatrix1. Web App Gallery & Templates2. Web Server: IIS Express3. Standards Support: HTML, CSS, JavaScript4. Scripting Support: ASP.NET & PHP5. DB Manager: SQL Server & MySQL6. Optimization Tools: SEO & Performance
  14. 14. Who is WebMatrix for? I <3 Web Apps. I want to build web I’m a professional I just need a tool that sites myself with an software developer makes them easier to easy to learn tool and I build complex, configure, customize and framework large scale web sites and publish with a team of developers
  15. 15. Two ways to build
  16. 16. Two ways to build Option A: From Scratch
  17. 17. Two ways to build Option A: Option B: From Scratch From Web App
  18. 18. demoA lap around WebMatrix
  19. 19. Razor
  20. 20. What is Razor
  21. 21. What is Razor1. A new view engine
  22. 22. What is Razor1. A new view engine2. Compact, Expressive, and Fluid
  23. 23. What is Razor1. A new view engine2. Compact, Expressive, and Fluid3. Easy to Learn
  24. 24. What is Razor1. A new view engine2. Compact, Expressive, and Fluid3. Easy to Learn4. Is not a new language
  25. 25. What is Razor1. A new view engine2. Compact, Expressive, and Fluid3. Easy to Learn4. Is not a new language5. Works with any Text Editor
  26. 26. What is Razor1. A new view engine2. Compact, Expressive, and Fluid3. Easy to Learn4. Is not a new language5. Works with any Text Editor6. Has great Intellisense
  27. 27. What is Razor1. A new view engine2. Compact, Expressive, and Fluid3. Easy to Learn4. Is not a new language5. Works with any Text Editor6. Has great Intellisense7. Unit Testable
  28. 28. Introducing Razor <ul> Web Forms <% for (int i = 0; i < 10; i++) { %> <li><% =i %></li> (6 transitions): <% } %> </ul> <ul> <?php for ($i = 0; $i < 10; $i++) { PHP echo("<li>$i</li>");(2 transitions & an echo): } ?> </ul> <ul> @for (int i = 0; i < 10; i++) { Razor <li>@i</li> (2 transitions): } </ul>
  29. 29. Code to markup easily @{ Option 1: var name = “John Doe”; <div> HTML Block Your name: @name </div> } @{ var name = “John Doe”; Option 2: <text> Text Block Your name: @name </text> } @{ Option 3: var name = “John Doe”; Single line of output @: Your name: @name in markup }
  30. 30. Commenting @* Option 1: <div> Markup Hello World </div> *@ @{ Option 2: //var name = "John Doe”; Code //@name } @* @{ Option 3: //var name = "John Doe"; Both //@name } *@
  31. 31. demoRazor syntax
  32. 32. Database
  33. 33. Database• SQL Compact Edition • File-based, so it’s portable. Runs without a server.• Easy to design, easy to code againstDesigning Coding @{ var db = Database.Open("ArtGallery"); var product = db.Query("SELECT * FROM PRODUCTS); }
  34. 34. demoDatabase access
  35. 35. Helpers
  36. 36. What are Helpers?Helpers make it easy to quickly add commonly usedfunctionality into your websites and many more…
  37. 37. Two categoriesHTML Helpers Make is faster and easier to render commonly used • Facebook markup to the page. • Twitter • …API Helpers Make is faster and easier to call complex APIs from • PayPal your website. • Windows Azure Storage • …
  38. 38. demoHelpers
  39. 39. App Gallery & OSS Apps
  40. 40. OSS Apps1. Free2. Popular = large community3. Gets you close to the solution quickly4. Easy to configure
  41. 41. Build on the success of Web PI Web Platform Installer WebMatrixDownload   Install (inc. dependencies) Customize SEO Analysis Publish 
  42. 42. demoApp Gallery
  43. 43. Conclusion
  44. 44. Next steps1. Install WebMatrix2. Play with it 1. Create a new website with templates or from scratch 2. Edit an existing one 3. Deploy an app by using the App Gallery3. Unleash the power of the Matrix & have fun
  45. 45. Resources• http://microsoft.com/web/webmatrix• http://asp.net/webmatrixresource (v1 tutorials)• http://www.webnotwar.ca/
  46. 46. Remember To Complete Your Evaluations!You could WIN a Samsung FocusWindows Phone 7!Let us know what you liked & disliked!Remember, 1=Bad, 5=Good Please provide comments!No purchase necessary. The contest is open to residents of Canada (excluding government employees). The Toronto Tech·Days evaluation form contest begins on October 25th, 2011 and endson October 26th, 2011. The Vancouver Tech·Days evaluation form contest begins on November 15th, 2011 and ends on November 16th, 2011. The Montreal Tech·Days evaluation form contestbegins on November 29th, 2011 and ends on November 30th, 2011. Participants can enter the contest in one of two ways: (1) complete and submit an evaluation form by the contest close date;or (2) provide contact information by the contest close date. The draw for Toronto will take place on October 31st, 2011. The draw for Vancouver will take place on November 21st, 2011. Thedraw for Montreal will take place on December 5th, 2011. The chances of being selected depend upon the number of eligible entries. Selected participants will be contacted by phone and/or e-mail and will be required to answer correctly a time-limited skill-testing question. There are three (3) prizes available to be won. One (1) prize will be given away for each Tech·Days event inToronto (October 25-26 2011), Vancouver (November 15-16 2011) and Montreal (November 29-30 2011). The prize consists of a Samsung Focus Windows Phone 7 (handset only; voice and/ordata plan not included) (approximate retail value of $499 CAD). The prize will be delivered to the shipping address designated by the winner within 6-8 weeks. The winner may be required tosign a declaration and release form. For full contest rules, please see a Microsoft Tech·Days representative. You can email any additional comments directly to td_can@microsoft.com at any time.
  47. 47. Q&A
  48. 48. Contact me Frederic Harper, Developer Evangelistfredh@microsoft.com@fharperhttp://webnotwar.cahttp://outofcomfortzone.net
  49. 49. © 2011 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

×