Share via

Meteor 1.4 App on Azure App Services

  • 08/24/2016

Meteor is a full-stack JavaScript platform for developing modern web and mobile applications. Meteor includes a key set of technologies for building connected-client reactive applications, a build tool, and a curated set of packages from the Nodejs and general JavaScript community.

This Blog would help you create a sample meteor app in local environment and later we would help you move sample app to Azure Web Apps

Creating Sample Meteor App:

Use Below command to install meteor on local environment

 curl https://install.meteor.com/ | sh

Check for your meteor version. we highly recommend using > 1.4

 meteor --version

Use Below command to create a sample meteor app

 meteor create simple-todos

Above command would create a new folder with few files for our sample app as in below screenshot

Meteor App

Using Demeteorizer to convert app into node.js format

Use below cmd to install Demeteorizer

 npm install -g demeteorizer

Navigate to your meteor app root folder and enter below cmd

 >demeteorizer

It would create a new .demeteorized folder
Demeteorized App

Navigate to .demeteorized/bundle/programs/server using below cmd

 cd .demeteorized/bundle/programs/server

Please Use npm > 3 if you are getting any  long path issues.. Use NVM(https://github.com/coreybutler/nvm-windows) to easily change node/npm version in local environment.  

Enter below cmd to install all the required node.js modules

 npm install
Running App on Local Env

Use below cmd to execute demeteorized/converted nodejs app in local environment

 PORT=8080 ROOT_URL=https://localhost:8080 npm start

Local Meteor

Moving App to Azure

Create a new web app on azure and Setup continuous deployment and get the git url. Below link has details on it
https://azure.microsoft.com/en-us/documentation/articles/web-sites-nodejs-develop-deploy-mac/

Add below app setting to your web app inside Azure portal App Settings
Key : ROOT_URL
Value : web app url(ex: https://Your_APP_Name.azurewebsites.net/)

Create a web.config file @ .demeteorized/bundle/ and insert below link content
https://raw.githubusercontent.com/christopheranderson/azure-demeteorizer/master/resources/web.config web config file

Navigate to .demeteorized/bundle/ folder and Commit your changes to WEB_APP_GIT_URL

 git init  
git add .  
git commit -m "initial commit"  
git remote add samplemeteorapp WEB_APP_GIT_URL  
git push samplemeteorapp master

web config file

Comments

  • Anonymous
    September 17, 2016
    Thanks, this worked for me! Don't forget to activate websockets in your apps configurations and the "http://" prefix at ROOT_URL is really important!What is the easiest way to connect to MongoDB from the Web Service?
    • Anonymous
      September 20, 2016
      Do you want a sample code or the npm module name ? .. try mongoose for nodejs..
    • Anonymous
      November 30, 2016
      I believe there is a MONGO_URL environment variable you have to use to connect to your mongodb server
    • Anonymous
      January 29, 2017
      Hi Adrian,How do you activate Websockets? Isn't it a default Meteor setting.
  • Anonymous
    February 03, 2017
    thanks!! greate job!,I have a question, how update the demeteorizer app in azure? I need demeteorizer again? i need delete .demeteorized folder?
  • Anonymous
    June 05, 2017
    I followed the same steps but when i browse the app after deploying i am getting error "You do not have permission to view this directory or page."
  • Anonymous
    September 26, 2017
    The comment has been removed