Create Repositories with GitHub API and HTML5

Create repo with GitHub API

Create GitHub Repo with Folder Upload

GitHub has a ton of awesome repositories and it hosts most of the top libraries, frameworks, and plugins. People sometimes ask me to put code on GitHub and today I wanted to look into optimizing that process. It’s not hard to create a git repo, pull it, authenticate, and commit from the command line but it would be great to just have it all work with just a folder upload. If you are working on a project, it probably lives in a folder on your hard drive, so lets create a page where you can upload folders and it automatically creates a repository using the GitHub API.

First, I will pick up from my last post on the Gist API and explain how you can create and add files to GitHub repos with Ajax. Then, I will create an online page that supports repo creation with client-side folder input and API calls with Ajax.
Read more

NodeJS on Google App Engine

Nodejs on Google App Engine

Are you looking for free hosting for your node projects? You could try DigitalOcean but GAE Managed VMs are now in Beta (you can use them without whitelisting) so I wanted to dedicate a quick post on running Node on Google App Engine. It could be a free and easy way to host your node.JS app. Since we are not coding in Java, Python, or Go Lang, we need to setup a custom runtime environment on a Virtual Machine. So, below I will go over installing Managed VMs with Google Cloud SDK and Docker to build and deploy a sample app, written in Node and Express, to Google App Engine.
Read more

Automate SlideShare Creation with JavaScript and APIs

programmatic automation

I am a big fan of SlideShare and automation so today I want to show how you can programatically create a slideshow with JavaScript and upload it to your account with the SlideShare API. I am going to use jsPDF to generate a PDF file from images and text. When the pdf is created, I will use the upload_slideshow API call to upload the pdf into awesome slides on SlideShare. And the slides will be the actual steps to do this. Let’s start.
Read more

Unminify HTML, CSS, and JS Code with JavaScript

Beautify and Unminify Code

Online Tool to Unminify HTML, CSS, and JS

There are a few reasons to minify code, the major one being web performance. Browsers don’t need whitespace and comments to process your files. But, it’s not fun to work obfuscated code and I find myself often using jsbeautifier to uncompress source code. Today, I decided to implement this tool myself show how you can unminify and reformat HTML, CSS, and JS code with a JavaScript function. Since js-beautify is open source and supports JavaScript, this was an easy task.
Read more

Save File with Ajax and PHP

Today, I am going to go over a simple example of saving content from a web page to your server. Imagine a textarea with a save button, which grabs the text from the user input and sends it to your server. There PHP grabs the data and writes it into a unique file. Our php script will respond to the Ajax request with the file name in a link so that the end user can retrieve it directly through another web request.
Read more

Client-Side JavaScript to Node.js

JS to Node

JavaScript is mostly used on the client-side and in the browser, enabling all kinds of dynamic interactions on the page. When Brendan Eich created the language for Netscape in 1995, there were already server side implementations but node.js made it really popular. Node is a cross-platform runtime environment that is event driven and non-blocking and uses the Google V8 JavaScript engine to execute code. So, if you already know JS, you can now code on the server. There are a ton of use cases that this enables but today I want to focus on a simple concept of moving your client-side JavaScript code to Node.JS so that you can hide or protect your JS functions from being visible to end users.
Read more

HTML5 Photo Browser for Local Files and Directories

Photo Viewer and HTML5 Slideshow

Online Image Browser for Local Files

I was browsing old photo albums yesterday and it made me want to build an image viewer with HTML5. I want it to work with directories that have many files and this raises a question on browser performance. A gallery of pictures can easily consist of hundreds if not thousands of images. Loading all of them at once would probably crash the page or make it terribly slow and unresponsive. The DOM is not built to support so many elements with good speed. Plus, loading everything is wasteful as the screen size can only show a limited amount of images at one time.
Read more

GitHub Gist API with cURL and Ajax

Github API with Curl and XHR

I had seen the GitHub API before but never considered that it extends out to Gists, which I use for code samples on this site. In fact, I use a Gist on the bottom for the Ajax code samples that programmatically interact with GitHub using their API to create and modify Gists. First, I will just use command line cURL and then XHR, or more specifically, jQuery Ajax functions. Since Github supports both JSONP and CORS, you can use client side code to interact with the GitHub API.
Read more

Playing Cards API with Go Lang and JSON

Deck of Cards API with GO Lang

This is a continuation from the previous post on setting up Google App Engine with Go and Martini.

Last week, I showed how you can quickly create and launch a project with Google App Engine and Go. I integrated Martini on GAE and today, I will finish the tutorial by actually designing an API to properly respond to requests with JSON. I will also enable CORS and create some functions in GO that will shuffle an array of objects, split the array according to a user provided number, and reorder the array of objects for multiple keys. If we translate that to playing cards, the API will handle shuffling a deck, dealing out the cards to the amount of players provided, and ordering them by suit and numbers. Any remainder of cards based on provided players will go into the kitty. JSON is a popular content type so I will use that and follow the RESTful style of API design.
Read more

API on Google App Engine with Martini and Go

GAE with Martini and Go

Google App Engine is a great platform for quickly developing and hosting web applications. There are alternatives but today we are going to dig into GAE and show how simple it is to get started. I have previously made a few posts on Go and Martini so today we are going to setup Martini on Google App Engine for the Go Language in order to launch an API in the cloud. Martini is a great framework for building a RESTful API and the workflow below will take you through all the steps, from downloading GoogleAppEngine to deploying our Martini API app:
Read more