Tutorial: Web Development on Mac OS X

Posts: 1,142
Joined: 2002.04
Post: #1
As most of you know, Mac OS X comes with Apache and many other open-source projects to allow you to serve and publish websites. If however, some of this technology is over your head, or you're looking for a simple "click-and-play" solution to jump RIGHT into web development, then read on.

Some time ago, I came across a rather brilliant idea for an application; it combined a web server (Apache), database (MySQL), server side-scripting (PHP), along with the popular web app for working with MySQL, PhpMyAdmin (PMA). However, it was a Windows application.

A few months ago, I came across a similar application for Mac OS X called "MAMP". (Macintosh, Apache, Mysql and PHP.) You can download it for free at:

MAMP puts everything you need in an easy to double-click application. This is great if you need to work on a web project for only a short time -- simply drag the app to your trash to delete (Apache, MySQL & PMA).

The Assignment
iDevGames.com runs a popular open-source Content Management System (CMS) called Mambo (http://www.mamboserver.com). This tutorial will cover the use of MAMP to run a local copy of Mambo CMS. If you are like me, you might already have your own website/server, so why this approach? Let me list a few:

* Developing locally means you won't need to utilize space and bandwidth on your website/server.
* If you are developing, and your scripts are in their early stages, there should be less of a security risk (over running your scripts on a remote machine)
* No need to mess with Apache config files, compiling MySQL, or other chores -- this is plug & play at its best.
* Loading your scripts and database locally is much faster than off a remote machine.

In the case of iDevGames.com, my objective is to put the power of MAMP and Mambo in the hands of more community members. By doing so, I hope to accomplish the following:
* Give a local "playground" for members to learn the ins and outs of our CMS, without fear that the main site will go down.
* Give the members with PHP, and MySQL knowledge a place to develop Mambo components and modules which iDevGames can utilize.

The steps in the installation section below were written by community member "FunkBoy" as I led him step-by-step through the entire process. Although we focus on Mambo, you should be able to adopt the procedure for other CMS, like Xaraya (http://www.xaraya.com), or another PHP-based script.

Seven steps to web development heaven
As Carlos mentioned, iDevGames uses the Mambo publishing system to publish all its content. Having Mambo running on my local system would be extremely handy as I extend my knowledge from Mac development to web development. I'm looking forward to getting a database dump (all the content) of iDevGames from the main site and installing it on my local MAMP for testing and learning purposes.

Step 1: Visit http://www.mamp.info
Download MAMP, which packages Apache, PHP, MySQL, and other web server goodies into an application; no configuration required! Once your download is complete, install MAMBP and then double-click the application. A browser window will open along with MAMP's application window. You now have a web server; you quit the app, and the server stops. This is for local web site development, not for serving to the outside world.

Take a second and look in the MAMP folder (located in the Applications folder.) You should have the following files and folders:
MAMP logs Licence.rtf conf bin tmp htdocs

If you have a remote server, then the above should look familiar to you. I should mention that your HTML and PHP files should be stored in the directory "htdocs". (Editor's Note: The Config folder contains the normal config files for the Apache and MySQL servers.)

Step 2: Create a new database with PHPMyAdmin.
PhpMyAadmin (http://www.phpmyadmin.net/home_page/) is an extremely popular web application for working with the MySQL database. It allows you to browse your data, sport, delete, and enter SQL commands. To launch PhpMyadmin, go to MAMP's main window, and click "Open Start Page." Once the page has loaded, click "phpMyAdmin." You should now be looking at PhpMyAdmin's interface screen. Please refer to the manual at PhpMyAdmin'S website for learning more about managing your MySQL database.

When installing Mambo, or other popular web apps, the first step is often the creation of a database for the script to utilize. In PhpMyAdmin's browser window, look for the "Create new database" text field. Type in whatever name you'd like: "mambo", for instance. Press Return and your new database will not appear on the left side. Simple, huh? Don't worry about creating tables since the Mambo installation will take of all of that for you.

I should mentioned that you won't need to create a database user for this tutorial -- MAMP has already done this for you and it is called "root." If your web application asks for the the DB name and DB user name, you would use "mambo/root" respectively. (Editor's Note: When working on remote databases, it is best not to run as root user, so be sure you are using a lower-access database user.)

Step 3: Visit http://www.mamboserver.com

Download the latest "Stable Release" of Mambo, and when the download completes uncompress the folder. Find your MAMP folder ( /Applications/MAMP/ by default ), then create a new folder inside the "htdocs" folder. Name the new folder "mambotest" or something similar. (Editor's Note: You can call this folder anything, for example: website, cms, typo3, xaraya, etc.)

Now, copy all the contents inside the unzipped Mambo folder into your new "mambotest" folder inside "htdocs."

Step 4: Testing

Mambo's PHP scripts are now in the server's htdocs folder and your database was created. It is now time to proceed to the installation of Mambo CMS.

Open a browser window and go to the following address:

Note that we used /"mambotest", the location of our Mambo installation. If you'd like Mambo to be installed at the "root" level of your server, be sure to skip over the instructions above that ask you to create a folder (mambotest).

This is the first time for you to run Mambo, so it will automatically launch its installation script. Since we won't allow outside connections to our local Mambo installation, I won't cover setting the file permissions. However, on the first screen, it will check that the "file permissions" on various files and folders are set correctly. Please consult Mambo CMS's documentation page for the correct permission settings, and CHMOD as per the directions. Problems with file permissions will be indicated by red text, and green text if the setting is correct (writable). Once you check all the settings, press "Next" to proceed to the second step. This page loads the GPL License, and if you agree to it, click "Next."

Step 5: Mambo Settings
On this next page, you can enter "localhost" (without the quotes, of course) for Host Name. The MySQL User Name and Password is the default provided by MAMP which I mentioned previously.
User Name: root
Password: root

MySQL Database Name is should be set to the name you gave in Step 2 -- I suggested "mambo." MySQL Table Prefix is just a way for you to differentiate the tables created by Mambo from other tables; you can change it from mos_ to mambo_ only if you care to. No change is necessary here.

Step 6: Name your site
Give your Site a name: "My Awesome Test Site," or something appropriately goofy is always pleasing.

Step 7: The last step!
The URL is probably what's there, though you should probably change localhost to localhost:8888 since that's the default for MAMP. Otherwise it might not work. You can enter your email address if you'd like. Most importantly, you should write down your admin password! The directions for Mambo recommend that you remove the install directory (inside your Mambo installation).

Step 8: Logging in as Admin
Let's confirm everything is fine by viewing our test site:
http://localhost:8888/mambotest or http://localhost:8888/nameofthefolder (which you made inside htdocs)
Mambo contains some sample data so you can play with your new CMS.

To start administrating your site, go to:
(replace mambotest with whatever directory you made in htdocs)

The default username here is admin, and the password was given to you at the end of Step 7. I hope you wrote it down. After you enter your information, you will be presented with Mambo's administration GUI. Here, you can make sections, categories, content such as news, add weblinks, and so on.

Expanding Mambo
Mambo has an active developer community creating components and modules to extend the function-ability of the core features. If you'll like to see what is available, visit http://mamboforge.net/. An popular Mambo fan site is also located at: http://www.mamboportal.com/. In addition, both the official site and Mambo Portal feature very busy forums to help you with any aspect of Mambo, such as downloading and installing the many available templates to give your site a new look.

Funkboy, and I hope this tutorial will give you the confidence to try MAMP, and jump into the many wonderful open-source projects which can be easily run on your Mac.

Carlos A. Camacho,
Quote this message in a reply
Posts: 153
Joined: 2004.12
Post: #2
Great tutorial!

Im going to use this for my next web project for sure.

There was a long silence...
'I claim them all,' said the Savage at last.
Quote this message in a reply
Posts: 387
Joined: 2002.08
Post: #3
Thanks, hope you can get into some Mambo development with it, too.

Please let me know if there are any incorrect steps, wrong information, or vague instructions in the tutorial. You can either message me, AIM me, or post in here.

KB Productions, Car Care for iPhone/iPod Touch
All too often, art is simply the loss of practicality.
Quote this message in a reply
Posts: 277
Joined: 2004.10
Post: #4
I hope I get done in time for udev.

Then I'll use this for my networking trackers. Wow

Global warming is caused by hobos and mooses
Quote this message in a reply
Posts: 1,142
Joined: 2002.04
Post: #5
By the way, I have this tutorial mirrored at iDevApps. News of the tutorial was posted on a popular Mambo site, http://www.mamboportal.com/, and also listed on http://www.macsurfer.com/. Smile

FunkBoy, I think we should explore the ability to outside users to connect to the 8888 port for viewing of the local MAMP contents. That would be neat.


Carlos A. Camacho,
Quote this message in a reply
Post Reply