Commit 98022a4a authored by Seb's avatar Seb

added permalinks to all articles

parent aee6b672
......@@ -2,6 +2,7 @@
title: 'Intro'
layout: series_item
series: '101'
permalink: 101/intro/
estimated-time: 5
---
......
......@@ -2,6 +2,7 @@
title: 'What is BioJS?'
layout: series_item
series: '101'
permalink: 101/what_is_biojs/
estimated-time: 5
---
......@@ -9,7 +10,7 @@ estimated-time: 5
(Image credits: [Jeremey Page](https://www.flickr.com/photos/jezpage/4990873353))
{:style="font-size: 9px; text-align: center"}
Basically BioJS components behave like Lego blocks. You don't start from scratch - can build on top of other blocks.
What exactly is a BioJS package?
......@@ -17,10 +18,10 @@ What exactly is a BioJS package?
A __tiny building block__ that can be reused by anyone.
It could be anything from a FASTA parser, a tree algorithm or a simple visualization module.
Moreover a BioJS package is also a `npm` package.
Moreover a BioJS package is also a `npm` package.
{% hlblock info %}
`npm` stands for node package manager and is the package repository that powers node.
`npm` stands for node package manager and is the package repository that powers node.
{% endhlblock %}
{% hlblock info %}
......@@ -31,7 +32,7 @@ Moreover a BioJS package is also a `npm` package.
What is BioJS?
---------------------
We are quite more than just a registry for components - we aim to build a infrastructure
We are quite more than just a registry for components - we aim to build a infrastructure
, guidelines and tools to avoid the reinvention of the wheel in life sciences (= "Docker for Bio web components").
In the early days of BioJS we defined specific _Easy to_ goals, let's see where we currently stand:
......@@ -44,6 +45,6 @@ In the early days of BioJS we defined specific _Easy to_ goals, let's see where
* Easy to _get involved_ : Apart from our amazing tutorial, we are also very active on github and gitter
<!--
* Easy to start:
* Easy to start:
* Easy to test
-->
......@@ -2,6 +2,7 @@
title: 'Getting started'
layout: series_item
series: '101'
permalink: 101/getting_started/
estimated-time: 5
---
......@@ -11,11 +12,11 @@ You will need __`npm`__ and __`git`__ on your shell.
- [__Linux__](#linux)
- [__Windows__](#windows)
When your machine is ready to rumble, continue to the [tutorial](30_headstart.html)
When your machine is ready to rumble, continue to the [tutorial]({{site.baseurl}}/101/modularity)
{% hlblock check %}
See whether you have both commands (`npm`, `git`) installed. You should run the above without
See whether you have both commands (`npm`, `git`) installed. You should run the above without
any error.
~~~
......@@ -35,10 +36,10 @@ What does `npm` stand for?
<a name="mac"></a>
### Mac Users
### Mac Users
Homebrew, git and node.js are three packages that are worth having on your Mac if you want to do software development.
* [Homebrew](http://brew.sh) is called the 'missing package manager for OS X'. It allows you to download packages onto your Mac from your command line.
* [Git](https://github.com) is a version control system that will keep track of the changes you have made in code.
* [Node.js](http://nodejs.org) is a 'runtime environment platform for server-side JavaScript applications'.
......@@ -59,13 +60,13 @@ Using Homebrew to install node.js:
brew install node # installs the node package
~~~
If you have not installed `git`, this command uses homebrew to install git:
If you have not installed `git`, this command uses homebrew to install git:
~~~
brew install git
~~~
To ensure you have installed these correctly, it is worth checking by typing "git help" and "npm help" into the command line again.
To ensure you have installed these correctly, it is worth checking by typing "git help" and "npm help" into the command line again.
Alternatively you can also install NodeJs via the [package installer](http://nodejs.org/download/).
......@@ -80,7 +81,7 @@ You can also download [Github for Mac](https://mac.github.com/).
Install nodejs via [your package manager](https://github.com/joyent/node/wiki/installing-node.js-via-package-manager)
{% endhlblock %}
E.g.
E.g.
~~~
curl -sL https://deb.nodesource.com/setup | sudo bash - # Ubuntu, Debian
......@@ -106,10 +107,10 @@ nvm install 0.10.30 && nvm alias default 0.10.30 && nvm use default # install no
We assume that you most likely will know how to install a package, however feel free to add instructions for your favorite distro.
<a name="windows"></a>
### Windows Users
### Windows Users
You must be completely crazy if you want to develop anything on Windows.
Be warned that some packages just assume that they have a UNIX-like enviroment.
......@@ -121,13 +122,13 @@ Way 2) Build node from the source code
1. [install cygwin](http://www.mcclean-cooper.com/valentino/cygwin_install/)
- Use setup.exe in the cygwin folder to install the following packages:
* devel → openssl
* devel → g++-gcc
* devel → make
* python → python
* devel → openssl
* devel → g++-gcc
* devel → make
* python → python
* devel → git
- Open the cygwin command line with Start > Cygwin > Cygwin Bash Shell.
2. Build node from the source:
......
......@@ -2,7 +2,8 @@
title: 'Modularity'
layout: series_item
series: '101'
estimated-time: 15
permalink: 101/modularity/
estimated-time: 15
---
This is a short 5 minutes tutorial on the basics of using and reusing BioJS components.
......@@ -11,7 +12,7 @@ This is a short 5 minutes tutorial on the basics of using and reusing BioJS comp
-------------------------
{% alert warn %}
You need to install `node` before you can start to rock. See <a href="20_getting_started.html"> the getting started guide </a> for more info.
You need to install `node` before you can start to rock. See <a href="{{site.baseurl}}/101/getting_started/"> the getting started guide </a> for more info.
{% endalert %}
How does the LEGO-System of BioJS works?
......@@ -35,10 +36,10 @@ module.exports = biojs101;
~~~
Congratulations, you wrote your first BioJS Component!
Run
Run
~~~
node index.js
node index.js
~~~
to run this file! It should show you `3`.
......@@ -60,7 +61,7 @@ Congratulations! You reused your first biojs function in the source code!
Check for yourself, type in:
~~~
node reuse.js
node reuse.js
~~~
It will show you `3` (because of console.log in `index.js`) and `9`.
......@@ -98,7 +99,7 @@ var parsed_data = parser(newick);
console.log(parsed_data);
~~~
Now run again
Now run again
~~~
node reuse.js
......
......@@ -2,7 +2,8 @@
title: 'Example snippets'
layout: series_item
series: '101'
estimated-time: 5
permalink: 101/example_snippets/
estimated-time: 5
---
{% alert warn %}
......@@ -19,7 +20,7 @@ var instance = new App({el: rootDiv, <other options>});
~~~
You might realize that an ideal snippet doesn't include any HTML at all. Well why should you?
If you convert the BioJS snippet to real HTML you would have to create this minimal HTML file for every snippet that you provide. In fact you state all your global dependencies in a global configuration file - the [`package.json`](../details/40_package_json.html)
If you convert the BioJS snippet to real HTML you would have to create this minimal HTML file for every snippet that you provide. In fact you state all your global dependencies in a global configuration file - the [`package.json`]({{site.baseurl}}/details/package_json)
~~~
<html>
......@@ -36,7 +37,7 @@ var instance = new App({el: rootDiv, <other options>});
</html>
~~~
If you don't want us to create a DOM element automatically and assign this DOM element to the variable `rootDiv`, you can create your own HTML, but please use only the body part (here `<div id=rootDiv></div>`).
If you don't want us to create a DOM element automatically and assign this DOM element to the variable `rootDiv`, you can create your own HTML, but please use only the body part (here `<div id=rootDiv></div>`).
### Wait ... I have never seen `require` in a browser JS!
......
......@@ -3,6 +3,7 @@ title: 'Publish it'
layout: series_item
contributors: David, Seb
series: '101'
permalink: 101/publish_it/
estimated-time: 5
---
......@@ -44,4 +45,3 @@ If you have fixed them and want to deploy a new version of your component, run `
You made it. Get your coffee and celebrate. However the rest of this tutorial stays interesting.
So just enjoy the rest.
{% endalert %}
......@@ -2,6 +2,7 @@
title: 'Other resources'
layout: series_item
series: '101'
permalink: 101/other_resources/
estimated-time: 5
---
......@@ -17,7 +18,7 @@ Javascript guides
Pointers to different visualization approaches
---------------------------------
* SVG
* SVG
- [D3](http://d3js.org/)
* Canvas
- [KineticJS](http://kineticjs.com/)
......
......@@ -4,6 +4,7 @@ layout: series_item
contributors: Seb
series: '102'
estimated-time: 5
permalink: 102/tools/
extra_css2: ["/css/aspects.css"]
aspectsURL: /img/aspects/
aspects:
......@@ -33,7 +34,7 @@ aspects:
href: https://circleci.com/
- name: Cloudbees
img: cloudbees.png
href: http://www.cloudbees.com/
href: http://www.cloudbees.com/
- name: Code Climate
img: codeclimate.png
href: https://codeclimate.com/
......@@ -76,7 +77,7 @@ aspects:
items:
- name: CSS 4
img: css4.png
href: http://dev.w3.org/csswg/selectors4/
href: http://dev.w3.org/csswg/selectors4/
- name: JSHint
img: jshint.png
href: http://www.jshint.com/
......@@ -91,7 +92,7 @@ aspects:
href: https://learnboost.github.io/stylus/
- name: UglifyJS
img: uglifyjs.png
href: https://github.com/mishoo/UglifyJS2
href: https://github.com/mishoo/UglifyJS2
- name: Testing
folder: testing
......@@ -118,7 +119,7 @@ aspects:
- name: SinonJS
img: sinonjs.png
href: http://sinonjs.org/
- name: Utils
folder: utils
order: 100
......
......@@ -3,13 +3,14 @@ title: 'Visualization: D3'
layout: series_item
contributors: David
series: '102'
estimated-time: 30
permalink: /102/vis_d3/
estimated-time: 30
---
In the following section we will give you a gentle introduction on how to create a component for BioJS 2.0.
As a case study, we will continue working with chromosome data and show you how to visualize this data with D3.
First of all create a new folder called `biojs-vis-snipspector` by running [`slush biojs`](https://github.com/biojs/slush-biojs).
We will use this as our working bench and only edit the `index.js` file inside the `lib` folder.
We will use this as our working bench and only edit the `index.js` file inside the `lib` folder.
Note: Please replace the current code with our following code!
### 1) Installing a npm dependency
......@@ -47,7 +48,7 @@ to get our parsed data, please have a look at the previous [tutorial](/series/10
~~~
parser.read("http://files.biojs.net/chromosomes/manny", function(result){
var genome = result;
})
~~~
......@@ -88,7 +89,7 @@ var pie = d3.layout.pie()
Let me go trough the code:
- First we need a `radius`,`width` and `height` value for our svg components.
- `color` is a function which will translate values into color code.
- `color` is a function which will translate values into color code.
- `arc` draws our svg arc. We we set `innerRadius` to `0`, we would get a piechart.
- `pie` is our data transformer. D3 provides us with an converter (or layouts), which will convert an array data representation into a suitable representation for pie charts.
......@@ -139,15 +140,15 @@ function converter(genome){...}
parser.read("http://files.biojs.net/chromosomes/manny", function(result){
var data_res = converter(result);
//Our visualization code ...
})
~~~
All chromosomes are now in an optimal array representation and each chromosome object is now represented by his name and dataset.
### 5) Creating a donut chart!
### 5) Creating a donut chart!
Now, after cleaning up our data, let's get finally to the visualization part!
First, we will visualize the data in chromosome 'X' in a donut chart!
......@@ -187,7 +188,7 @@ g.append("text")
D3 handles new data with `enter()`. To learn more about `enter`,`update` and `delete`, visit the [d3 tutorial](http://d3js.org/).
Congratulations! You wrote your first visualization component for biojs!
Now it is time to export and build it!
Now it is time to export and build it!
To export it write a wrapper around your all your code (except the dependencies)
......@@ -204,7 +205,7 @@ module.exports = d3_show;
We recommend browserify. Therefore use our preinstalled npm run build-browser!
~~~
npm run build-browser
npm run build-browser
~~~
to create a build for this file! If this fails, create a build folder first!
......@@ -213,7 +214,7 @@ Now you can easily include this into a simple html using:
`snippets/simple_example.js`
~~~
var app = require("biojs-vis-snipspector");
var app = require("biojs-vis-snipspector");
app({el: yourDiv});
~~~
......@@ -243,7 +244,7 @@ function d3_show(opts) {
.value(function (d) {
return d.number;
});
function converter(genome){
var data_res = [];
......@@ -271,9 +272,9 @@ function converter(genome){
parser.read("http://files.biojs.net/chromosomes/manny", function(result){
var data_res = converter(result);
var X_data = data_res[22].data;
var svg = d3.select(el).append("svg")
.attr("width", width)
.attr("height", height)
......@@ -300,7 +301,7 @@ parser.read("http://files.biojs.net/chromosomes/manny", function(result){
.text(function (d) {
return d.data.category;
});
})
}
......@@ -310,7 +311,7 @@ module.exports = d3_show;
For more information about how each code component works, have a look at following [resources](http://schoolofdata.org/2013/10/01/pie-and-donut-charts-in-d3-js/).
In our final component `biojs-vis-snipspector`, we also included a function to visualize all chromosomes.
In our final component `biojs-vis-snipspector`, we also included a function to visualize all chromosomes.
<div id="vis"></div>
......
......@@ -3,7 +3,8 @@ title: 'Parser: using real data'
layout: series_item
contributors: Seb
series: '102'
estimated-time: 30
permalink: 102/parser_real_data/
estimated-time: 30
---
{% alert warn %}
......@@ -11,7 +12,7 @@ Please create the [basic package](../101/30_package_basics.html) before.
Alternatively you can clone the [solution of the last exercise](https://github.com/biojs/biojs-io-snipspector/tree/basic_packaging).
{% endalert %}
{% hlblock help %}
{% hlblock help %}
[Here](http://jsbin.com/hiyijagawete/2/edit) is the result of this example - parsing the 15MB file with 500,000 lines in your browser.
{% endhlblock %}
......@@ -126,14 +127,14 @@ snipspector.parse = function(data) {
if(data.indexOf('\n') >= 0 ){
data = data.split('\n');
}
var chromosomes = [];
// analyze snippets
// homo(zygous): AA
// hetero(zygous): AC
// del(etion): A-, -A or --
var chr = null;
for (var i = 0; i < data.length; i++) {
......@@ -177,7 +178,7 @@ snipspector.parse = function(data) {
}
//Should print [{name: "20", homo: 2, hetero: 1, del: 0,
// {name: "21", homo: 1, hetero: 1, del: 1},
// {name: "21", homo: 1, hetero: 1, del: 1},
// {name: "22", homo 1, hetero: 1, del: 0 }]
......@@ -264,7 +265,7 @@ Write a second unit test that calls our mocked URL and test whether `snipspector
{% hlblock stop %}
no please do __not__ have a look at our solution, if your unit test is green -
no please do __not__ have a look at our solution, if your unit test is green -
your solution is correct!
{% endhlblock %}
......@@ -287,7 +288,7 @@ var scope = nock(testURL)
.replyWithFile(200, __dirname + '/test.file');
var dummyObj = [{name: "20", homo: 2, hetero: 1, del: 0},
{name: "21", homo: 1, hetero: 1, del: 1},
{name: "21", homo: 1, hetero: 1, del: 1},
{name: "22", homo: 1, hetero: 1, del: 0 }];
describe('Snipspector', function(){
......@@ -316,9 +317,9 @@ describe('Snipspector', function(){
});
});
{% endcode %}
<br>
{% hlblock info %}
You can find the complete solution of this package on [github](https://github.com/biojs/biojs-io-snipspector) and [npm](https://www.npmjs.org/package/biojs-io-snipspector).
{% endhlblock %}
......@@ -3,6 +3,7 @@ title: 'Continuous integration'
layout: series_item
contributors: Seb
series: '102'
permalink: 102/continuous_integration/
estimated-time: 5
---
......@@ -14,8 +15,8 @@ estimated-time: 5
~~~
language: node_js
node_js:
- "0.11"
- "0.10"
- "0.12"
- iojs
~~~~
2. Add your project on [Travis](https://travis-ci.org/profile/greenify) (flip the button to on - this will create a github webhook)
......@@ -27,18 +28,6 @@ node_js:
You can also install the [Travis CLI](https://github.com/travis-ci/travis.rb)(`gem install travis`) command and run `travis enable`.
{% endhlblock%}
3. Add the shield to your `package.json`.
~~~
"shields": {
"test": {
"img": "https://travis-ci.org/greenify/biojs-vis-msa.svg?branch=master",
"href": "https://travis-ci.org/greenify/biojs-vis-msa"
},
},
~~~
#### 2) Using [drone.io](https://drone.io/)
* new project -> github -> add your project
......@@ -48,22 +37,12 @@ You can also install the [Travis CLI](https://github.com/travis-ci/travis.rb)(`g
~~~
npm install --silent
npm test
npm run build-browser
npm run build
~~~
* change the nvm to node __0.10__
* artifacts: enter the relative dir of files that should be downloadable (e.g. `build/biojs_io_fasta.min.js`)
Add the shield to your `package.json`.
~~~
"shields": {
"build": {
img: "https://drone.io/github.com/greenify/biojs-io-clustal/status.png",
href: "https://drone.io/github.com/greenify/biojs-io-clustal/latest"
}
},
~~~
### 3) Add other badges
......@@ -75,3 +54,7 @@ There are plenty of fancy badges, here is a list to have a quick start.
[![Code Climate](https://codeclimate.com/github/<username>/<package-name>/badges/gpa.svg)](https://codeclimate.com/github/<username>/<package-name>)
[![NPM downloads](http://img.shields.io/npm/dm/<package-name>.svg)](https://www.npmjs.org/package/<package-name>)
~~~
{% alert warn %}
There is no need to add your CI badges to the `package.json` , the BioJS registry will soon automatically recognize existing continuous integration services.
{% endalert %}
......@@ -2,6 +2,7 @@
title: 'Events'
layout: series_item
series: 'details'
permalink: details/events/
estimated-time: 10
---
......@@ -72,7 +73,7 @@ How to use
npm install biojs-events --save
~~~
### 2. Mix the events capability with your object
### 2. Mix the events capability with your object
After the code of your BioJS component add the events capability by mixing you component prototype with the event class
......
......@@ -2,18 +2,19 @@
title: 'Reusability'
layout: series_item
series: 'details'
permalink: details/reusability/
estimated-time: 10
---
The modularity and re-usability is one of the key ideas of BioJS. Maybe it helps to think of biojs.io as an "App Store" for JS components and "downloading the App" means actually embedding it in a website.
The modularity and re-usability is one of the key ideas of BioJS. Maybe it helps to think of biojs.io as an "App Store" for JS components and "downloading the App" means actually embedding it in a website.
### General assumptions:
(user refers to someone who embeds your application, e.g. a website owner)
* you only have __one div__ (nobody wants to copy HTML that will change over versions, to some extent you could have more for optional user controls)
* you only have __one div__ (nobody wants to copy HTML that will change over versions, to some extent you could have more for optional user controls)
* a user is allowed to create multiple instances of your app (on the same page)
* a user might want to customize your app by changing some options - he will have its own file and customize the your settings
* a user might want to customize your app by changing some options - he will have its own file and customize the your settings
### This means:
......@@ -21,7 +22,7 @@ The modularity and re-usability is one of the key ideas of BioJS. Maybe it helps
* If you want to stick with your HTML upload form, please provide at least one minimal example with just your raw component (see below for a minimal example)
* Don't use global variables!
* Consider the div that your application gets as a virtual environment for your component - only modify stuff inside of it
* A user will instantiate your application (=will call your main class with new)
* A user will instantiate your application (=will call your main class with new)
* Don't do crazy shit with document.body or the Function.prototype
* Don't query the entire web page for DOM elements - an ID is unique. So $('#fancyId') won't work and $(".fancyClass") will return you the objects of all instances
......
---
title: 'Gold standard'
title: 'Conventions'
layout: series_item
contributors: Seb
series: '102'
estimated-time: 5
series: details
permalink: details/conventions/
estimated-time: 5
---
Conventions
......
......@@ -2,6 +2,7 @@
title: 'Common code patterns'
layout: series_item
series: 'details'
permalink: details/code_patterns/
estimated-time: 10
---
......
......@@ -2,6 +2,7 @@
title: 'Package.json'
layout: series_item
series: 'details'
permalink: details/package_json/
estimated-time: 10
---
......@@ -14,6 +15,7 @@ All the following parameters can be added or changed in your `package.json`
* `logo`: alternative project logo (default: github avatar)
* `registryHeight`: height of the registry iFrame for your first example (default: 400)
* `publication`: PMID (Pubmed Id) to the most recent citation (can also be an array)
* `testing_service`: testing service used (`travis`, `drone.io`, `circleci`, `snapci`, ...)
~~~
"biojs": {
......
......@@ -2,6 +2,7 @@
title: 'Adding CSS'
layout: series_item
series: 'details'
permalink: details/css/
estimated-time: 10
---
......@@ -17,7 +18,7 @@ We use [`parcelify`](https://github.com/rotundasoftware/parcelify) as this allow
"style" : "css/*.css"
~~~
or
or
~~~
"style" : "*.scss"
......
......@@ -3,6 +3,7 @@ title: 'Intro'
layout: series_item
contributors: Manny, Seb
series: 'snipspector'
permalink: /snipspector/intro/
estimated-time: 5
---
......@@ -13,7 +14,7 @@ Purpose of this tutorial series
* Get hands on dependency management in BioJS 2.0
* Master the workflow for publishing a package on npm and the BioJS 2.0 registry
After installing npm, you will first create
After installing npm, you will first create
1. A simple parser of SNPs (Single Nucleotide Polymorphisms) from [@manuelcorpas](http://manuelcorpas.com/) (`biojs-io-snipspector`)
2. Visualize this output (`biojs-vis-snipspector`)
......
......@@ -3,11 +3,12 @@ title: 'Package basics'
layout: series_item
contributors: David, Iris, Manny, Seb
series: 'snipspector'
estimated-time: 60
permalink: /snipspector/basics/
estimated-time: 60
---
{% alert warn %}
You need to install `npm` before you can start to rock. See <a href="20_getting_started.html"> the getting started guide </a> for more info.
You need to install `npm` before you can start to rock. See <a href="{{site.baseurl}}/101/getting_started/"> the getting started guide </a> for more info.
{% endalert %}
In the following section we will give you a gentle introduction on how to create a component for BioJS 2.0.
......@@ -106,7 +107,7 @@ These snippets will be used for the [BioJS registry](http://biojs.io).
npm run sniper
~~~
and open [http://localhost:9090/snippets](http://localhost:9090/snippets). See the [Sniper repository](https://github.com/biojs/biojs-sniper) for more details.
and open [http://localhost:9090/snippets](http://localhost:9090/snippets). See the [Sniper repository](https://github.com/biojs/biojs-sniper) for more details.
### 2. Watchify
......@@ -136,7 +137,7 @@ They are grouped into two sections:
Gotchas:
* The Unit tests are run with PhantomJS, if you want to debug them open the `test/index.html`
* The Unit tests are run with PhantomJS, if you want to debug them open the `test/index.html`
your browser.
* You need to add your _DOM_ tests to the `test/dom/index.js`.
......@@ -156,7 +157,7 @@ Depending on the settings you select, the slush bootstraper might add more tasks
You can see [here](https://github.com/biojs/slush-biojs) the entire list.
2) Our input data
2) Our input data
------------------
First we will have a look at the data. The whole file is a set of ~500K SNPs (Simple Nucleotide Polymorphisms) from [@manuelcorpas][manuelcorpas]). These SNPs come from a saliva sample genotyped using the SNP chip version 2 from [23andMe](https://www.23andme.com/), a personal genomics provider.
......@@ -174,12 +175,12 @@ rsid chromosome pos genotype
~~~
Genotype is the field that tells us exactly what the sequence looks like at a particular position. It is important to note that Genotype usually has two letters, because, as you may remember from high school biology, humans have two pairs of each chromosome. Well, mostly, unless you are a male, in which case you only have a lonely X copy with a tiny Y chromosome.
Genotype is the field that tells us exactly what the sequence looks like at a particular position. It is important to note that Genotype usually has two letters, because, as you may remember from high school biology, humans have two pairs of each chromosome. Well, mostly, unless you are a male, in which case you only have a lonely X copy with a tiny Y chromosome.
There are 3 types of genotypes that we will look at in this example.
1. If the same letter is present in both copies, then we say that we have a homozygous SNP; e.g.: AA, TT, GG, CC.
2. If the letters are different, then we have a heterozygous SNP: AT, GC, etc.
2. If the letters are different, then we have a heterozygous SNP: AT, GC, etc.
3. The position might have been delete in both or either chromosome: --, A-, -G, etc.
These three fields in each feature line are required:
......@@ -266,18 +267,18 @@ It is really ok if you see errors here - you will fix them later ;-)
{% hlblock info %}
In this tutorial we use [Mocha](https://visionmedia.github.io/mocha/) as JavaScript test framework.
However you can use your favorite - you only need to change the `test` command in the `scripts` section of your `package.json`.
However you can use your favorite - you only need to change the `test` command in the `scripts` section of your `package.json`.
{% endhlblock %}
5) Start coding
----------------
It is time to code!
To begin please open now the `lib` folder and access the `index.js` file.
It is time to code!
To begin please open now the `lib` folder and access the `index.js` file.
{% hlblock info %}
You can find the code for this exercise on [github](https://github.com/biojs/biojs-tutorial-template-snp).
You can find the code for this exercise on [github](https://github.com/biojs/biojs-tutorial-template-snp).
{% endhlblock %}
First have a look at the provided code.
......@@ -286,7 +287,7 @@ First have a look at the provided code.
var snipspector = {};
snipspector.parse = function() {
var data = ["rs5747620 20 15412698 TT",
"rs9605903 20 15434720 CC",
"rs2236639 20 15452483 GC",
......@@ -303,16 +304,16 @@ snipspector.parse = function() {
// hetero(zygous): AC
// del(etion): A-, -A or --
for (var i = 0; i < data.length; i++) {
// Please fill in your code here!
// Please fill in your code here!
}
console.log(chromosomes);
console.log(chromosomes);
return chromosomes;