Trying out the code

There are several approaches to downloading the code. The following is focused on downloading from the alpha branch:

Alternative # 0: Build and run the demo

This is the quickest & easiest, but is not typical of application development, meant really for working on Hypergrid itself with the intention of contributing back to the open source project. The gulp file will create the Hypergrid build file (a bundled version of just Hypergrid core), and then separately build and run the demo (which currently uses the build file).

# clone the repo and checkout master branch
git clone https://github.com/fin-hypergrid/core.git hypergrid
cd hypergrid

# If you are interested in the alpha branch:
git checkout alpha # you can also use a tag like 3.1.0-alpha to checkout a specific alpha version

# install dependencies
npm install

# bundle Hypergrid itself; bundle the demo app; serve the app
gulp

Alternative # 1: install the npm module

This is the recommended approach for serious development:

# create an app
mkdir app
cd app
npm init # accept all the defaults for the interactive questions
echo "var Hypergrid = require('fin-hypergrid');" > index.js
echo "var grid = new Hypergrid({ data: [{ a:5, b:7 },{ a:10, b:20 }] });" >> index.js
echo '<body><script src="build.js"></script></body>' > index.html

# Do one of the following:
npm install --save fin-hypergrid # latest version published to npmjs.org
npm install --save 'github:fin-hypergrid/core#alpha' # unpublished alpha branch

# install dependencies (both Hypergrid's and your app's, if any)
npm install

# Bundle your app together with Hypergrid and all dependencies
npm install -g browserify # only do this step once
browserify index.js -do build.js # -d ("debug") includes source map in output

# run the app in the browser
open index.html # caveat: open only works on the mac

(Of course, you wouldn't use echo; you would use an IDE. And you'd probably use a build script or gulp, grunt, or webpack rather than using browserify on the command line.)

Alternative # 2: Clone the repo from GitHub

This example shows cloning the repo but not creating a build file (or the demo) but rather bundling Hypergrid together with your app. Alternative # 1 does pretty much the same thing and is simpler. As noted above (Alternative # 0), cloning the repo is not recommended unless you intend to be woking on Hypergrid itself. This is a needlessly complicated alternative compared to # 1.

# clone the repo and checkout master branch
git clone https://github.com/fin-hypergrid/core.git hypergrid
cd hypergrid

# If you are interested in the alpha branch:
git checkout alpha # you can also use a tag like 3.3.0-alpha to checkout specific version

# create an app
mkdir ../app
cd ../app
npm init # accept all the defaults for the interactive questions
npm install 'file:../fin-hypergrid'
cat package.json # see how npm install created dependency
echo "var Hypergrid = require('fin-hypergrid');" > index.js
echo "var grid = new Hypergrid({ data: [{ a:5, b:7 },{ a:10, b:20 }] });" >> index.js
echo '<body><script src="build.js"></script></body>' > index.html

# Bundle your app together with Hypergrid and all dependencies
npm install -g browserify # only do this step once
browserify index.js -do build.js # -d ("debug") includes source map in output

# run the app in the browser
open index.html # caveat: open only works on the mac

Alternative # 3: Use the build file from the CDN

Simplest application creation, but not for serious development.

From the command line:

# create an app
mkdir app
cd app
echo '<body><script src="fin-hypergrid.js"></script>' > index.html
echo '<script src="build.js"></script></body>' >> index.html

From the browser, Save https://fin-hypergrid.github.io/core/2.1.4/build/fin-hypergrid.js to app folder
For the v3 alpha, substitute 3.3.0-alpha for 2.1.4.
From the browser, Open index.html

Alternative # 4: Fork the repo

Not recommended for application development. Only fork the repo if you intend to contribute code.

Provide feedback

Saved searches