Developer

Feature Workflow

For development workflow using git, see the Git Workflow page.

• When claiming one of the features to work on, please put your initials next to the claimed feature. That way we don't duplicate each other's work.
• When starting a new feature, not listed on the feature page, just add a new number at the bottom of the list. That way everyone will know that someone is working on a new feature, and we won't have to duplicate our efforts.
• When finishing a feature, format the text to strike-out the feature. Also, be sure to document your new feature so that other can use it, and remember to add unit tests. Finally, if your feature requires any new pages, be sure to add them to install instructions in the README.md file.

Any general help or instructions for developers should also be documented on this page.

Getting started with Meteor:

See the Meteor homepage. To get started, try out meteor on your local machine and try going through the tutorial.

To get set up with the recipe playlist, see the README.md file in the repository root.

Setting up an IDE to work with:

We recommend using Chrome as an IDE. That's right, it's more than just a browser!

To use the developer tools:

• Open up chrome
• Browse to your meteor page (usually localhost:3000)
• Click on more-tools --> developer tools
  • F12 or Ctrl-Shift-I are potentially shortcuts (depends on your operating system)
  • This will bring up the developer tools
• To open up an editor as well as a console click on the button near the top right of the developer tools that looks like this: >_
• To pop out the developer tools into a separate window click and hold the button just left to the X until the pop-out button appears and you can select that
• To edit code you have to "Add a Folder to the Workspace"
  • Click on the Sources tab at the top of the Developer Tools Menu
  • In the left panel right click and select Add Folder to Workspace
  • Browse to the root folder where your code lives and click open
  • A yellow bar will appear at the top of the chrome window, asking for permission to access that folder: click Allow
  • Now you can open up that folder and the sources within and edit them using Chrome!
  • Meteor will automatically restart and update with code changes
• To set breakpoints:
  • Meteor generates new files based on the source code you wrote, so any breakpoints that you set in your edited source code will not be used
  • Instead go to the localhost:3000 'folder' (has a little planet icon) and expand that
  • Use your detective skills to find the file corresponding to your sourcefile
    • For e.g. the sourcefile home.html that contains the home template might be called template.home.js
  • To set a breakpoint, click on the line number where you want to stop, a little flag will appear
  • You might need to reload the page, or take an action that will send the code to that breakpoint
  • When the code reaches the line with the breakpoint it will stop, and then you can use the console to examine what's going on
  • After debugging, you can click the play button, located on the right panel just above Threads to continue, or just reload the page
  • To remove the breakpoint, just click the line again
• To test using the console:
  • At the bottom of the developer tools is an interactive console. You can use this to examine variables and test things out
  • Click on the console and enter some javascript that you want to test
    • e.g. if you enter 1+1 the console should return 2
    • e.g. if you have a fresh meteor app, you can type Session.get("counter") and it will return the number of times you've click the button.