1. Mac running the latest version of xcode – This can be found on your install disc for leopard or snow leopard.

2. Latest version of the iphone SDK – This can be found at developer.apple.com

Now we can get started. Once you have xcode and the iphone SDK installed, open up xcode(Macintosh HD > developer > Applications). Once you have xcode installed, from the menu bar select file > new project. You should see a windows like the this one.

Select window based application from the iphone application option on the left hand side of the window. Once you select the window based application, xcode will prompt you to save the project. I named my project “LabelTester” and saved it under my personal iphone projects directory. Once you save the project, an xcode window should open up and look something like this.

You should see a combination of files here in the browser in the code browser. The first should be the CoreGraphics.framework. This is just a set of files provided by Apple that have all the code relevant to the core graphics libraries in Cocoa. The second is the foundation.framework. This is the library set for the foundation framework which is basically all the classes like NSArray, NSString and other foundation objects. The next item should be LabelTester.plist. The plist, or preference list, is a set of XML attributes that control how the application is handled. For the sake of this tutorial, you won’t need to open the plist. The next item should be the LabelTester.app file, which is the executable for your application. Once your application is deployed, all files and resources in your project will be located inside your app’s .app file. The next file is the LabelTester.pch file. This file is the prefix header for your application. The LabelTesterAppDelegate.h file is the next file in the list. This file is the header file for your application delegate. This is the starting for your application, the app delegate is what’s run by your main.m file when you app is launched. The .h file is of course the header file, which is basically the interface file that the .m file will implement. The next file is of course the LabelTesterAppDelegate.m. This file is the implementation file for the app delegate header. Next is the main.m file. This file is the application launcher for your app. It basically runs the app delegate. The next file is the Main Window.xib file. Anything with a nib/xib file extension is classified as an interface builder file and you open these files in the Interface builder application. Finally, the UIKit.framework. This library is used to correspond to all the UI elements on the iphone(text fields, buttons, etc).

Let’s start by opening up our Main Window.xib to setup our interface. Start by dragging a button from the libraries window onto your main View. Rename that button by double clicking on the button and change it to say “Update Label!”. Next, grab a text field and drag it just above the button. Expand the text field to fit the majority of the screen. Select the textfield and go into the attributes tab and enter into the placeholder field, “Enter Text to update Label”. Once that’s finished, drag a label onto the main window and change the text from “label” to “Label to Update”. Once that’s done you can save the interface builder file by pressing (command + s) and switch your view back to your xcode project.

Open up the LabelTesterAppDelegate.h file and change the file to reflect the following code.

#import 
 
@interface LabelTesterAppDelegate : NSObject
{
    UIWindow *window;
	IBOutlet UITextField *textField;
	IBOutlet UIButton *button;
	IBOutlet UILabel *label;
	IBAction *updateButtonPressed;
}
 
@property (nonatomic, retain) IBOutlet UIWindow *window;
@property (nonatomic, retain) IBOutlet UITextField *textField;
@property (nonatomic, retain) IBOutlet UILabel *label;
 
-(IBAction)updateButtonpressed:(id) sender;
 
@end

The first lines inside the curly braces will declare variables that we will be hooking up in Interface builder later. After the curly braces are closed, we have these property tags. These will allow us to have access to the objects and their data in the implementation file. After that we have an IBAction method declaration. This will eventually be hooked up to our button to run every time that our button is pressed. You can think of an IBAction method as an event handler in OBjective-C. Now let’s move onto our LabelTesterAppDelegate.m file and add the following method directly below out import statement.

#import "LabelTesterAppDelegate.h"
 
@implementation LabelTesterAppDelegate
 
@synthesize window;
@synthesize textField;
@synthesize label;
 
-(IBAction)updateButtonpressed:(id) sender
{
	//allocate a string and initialize it with the data from the text field
	NSString *string = textField.text;
 
	label.text = string;
}

Basically what we’re doing here is just creating that IBAction method that we declared in our interface file. Inside that method, we allocate a string to the value of our textField.text and then set the label equal to the string that we get from the textfield. That’s all the code we’ll need for now. Don’t forget to synthesize your objects below the implementation declaration in order to have access to the data you want. If you try and run this now, the application will run but will not function because the pointers in Interface Builder are not hooked up. So let’s go ahead and do that next. Save all your xcode files and open back up your Main Window.xib file in Interface Builder.

In order to setup a pointer in Interface builder, start by clicking on the application delegate and then the connections manager should appear. Beside each of the items that you created you should see a tiny circle. For each, click on the circle and drag the pointer to each of the elements in your window. This will create a pointer to that element. Now click on the button and then open it’s connection manager. Find the “touch up inside” connection and drag that pointer to the “file’s owner” section in the library and select “updateButtonPressed” when it appears. Once this is completed, you should see the connection screen look something like this.

That’s all folks, now if you run the application and enter some text into the text field, it will update the label to whatever text you entered. To download the whole project click here.

Cheers everyone and stay tuned for part 2!

Books

