0
Developing Windows Azure Websites with Visual
Studio Online “Monaco”
Because it’s mundane “Monaco”

Who Am I

Where I Work...
info:
_
_____
_ ___ ___
info:
/_ |_ / | | | _  __|
info:
_ ___/ _ __/ /| |_| |
/ _|___ _ _
info:
(___ /_/ _/___|___/|_|___...
AZURE WEBSITE

SandBox and Dev site
Web page title
http://www.url.com

Node.js
PHP
Etc.

DEVSITE URL

runs

Web page title...
<html>
<Body>
<H1>The backend uses the following node modules:</H1>
edge – Edge.js: run .NET and node.js code in-process
(...
/ $ Azure Monaco list NAVIGATION ONSCREEN
info:
File Explorer
info:
Search
info:
Git
info:
Output window
info:
Console Win...
/ $ Azure Monaco
info:
Shostcut
info:
- CTRL +
info:
- CTRL +
info:
- ALT +
info:

/ $ More

list NAVIGATION Shortcuts
key...
/ $ Azure Monaco list NAVIGATION Settings
info:
settings Page
info:
Theming
info:
info:

/ $ More
/ $ Azure Monaco list NAVIGATION OTHER
info:
Split window view
info:
Help
info:
info:

/ $ DEMO
/ $ 03 – Capabilities – wa...
info:
_
_____
_ ___ ___
info:
/_ |_ / | | | _  __|
info:
_ ___/ _ __/ /| |_| |
/ _|___ _ _
info:
(___ /_/ _/___|___/|_|___...
/ $ Azure Monaco Help -extra
info:
NUGET
info:
Ability is foreseen for packet management
info:
info:
info:
NPM
info:
Node ...
/ $ FAQ
info:
TFS Repository Cloning?
info:
not for the moment, but probably will come
info:
info:
info:
Is there any debu...
info:
_
_____
_ ___ ___
info:
/_ |_ / | | | _  __|
info:
_ ___/ _ __/ /| |_| |
/ _|___ _ _
info:
(___ /_/ _/___|___/|_|___...
.'''''''''''''.
.'..
.'.
.''..
.''.
..'.
.''.
..''.
.KMMMMMMMMMMMMW0. ,NWX:
'KWK'
cXWMNd.
.KMMXc
.kWNl
.KWNc
.c0WNd,
',,,:...
Windows Azure Visual Studio "Monaco"", Because it’s mundane
Upcoming SlideShare
Loading in...5
×

Windows Azure Visual Studio "Monaco"", Because it’s mundane

1,959

Published on

my talk for Visug on Visual Studio Online for Windows Azure, named Monaco

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

  • Be the first to like this

No Downloads
Views
Total Views
1,959
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • arcitecturebased on kudu and private website exetensionstypescript compiled to javascriptast in browser so language services in the browserruns in the browser 200000 lines of typescript for the Monaco CodebaseNode.JS server basedbased upon the same base as Napa, TFS Online, Skydrive, WAMS and so on...
  • Transcript of "Windows Azure Visual Studio "Monaco"", Because it’s mundane"

    1. 1. Developing Windows Azure Websites with Visual Studio Online “Monaco” Because it’s mundane “Monaco” Who Am I Where I Work What I Do Where to find me Mike Martin Crosspoint Solutions Architect Azug crew Azure MVP Azure Insider MEET Member @Techmike2kx View more tips on my blog Mike.Martin@csps.b e http://techmike2kx.wordpress.com
    2. 2. info: _ _____ _ ___ ___ info: /_ |_ / | | | _ __| info: _ ___/ _ __/ /| |_| | / _|___ _ _ info: (___ /_/ _/___|___/|_|____| _____) info: (_______ _ _) _ ______ _)_ _ info: (______________ _ ) (___ _ _) info: info: Windows Azure: Microsoft's Cloud Platform info: / $ Azure Monaco Help -Description info: It is not to be confound with Viusal Studio Online info: It is an extension to that info: info: info: Use it for on the fly change mechanism or as dev stage for info: simple or more complex websites / $ Render 01 – Architecture – To the drawingboard.html
    3. 3. AZURE WEBSITE SandBox and Dev site Web page title http://www.url.com Node.js PHP Etc. DEVSITE URL runs Web page title http://www.url.com SITE EXTENSION Monaco URL Node.js PHP Etc. WWW ROOT R/W ACCESS WORKSPACE
    4. 4. <html> <Body> <H1>The backend uses the following node modules:</H1> edge – Edge.js: run .NET and node.js code in-process (https://npmjs.org/package/edge) express – Sinatra inspired web development framework (https://npmjs.org/package/express) glob - Match files using the patterns the shell uses, like stars and stuff. (https://npmjs.org/package/glob) graceful-fs - A drop-in replacement for fs, making various improvements. (https://npmjs.org/package/graceful-fs) ini - An ini encoder/decoder for node (https://npmjs.org/package/ini) jake - JavaScript build tool, similar to Make or Rake (https://npmjs.org/package/jake) nake - GNU Make/Ruby Rake like tasks management tool for NodeJS (https://npmjs.org/package/nake) npm - A package manager for node (https://npmjs.org/package/npm) optimist - Light-weight option parsing with an argv hash. No optstrings attached. (https://npmjs.org/package/optimist) sax - An evented streaming XML parser in JavaScript (https://npmjs.org/package/sax) send - Better streaming static file server with Range and conditional-GET support (https://npmjs.org/package/send) <Body> </html>
    5. 5. / $ Azure Monaco list NAVIGATION ONSCREEN info: File Explorer info: Search info: Git info: Output window info: Console Window / $ More
    6. 6. / $ Azure Monaco info: Shostcut info: - CTRL + info: - CTRL + info: - ALT + info: / $ More list NAVIGATION Shortcuts key support E . F1
    7. 7. / $ Azure Monaco list NAVIGATION Settings info: settings Page info: Theming info: info: / $ More
    8. 8. / $ Azure Monaco list NAVIGATION OTHER info: Split window view info: Help info: info: / $ DEMO / $ 03 – Capabilities – wat is in ze box - Air.html
    9. 9. info: _ _____ _ ___ ___ info: /_ |_ / | | | _ __| info: _ ___/ _ __/ /| |_| | / _|___ _ _ info: (___ /_/ _/___|___/|_|____| _____) info: (_______ _ _) _ ______ _)_ _ info: (______________ _ ) (___ _ _) info: info: Windows Azure: Microsoft's Cloud Platform info: / $ Azure Monaco Help -functions info: Intellisense info: info: Source Control Integration info: info: Some stuff we know from Visual Studio info: / $ DEMO / $ 04 – Addendum – Far beyond driven.html
    10. 10. / $ Azure Monaco Help -extra info: NUGET info: Ability is foreseen for packet management info: info: info: NPM info: Node PacketManager … mmm nice tricks :-) info: info: Other info: express Express node.js MVC info: framework commanding info: git Git source control info: commanding info: jake Jake commanding info: msbuild MSBuild commanding info: node Node.js commanding info: node-sass SASS translator info: ps PowerShell commanding info: unzip Unzip archives / $ error
    11. 11. / $ FAQ info: TFS Repository Cloning? info: not for the moment, but probably will come info: info: info: Is there any debugging support? info: no vs style, no info: info: BUT info: console.log output from your site will info: be routed to the Output info: window in Monaco info: You can use node-inspector to debug node info: based websites info: info: Visual Studio 2013 now provides remote info: debugging of Azure Web Sites info: info: / $ 05 – Epilogue – Elementary dear Watson.html
    12. 12. info: _ _____ _ ___ ___ info: /_ |_ / | | | _ __| info: _ ___/ _ __/ /| |_| | / _|___ _ _ info: (___ /_/ _/___|___/|_|____| _____) info: (_______ _ _) _ ______ _)_ _ info: (______________ _ ) (___ _ _) info: info: Windows Azure: Microsoft's Cloud Platform info: / $ Azure Monaco Help –Scenarios -Extended info: KUDU info: Underlying system used for hosting the extension info: and some additional fooling around info: info: DEV – TEST – PROD enablement info: need of standard server for that info: info: Staging scenario info: info: / $ LAST DEMO / $ cls
    13. 13. .'''''''''''''. .'.. .'. .''.. .''. ..'. .''. ..''. .KMMMMMMMMMMMMW0. ,NWX: 'KWK' cXWMNd. .KMMXc .kWNl .KWNc .c0WNd, ',,,:OWWO;,,,,. lWWO. .oNWx lNWXWWK. :NMWMXc ,XMX. cNMX. .c0WNk, ,KMN; .0MNl .0WNc lNNd;0WN: .OWKoKWXc .xWWx. .0WWd :0WNx' lNMK. ,XM0. cNMK. .dNNo .dWNo ,XMO.,KWX; 'KMX; ;XMX:;OWNx' .0WNl .dWMNOOkOOOkkOXMWx .kWWo cNWO. .dWNc ;KWK: oNWO. .xWMNKNNk' cNMK' 'KMNOkkkkkkkOKWMX, ,0WNd. ,XMX, 'KMK. ,KWX' .0WN: ,XMNdOWWx. .OWWx. lNWk. .dWWO. ;KMMW0OOOOKWMWc lNWd :XWO.:NMK. .oWM0..kWWO. ;NMX; .0WX; ,XMX: cXMNOkxxxxxkKWWk .0WN; :KW0KWNo .KMNl .xWW0; .dWWO. cNMO. .oWW0. .dNMX: :NM0. cNWO. ;XMMMX' lNMK' .dNMXl. ,KWXc .kWWo 'KWNo .dWWK; .KWX, .kWNo lNMWx. .OWNd. .oNMNd. .'. .''. .'. .''. .'. .'.. .'.. .'.. .''. ';,. ,;;, ,;;. ,;;;;;. .xWNo .oNMXc ,XMN: ,xKWMMMMWNx. cNWk. .dNW0, oWW0. cNWXd,...,l; 'KM0. .xWWk. .KMNc .OMWx. .OMK; .dWWk. ;NMK' dWMXo. dWNo .dNNo. xWNd .oXWWXOc. ;XWk. .xNXc .KMX, .;xXMMK: 'XM0..xWNc lNWk. .dNMK' .OMXd0WXc .OWX: ;XMK' oWMWW0, cXWO. '0XxlcclxNMXc :NWNO, .xNXl .lkNWWWWNOo' / $ EXIT .''. ..'. .''''. dNWK' ;0WXl. .ckKWMMMMW0d' '0WWo .oXWO' .dXWXkc,,,;xXMNx. cNMK. 'OWNd. :KMWx. 'KMWO. .OWWc ;0WK: :XMWo. lNMX; ;XMKkNNd. .OWWO. cNMN; .xWMWK: .KMWd. .xWMK' :XMK' .0MWd. :NMNc dNWd oNMXl .cXMXl 'KMX' lXWW0c;;;ckXWNx. lNWO. .lkNMMMMWXOo' .''. .'''''. ,;,. .;;' ';;;;;;' 'KMK' .kWWk. 'lOKNMMMMMMW0l dWNd ;XMN; :OWWXxc'....'ld; '0MX, .xWWO. .xWMXl. lNWx. 'KMNc cNMX: .OWN: oNW0. .OMWd. '::::::; :XM0. .KMNl .0MNc .0NWWMMMO. lNMk. oNM0. .OMWd. ...,0MWl cXMK, :XMX: :XMNd. :XMX' .oXMNklcloKWWO, ;0WMN0occco0WWd. 'oKWWWWWKd;. .;okNWWWWNKxl. .'.. .'. ,KWN: oNWx. .dWWO. .0MX; 'KMNc cXM0. oNW0. .OMWl .0WWo. :XMX, :NMK' .kWWx. lWWO. ;XMN; cNMX; ,0WWo. .kWMNx:;;cONWXl. .:kXWMMMWXOo. .'''''.
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×