SheetKit: JavaScript framework to quickly build MVPs.

Colin Mathews • Creator

You’ve got an idea.

Well…you always have ideas. Ideas are not the problem.

It’s tempting to build everything all at once, I know. But how do you know you’ll get traction? How do you know you’re investing in the RIGHT idea? The simple answer is, you don’t. You never know. The internet is a fickle place that rewards ingenuity one moment and absurdity the next.

The answer–and I’m not talking to space engineers or heart-monitoring app developers out there–is to build as you go. Turn the crystal of your idea into something usable and build up your product while you seek traction and feedback. It’s fast-paced. It’s hard. It’s a little scary.

But it’s also insanely powerful and you’ll know at the earliest possible moment if you’re chasing a ghost. I did it with Lukewarm Emailer and I’m doing it again here.

That’s why I built SheetKit. You’ll get up and running crazy fast. You won’t need a server or a database. You'll work with your data in Google Sheets, so making adjustments, running reports, or exporting your data will be dirt simple.

Try SheetKit. With any luck, your idea will take off and you’ll outgrow our product!

PS. Need help building something? I can help.

Show Me Code

Getting set up

Place this script on your page and enter your API key.

<script data-sheetkit-key="[YOUR API KEY]" 
	src="//d209ue3xilo57p.cloudfront.net/1.0.0/sheetkit.js"></script>

Wrap your code in a call to SheetKit.ready.

SheetKit.ready(function(err){
	if (err)
		return alert("Something's not quite right.");

	// SheetKit is ready!
});

Adding rows

Create a reference to your database and add one or many items. All operations are asynchronous and take two parameters: an object of options and a callback function. An optional third scope parameter can be passed so that this refers to an object of your choice.

Each callback function take two arguments: an error object if something went wrong and a result.

SheetKit.DB.add({
	sheet : 'Movies',
	data : {
		Title : 'What About Bob?',
		Year : 1991
	}
}, function(err, row){

	// Say hi to your newly created row!
	console.log(row.data.id);
});

Getting and searching

Grab a single row by it's ID.

var myRowID = '...';
SheetKit.DB.getRow({
	sheet : 'Movies',
	id : myRowID
}, function(err, row){

	// See if the row was found
	if (row)
		console.log(row.data.id);
});

Search many rows with flexible queries, similar to MongoDB.

SheetKit.DB.find({
	sheet : 'Movies',
	query : {
		Year : {
			$gt : 1990
		}
	}
}, function(err, rows){

	// Log the rows we find
	for (var i = 0; i < rows.length; i++)
	{
		console.log(rows[i].data.id);
	}
});

Updating rows

It's easy for any row to update one or more of its fields.

row.update({
	data : {
		Director : 'Frank Oz'
	}
}, function(err, row){

	// Your row's updated contents are returned
});

Removing rows

Remove a row by its ID. By default removes are not allowed, but you can enable them in your security settings.

row.remove({}, function(err){
	// If no error, your row was removed
});

Processing credit cards

With a Stripe account, your SheetKit can easily and securely process credit card transactions.

// Create a charge
SheetKit.Pay.chargeCard({
	total : 24,
	description : 'Widget #1',
	testMode : true,
	card : {
		number : '4242424242424242',
		code : '123',
		expMonth : '12',
		expYear : '2018'
	}
}, function(err, result){

	// Result represents a successful transaction
});

Sending HTTP requests Coming soon

SheetKit.Remote lets you interact with HTTP services. You'll control headers, expected response formats, and with some SheetKit configuration, you can enable custom authentication that protects secret values.

// Submit a request
SheetKit.Remote.send({
	url : '...',
	method : 'POST',
	data : {
		param1 : 'value'
	},
	getHeaders : true,
	format : 'json'
}, function(err, result){
	
	// Result might look like:
	{
		headers : {
			header1 : 'value'
		},
		response : {
			// JSON from the service
		}
	}
});

View Full Documenation

Live Examples

Live Example #1

This example loads movies from a spreadsheet and lets people vote on their favorite.

See Google's published view of this spreadsheet.

What's the best movie?

Source Full source on jsfiddle

JavaScript