Using the books feature in coda can be an extremely useful resource. Whether it be to just check an API function in PHP quickly or grab the code to move a box across the screen with JQuery it’s all easily accessible in one location. If you are using the trial version of coda then this screen may not be available to you, however once you purchase the full version then you should be able to add, edit, and delete books. Coda books aren’t necessarily just ebooks either, they can be just snapshots of the API’s of languages as well. To add a book click the plus button at the bottom left and fill in the book title and the book url. The rest of the options are optional, however if you want to be able to search through a book while editing code in the editor then you will need a search url as well. By holding down the command key and double clicking a word in the editor, you can search a specific book based on what type of file you’re currently editing in. You may notice a * in the search URL of the books you add. This is used so that when you search for a word it replaces the star with the word you want to search in the book for. Here are some examples of books you may use.

Book Title: JQuery

Book URL: http://docs.jquery.com/

Use for Mode: Javascript

Search URL: http://docs.jquery.com/Special:Search?ns0=1&search=*&go=Go

Book Title: MySql

Book URL: http://dev.mysql.com/doc/

Use for Mode: SQL

Search URL: http://search.mysql.com/search?q=*&ie=&lr=lang_en

Book Title: PHP

Book URL: http://php.net

Use for Mode: PHP – HTML

Search URL: http://us2.php.net/manual-lookup.php?pattern=*&lang=en

Clips

Coda clips are used to quickly add snippets of code to documents. You can make as many categories and snippets as you like for as many language as you like. To add a clip just go to document under the edit tab and select the clips button from the bottom bar. A darkened window should appear like the one above. To add a category just click the plus sign on the left, and to add a clip within that category just click the plus sign on the right. To edit a coda clip just hover over any clip and click the information(i) button on the right side of the clip. A great resource for web development clips in a variety of languages and platforms is the Coda Clips site.

Sharing

Using a collaboration engine called the Sub-Etha engine, coda can allow users to collaborate with multiple people on the same document at exactly the same time. It’s real time collaboration over a network. So for example, you need help working on some PHP code you’re working on. All you have to do is click the share button on the bottom left of the editor and you can proceed to invite people to view your document. Or, if you feel so willing, you can open it up on a bonjour stream and have multiple people access the file. From there you can see real-time edits from multiple different people on the same document. This can come in handy especially in large offices, instead of wasting time going from office to office to ask questions about a piece of code. Or if you so feel you could also take advantage of a modified eXtreme programming methodology and have multiple people code up the same document from multiple computers.

Summary

Basically, coda can by itself be an extremely useful tool especially for web developers. Using the extra features such as book, clips and sharing coda can help you increase your workflow and productivity in no time. The ability to collaborate with others on the same document in real time is a huge plus especially for fast paced businesses. If you’re using coda, don’t hesitate to take advantage of the features it has to help you work faster!

Enjoy!

Cheers

1. The first step is to install Wordpress, if this isn’t done then go ahead and install Wordpress now(a tutorial will be coming on how to do this a bit later ).
2. With coda, create a new site… To do this click on the site’s icon in the menu bar and click “Add Site”).

Click on the site's icon then the add site button

3. Once you have done that and filled out all the information that coda requires to set up your site within the site’s area, you should now see a preview of your site within the site’s area of coda.
4. Double click on your site and it should connect to the web server and display your web server’s file system. It should look something like the picture below(may not be exact depending on your web server’s specifications).

5. Once you can view your site then you should see the root folder /www/ in your server’s root directory. This is where you will be installing Wordpress. Drag the Wordpress folder you downloaded into the /www/ folder. With coda you can directly drag the folder over from your desktop. Once that’s finished you should see a folder in the root of your directory called “Wordpress” or whatever the name of your Wordpress folder was.
6. Rename the Wordpress folder to “blog” or whatever you want the Wordpress CMS to be a part of.

7. Once you have it renamed you should see a bunch of php/css files inside your now renamed Wordpress folder.
8. Wordpress should now be installed for your site. You can access it by going to http://www.your-url.com/blog/. And if you want to make changed as the administrator then access the admin panel by going to your-url/blog/wp-admin/.

That’s it, you can now take advantage of the power of the Wordpress CMS. In a later tutorial i’ll explain how to install and use the JQuery framework within your Wordpress theme.

Cheers

Cheers

Students adaptability is the key to their survival, when they get out of school. I heard a statistic once, that said 80% of the students graduating will not be coding in the same language(s) that they took in school. If students have the ability to specialize, even with a few courses, it could lead to more prepared graduates.

Things like game design and graphics could have the ability to be taught as early on as second year. If students are given the choice to take these types of courses, then the interest would spark an increased learning potential for the students, as opposed to sticking them in classes that are “required”. This of course is from a students point of view, but I think employers would see the significance in this method of action as well.

Cheers

In my opinion concentrating on both design aspects and technical programming concepts will lead to a greater IT work force. How in industry today can you expect perfection in programs from students who are not taught that in school? When they come out then it is left to the employers to teach design, and good technical programming concepts and let’s be honest, they just do not have the time or the resources to do that. So in fact good design principles and practices need to be forced at the school level to ensure a better IT work force when students get into industry and are ready to jump right in!

On a side note, as a proposal, what is there was time set aside during school, for credits, for project work on your own? Google is a great example of this allowing a single day a week for their employees to work on projects of their own or even to go and help the community. And again, they write some of the best code in the world. This is something that could be potentially adopted at the school level to promote creativity and a passion for coding!

Cheers