A couple of weeks ago, Ajax.org released a new IDE for Javascripters known as Cloud9. It’s an open source project built on Node.js. In case you don’t know, Node.js is an implementation of Server Side JavaScript (SSJS) and is now actively being used for SSJS development. Since Cloud9 IDE is built on top of Node.js, it has an integrated debugger for Node.JS applications. In this article we’ll be taking a look at various features of Cloud9 such as those mentioned above, but for now let’s begin with installation.
Installation
Installation is very simple provided you’re familiar with the terminal. There are three ways to install Cloud9:
1. If you’ve Git installed on your system then you can get the code repository directly from Github. Just enter the following command in your terminal:
git clone git://github.com/ajaxorg/cloud9.git
After Git checkout, enter the following command to install all the submodules and run the IDE:
bin/cloud9.sh
The editor will open in your default browser after all the submodules have been installed.
You can also install Cloud9 via NPM
npm install cloud9
or by downloading the source code from Github.
Review
Cloud9′s UI is similar to Eclipse IDE, so Eclipse…
CodeMirror is an on the fly syntax highlighting engine, written in Javascript. Like CodePress (the syntax highlighter used in the latest version of wordpress for editing plugins), it can highlight many different languages (PHP, JS, HTML, CSS to name a few). This tutorial will show you how to implement CodeMirror on your site, there is a great article written by the author of this library here on how it works under the hood.
Installation
Download the latest version from the CodeMirror website. As of today, it is version 0.62. After you unzip it you will see 3 directories – js, css and contrib. contrib holds parsers that other people have written such as the lua, python and PHP. css holds the color schemes for syntax highlighting and js contains the necessary scripts for CodeMirror to run.
Basic Usage
If we have a textarea with an id of code that we wanted to turn into a CodeMirror editor with a MirrorFrame(more on this later) then we would use the code below. Note that we need to specify where the parserfiles and stylesheets for the particular type of syntax (in this case javascript) are located.
var textarea = document.getElementById('code');
…
Heres Part 2 of the jQuery AJAX login tutorial. If you haven’t already, i suggest you read part 1 located here.
We are going to start writing the PHP code to process the form. This is fairly basic stuff, using $_POST to get the values from the form, then checking them against pre-assigned values, if they match, then echo approved, if they don’t then echo denied.
So at the end of this stage, you will have an HTML form set up and this PHP file. You can enter the username Panzer and the password of query7 into the form and it will return Logged in.
Next tutorial, the fun part, the AJAX!
Hey guys, just thought i’d post a little interim post (as such). Im in the process of making a 4 part tutorial series on using jQuery’s AJAX. Its a “case study” where i/we will make a basic login form with a PHP backend and then use jQuery to make the login seemless. Eg. you put your username/password in the form and click the login button the page doesn’t reload but it will tell you whether its the correct user/pass , in which case a cookie is set, or if its bad info.
It might take a little while to finish up so i might not be posting much over the next week (sorry) but it will be worth it in the end.
Subscribe to feeds