// Load SheetKit
SheetKit.ready(function(err){

	// Get all movies
	SheetKit.DB.find({
		sheet : 'Movies'
	}, function(err, rows){
		if (err)
			return alert(err.message);

		// Display the movies
		var el = document.getElementById('movies-list');
		el.innerHTML = createHtmlForMovies(rows);
	});

	// Listen when the user presses a vote button
	listenForVotePresses(function(rowID, btn){

		// Stop further voting
		disableVoting();

		// Increment votes
		SheetKit.DB.updateOne({
			sheet : 'Movies',
			id : rowID,
			data : {
				$inc : {
					Votes : 1
				}
			}
		}, function(err, row){
			if (err)
				return alert(err.message);

			// Update the button with the new vote count
			btn.innerHTML = row.data.Votes + ' Vote(s)';
			alert("Thanks!");
		});
	};
});

// View the full source: http://jsfiddle.net/colinmathews/mrdx7Lda/

Live Example #2

This example lets people save a greeting to the world and shows the most recent greetings.

See Google's published view of this spreadsheet.

Recent Greetings

Source Full source on jsfiddle

JavaScript

// Load SheetKit
SheetKit.ready(function(err){

	// Get all greetings
	SheetKit.DB.find({
		sheet : 'Hello World'
	}, function(err, rows){
		if (err)
			return alert(err.message);
        
        // Put new messages on top
        sortRows(rows);

		// Display the content
		var el = document.getElementById('greetings-list');
		el.innerHTML = createHtmlForGreetings(rows);
	});

	// Save a new greeting
    submitGreeting = (formEl){

		// Add a greeting
		SheetKit.DB.add({
			sheet : 'Hello World',
            data : formEl
		}, function(err, row){
			if (err)
				return alert(err.message);
            
            // Add our row to the UI at the top of the list
            var html = createHtmlForGreetings([row]);
            var el = document.getElementById('greetings-list');
            el.innerHTML = html + el.innerHTML;
            
            // Reset the form
            formEl.reset();
		});
	};
    
    // Deletes a greeting
    deleteGreeting = (btn, id){

		// Removes a greeting
		SheetKit.DB.removeOne({
			sheet : 'Hello World',
            id : id
		}, function(err){
			if (err)
				return alert(err.message);
            
            // Remove the ancestor 
            var elCont = btn.parentNode;
            elCont.parentNode.removeChild(elCont);
		});
    };
});

// View the full source: http://jsfiddle.net/colinmathews/up9e1rah/

View Full Documenation

No servers needed

Get running without the headaches and costs of a database or web server. SheetKit works with any website including S3-hosted sites or even as a file in your Dropbox's^® "Public" folder.

WYSIWYG administration

There's no need to build an admin panel or write database queries to monitor your website's data. Everything is instantly viewable in your Google^® spreadsheet which can support up to 2 million cells and 200 sheets.

Database power

Each worksheet in your spreadsheet represents a collection of data that you can easily add to, update, remove, and search. Security features help prevent abuse.

Process credit cards

With a Stripe account, SheetKit allows you to securely process credit cards and store customers and order information in your spreadsheet. Take one-time purchases, donations, or monthly subscriptions.

HTTP requests

Interact with cloud APIs directly from client-side JavaScript. The SheetKit.Remote namespace lets you send and react to HTTP requests.

SheetKit is growing and we're always taking input to provide you with everything you need to get your site up and running.

Get your MVP out there as
quickly as possible. Test ideas, build functional demos.

Announcify

Announcify

Coming
Soon.

Colin Mathews • Creator

You’ve got an idea.

Show Me Code

Getting set up

Adding rows

Getting and searching

Updating rows

Removing rows

Processing credit cards

Sending HTTP requests Coming soon

Live Examples

Live Example #1

Source Full source on jsfiddle

Live Example #2

Say Hello!

Source Full source on jsfiddle

No servers needed

WYSIWYG administration

Database power

Process credit cards

HTTP requests

More

Get your MVP out there as quickly as possible. Test ideas, build functional demos.

Announcify

Announcify

Coming Soon.

Colin Mathews • Creator

You’ve got an idea.

Show Me Code

Getting set up

Adding rows

Getting and searching

Updating rows

Removing rows

Processing credit cards

Sending HTTP requests Coming soon

Live Examples

Live Example #1

Source Full source on jsfiddle

Live Example #2

Say Hello!

Source Full source on jsfiddle

No servers needed

WYSIWYG administration

Database power

Process credit cards

HTTP requests

More

Get your MVP out there as
quickly as possible. Test ideas, build functional demos.

Coming
Soon.