Now that you have all the knowledge, it is time to see how to put it into action. Whether you want to build a blog, create an online catalog, or just show a static collection of pages, the chances are good that you can get everything done almost for free.
The key is in something called Open Source software. Generally speaking, Open Source software is software that has been placed into the hands of end users for free, subject to licensing restrictions. These licensing restrictions exist to protect the intellectual property of the original authors and not to restrict the use of the software.
This has two effects:
Setting up Web servers has become very cheap.
A lot of good server scripts have become available.
The result of these two effects combined is that Web hosting solutions are usually based on Open Source packages. When they are not (where proprietary, non–Open Source solutions are chosen such as Microsoft Windows), you can expect to pay a higher price—sometimes even to the point that a host will give you a Linux-based account for free but charge for a Windows equivalent.
This book has been created with Open Source solutions in mind:
The JavaScript (ECMAScript) specifications are Open Source
PHP (the language) is Open Source
MySQL is an Open Source database system
HTML, XML, and related standards are all Open Source
Luckily, it is not necessary to actually own or operate the hardware or software (except for the PHP scripts that might be needed) that the hosting solution is based on. This chapter assumes that you ’re going to build one of several kinds of sites, using generally available technology and services.
It is split into two sections. The first is designed to help you to establish what it is you actually need, and the second gives some basic configuration examples and clues as to how to get started.
Never forget that for each project you undertake, it is very likely that there has been a solution already created that you might easily adapt to your needs. This being the case, if it can be downloaded and adapted, you will save yourself a lot of hard work.
The first question to ask when getting started is to determine what you want to do, so that this can be translated into a checklist of things that are required to get up and running as fast as possible. Generally, building a Website is all about getting started—once the site is up and a flow of visitors is established, it becomes easier to justify bolting on new features along the way.
However, different kinds of sites have different needs and it can be costly to change Web hosts if you find that something that you later need was not planned for when you first chose your host. This means that the initial checklist has to allow for growth.
In other words, the aim is to plan for the future as far as is possible while staying in line with the emphasis of this book—doing just enough to satisfy your short-term goals.
If cost is an issue, consider free hosting or hosting that comes free with a domain name registration. This is not really the place to cover the ins and outs of free versus paid hosting, but with the advent of Open Source solutions, more providers are changing their models as the cost of technology comes down.
Free hosting is not always the bad experience that people might believe. For those just starting out, it can be a better solution than trying to host a site on your own hardware, as long as a paid upgrade is available.
One thing to think hard about is where the site will be hosted, because if you choose to install everything on your own hardware, there are additional points you have to consider. If you host the site yourself, you have to contend with all the vagaries of hosting support such as backup facilities, a permanent fast Internet connection, and so on.
Besides these aspects, there is the software side. You would need to install a piece of Web server software, a database, and PHP. For Windows servers, this means the .NET framework for Windows servers, plus the database and PHP. For Linux systems, this usually means a LAMP setup: Linux Apache MySQL PHP. Apache, in this case, is the Web server software.
The first step is to decide what your site has to do.
What the site has to do—the facilities it has to provide—will depend entirely on what the goal of the site is. This will, in turn, dictate how the content is served, which will have a bearing on the features that the site host must support.
Once you’ve decided whether the site is static, dynamic, open access, or a special features site containing membership areas or user-based sensitive information or services (like Facebook, for example), you can then start narrowing down the kind of features you’ll need.
One of the decision points revolves around how the information is presented and delivered. For example, the site could offer a service (paid or not) that results in the distribution of the information (a mailing list, an expert system, basic search, and so on) or it could just provide a hierarchical set of articles.
If you decide on a dynamic site, perhaps offering services or just generating content on demand, this opens up a separate set of decisions. This starts with the question as to whether you have to store and manipulate large amounts of data.
Given that this might be the case, you have to consider whether you’ll need a database to store the content instead of simple XML or text files. This, in turn, means that the database has to be designed and that, above all, the chosen Web host must support database access.
Even if the Website will (at first) only contain essentially static pages, you still might need, due to the complexity of the hierarchy, to have a CMS that manages the content. Depending on the kind of CMS you choose, this might require a database and will certainly be likely to require some PHP scripting.
On the other hand, you might ascertain that the pages can be entirely static, and rely on technologies such as AJAX to populate them from the outside. If your pages are created on your own hard drive and uploaded to the Website, they can be tested locally before a new version of the site is made live.
This might be more work in the beginning, but always remember that testing a site is necessary and that uploading while you’re still testing can disrupt a working Website. Hence, an HTML and JavaScript solution might be the best approach for the simplest mashup or blog-based sites.
(Clearly for a forum site, or one where collaboration between visitors is encouraged, this approach will not work quite so well.)
Once you’ve decided what your site needs to offer, you can begin with the next step—making a checklist of required features so that you can select a Web host.
Once you decide what your Website will do and determine what features you want to provide, you can create your own feature checklist, like this one:
PHP
FTP
MySQL
Fantastico
CMS
Password-protected areas
Email/WebMail
Integrated search
This is only a subset of what you might put together, and for each of the more complex items, such as the database, you should include some sizing information. For example, one blog, one forum, and one Web catalog typically mean you need three databases. Coincidentally, three databases are often the limit established by many Web hosts.
From here, it’s a simple matter of tabulating the hosts and what they offer before choosing one. For the most part, this will be easy, but there are a few sticking points, usually related to bandwidth and storage space.
Bandwidth is the amount of data that you are allowed to transfer, both up to the server and down from the server, in a given time period. Once you have exhausted the available bandwidth, the site can become inaccessible unless you purchased more.
For example, you should make sure that if your site is designed to be used in conjunction with popular services such as Facebook (as a Facebook application server for an application offered to Facebook users), the site will receive a lot of traffic. This translates into two consequences:
High bandwidth usage
High server processor usage
For this reason, some Web hosts have a “no Facebook” policy, so that their servers aren’t run ragged with a high volume of requests. Also the amount of data that can be stored on a Web host is important. If there are many pages or scripts creating dynamic pages, quite a lot of space might be used.
If you install an off-the-shelf CMS, you need to check that the available disk space is not eclipsed by the high requirements of the more complex systems. You’ll also be adding your own media, such as images and music, which might push the storage requirements a little higher.
You can’t neglect the database, because this will also add to the space that is being used to host the site. Admittedly, space is not such a big problem these days, unless you’re using the site as a movie host or something like that. These sites come with their own technical challenges, such as finding a host that allows streaming media—it adds to bandwidth in a serious way!
Finally, choosing the right kind of scripting interface is also quite important. The reason for this is that there are some features that might not be available on the Web host, such as some PHP libraries that the host might not allow their sites to use. One such feature is access to the sendmail program for sending email.
Over the years, the fear of being shut down because of one unscrupulous user sending spam through the sendmail program, coupled with a number of possible security flaws, has led to hosts starting to restrict the use of this program. They often offer an alternative, but sometimes they remove this functionality altogether.
However, some CMSs require registered users to confirm their registration by email (for security reasons), which will need use of a PHP facility to send email. It is not a big issue, but something to be aware of.
Once you’ve satisfied your feature list and chosen a Web host, it is time to move on to the next phase and install your site.
The first thing to do once the site has been set up is install the first version to make sure that everything works. Even if it is just a test page to check that the CMS is in place and that the database is connected, it is worth doing before you spend hours creating content and placing it in the database.
For a basic sites made just with HTML, this is an easy process. You simply need to FTP everything up or use the host’s built-in site upload tool, and then view the main page. This is not always as straightforward as you might think, because there are many possibilities for the all-important index page:
index.php
index.htm
index.html
So, if the first page does not come up as planned, you should check to see if the Web host has left your own index page lying around, which is then being served instead of the new one that you have just uploaded. It’s small things like this that force you to test installations regularly when you make changes.
Some hosts will even offer site builder tools, whereby you can put your own HTML in as well as accept their default layouts. Provided that they also allow JavaScript and the possibility to extend your site with your own files once your confidence grows, this is probably the best way to get started.
Otherwise, if the simple file upload mechanism does not give enough control over the resulting site, it is time to use a tool such as cPanel.
You’ve read about cPanel a few times now, as a way to help manage various aspects of a Website. In my experience, every cPanel I have used has looked different, but they have always had two things in common—a list of installed resources and measure of current usage on the left, and groups of programs in the middle designed to help manage the various aspects of the site.
A word of warning—if you do not understand the nature of a change that you are about to make in cPanel, don’t do it. Generally, the documentation is good enough that clicking the little yellow question mark and consulting the manual is sufficient to ascertain how to do something, but it doesn’t always elaborate on the why, because it assumes that the person using the tool knows what he or she is doing.
Usually, cPanel is accessed on port 2082, typically through an URL such as http://www.mysite.com:2082.
However, some ISPs might block this port, and so an alternative is sometimes offered at http://www.mysite.com/~cpanel.
If neither of these URLs works, you need to contact the Web host and ISP to resolve the issue. Without cPanel, it is impossible to set up databases or install packages. This might not be an issue if the site can be uploaded through FTP, but it is certainly an issue if the site has to host a database for a CMS.
Essentially, cPanel is basically an Open Source configuration package for Web hosts. Through it, you can manage the email settings, databases, and various other aspects. This includes the ability to access raw and treated statistics, consult logs that might give clues as to why a certain PHP script is failing, and provide an interface to manage files.
Directory permissions and password-protected areas can also be managed using the cPanel interface, although there are better methods of protecting areas of the site, such as using proper PHP session authentication.
The only things that you really need to use straight away are the email and database setup tools, as well as the file manager and perhaps Fantastico—the package manager. Once these are located, you are ready to get started.
The Web host that you have chosen, based on the feature checklist, will have installed all these tools already. So, you don’t need to worry about them; because these tools are Open Source, however, if you did want to download and install one of the script sets that make up an application, you can do so.
In addition, some Web hosts might use a different package manager than Fantastico, but it seems to be the most popular. Package managers all tend to work in roughly the same way, so you are bound to find parallels in the discussion here.
Fantastico is a cPanel application plug-in that is used to manage third-party Open Source packages that are used for a variety of different purposes. The list of packages that are supported grows all the time.
Figure 10.1 shows the Fantastico DeLuxe logo, and the usual software group that it can be found in. Note that different cPanel versions (this one is from cPanel 11) will place the Fantastico program in different areas.
In Figure 10.2, you can see the various options that are available for this specific Web host (x10Hosting.com).
You will see that the programs that can be installed are listed on the left side (the list is much longer than what’s shown here), with the currently installed packages in the middle. In this case, only WordPress is installed (with an upgrade available).
There is also a little note in red at the top of the page for warnings. In this case, I appear to have run out of available MySQL databases!
The scripts that Fantastico uses to install a specific piece of the Website are wizard-based, so you’re taken through the stages step by step. This includes setting up the initial administrator accesses, setting up databases (if any), and emailing a confirmation message at the end that contains all the settings.
It is a much better approach than downloading the PHP files, trying to set up the database by cutting and pasting (or uploading) SQL scripts that recreate the environment, and then finding that there are a hundred settings to make in the PHP scripts.
So, if the Website needs a CMS, it will probably be installed though Fantastico, which creates all the databases for you and picks the optimal settings for the startup package. Of course, once the system has been installed, you still have to go and customize it, but Fantastico saves a lot of time.
Because Fantastico and the packages that it installs are Open Source, it usually is available where a host allows PHP access and databases. Some common applications include the following:
WordPress
PHP-Nuke
phpBB
Drupal
Joomla
Finally, when the time comes to upgrade, you can do this through Fantastico. However, you need to be aware that any changes made to scripts will be lost, so you should back up your site first. The system is not yet clever enough to detect and integrate customizations beyond those supported through generally accessible means (CSS files, custom colors/logos, and so on).
Once you’ve determined what the components of the site should be, it comes to making sure that the look and feel is coherent and that the visitor has a clear path around the site.
It is possible that the site components will be quite diverse, so it’s worth having some kind of interface that connects everything. For example, a site that has a shopping area, blog, and forum might be built on three different application platforms, but this setup should be invisible to the visitors.
Consequently, you’ll need to create glue code to attach everything to the main page.
This will usually be part of the CMS, but there also needs to be a main index.php page that’s accessed from the outside world via the Website URL. Now, on most hosts and some CMS, the package is stored in a subfolder of the main site, and so the index.html page that is served from the default folder needs to redirect to the main page of the CMS (or blog, or catalog).
If you are following this discussion step by step, you’ll remember that you already read about the index.html page that was uploaded by FTP. This will sit in the root of the Website as http://www.yourURL.com/index.html.
However, when you install a CMS, it is usually placed in a subfolder called http://www.yoruURL.com/wordpress/index.php.
Subsequently, you need to make sure that the CMS index page (WordPress, in this case) is visible from the root index or that the root index.html page redirects automatically to the CMS index page. You do this with a simple redirect statement in the HEAD element of the HTML page:
<html>
<head>
<title>Your Title Here</title>
<meta http-equiv="refresh" content="0;
url=http://www.redirecthere.com">
</head>
<body>
<a href="http://redirect to this url">
Click here if not redirected. . .</a>
</body>
</html>The content of the refresh meta tag just tells the browser not to wait before redirecting to the new page. It is also a good idea to leave people with the option to click in case their browsers do not support the refresh meta tag.
Once you’ve set up and tested all the individual components, the gluing together begins. For example, if the WordPress blog package has been installed alongside the PHP-Nuke CMS, it makes sense to integrate the blog entries into PHP-Nuke, either at the database level or through a PHP script that can access the blog entries and display them.
You’ve so far looked at many ways to do this, from using AJAX to leveraging the WordPress API to retrieve the XML data and using it directly. In the end, only your imagination will limit how the mashups of different services can be performed to create your own unique online identity.
The following are some examples of very basic solutions, along with discussion about how to get started as soon as possible, using “Just Enough” principles. They are provided as a kind of cookbook of solutions to common questions and as a way to help you overcome feeling overwhelmed when you think about how to create your online service.
This is the easiest way to get going, and a good way to test the water and practice newfound skills. That is not to say that nothing useful can be built with static pages, just that you have to know what the limitations are.
The minimum that a static side will need is an index.html page, which can be created with a text editor. Once it is created, you can start to build up the content page by page. It is probably a good idea to try to use some JavaScript to create things like the site navigation menus; otherwise, whenever they need to change (when a page is added), the menus have to be updated in many places.
There are Open Source scripts available on the Internet to make this more manageable—they run as client side scripts and can be customized by the Web programmer.
However, because the site can have only static pages, there is no interaction with the server beyond the fact that the server serves the pages to the client. This means that there is no possibility to access a database or have server side scripting to perform tasks that deliver HTML.
The site requirements are modest, so it should be possible to find a free Web host that is ad-free and possibly buy a domain name to park on it. This will mean that your domain name points to the Web host so that it looks as if the site exists under that domain when it really exists under a subdomain of the free hosting provider.
This approach works well for blogs where the editing is done off-site, that is, where a local piece of software builds the site each time that content is updated and provides a set of HTML pages for the content creator to upload.
It is also valid for blogs that take their content from a blogging site (see Chapter 8, “Content Management Systems”) and can use AJAX to retrieve the blog. In fact, any site that makes use of externally hosted content that is delivered as XML can be based on a static page model.
Therefore, there is no need, if a blogging site is all you require, to waste time putting blog software on the Web host and paying for bells and whistles. The Web 2.0 mashup principle lets you set this up very easily with a few lines of JavaScript.
Going beyond the static site and offering a bulletin board (forum) means that the Web host will need to provide some server side functionality. At the very least, you’ll need a database and access to PHP in order to manage and store the content, house posts, and store user identification.
Assuming that you’ve chosen a host that supports cPanel, the process is easy. From the main cPanel account management page, select the Fantastico application. From there, you can choose from several different forum packages—phpBB is perhaps the most well known and also integrates well with CMS packages.
Once you select a forum package and begin the installation, the database will be created and you’ll be asked to provide the credentials for a forum owner (or moderator). This is the person with responsibility for the forum and all the conversations in it.
The initial setup will not include any real content, just some default boards. So, the next step is to set up user groups, boards, and possibly categories. The general membership structure should be worked out ahead of time so that this creation process is easier.
For example, sometimes you will need to limit what users can see by introducing rules in the structure of the forum. Although phpBB makes this easy, it is almost impossible without some kind of plan as to how the boards should be divided up.
In most cases, you’ll also need to alter the PHP code to change the look and feel or terminology of the forum by adding a theme. This follows the same kind of customization route as a CMS, but the PHP code that manages the forum should not be changed—only the pieces that manage the look and feel. They are easier to break than a standard CMS.
A step up from having static Web pages with a forum is to start working with a CMS that is integrated with the forum and static content. The biggest part of the move will be migrating the static content to the database of the CMS.
It is assumed that the static site has been built, and that the CMS is an upgrade. If you’re building the site on a CMS from scratch, you need to build an index page and then keep the CMS under development in a locked part of the site until it is up and running.
It is not possible to do local debugging in many cases because, unlike with normal Web pages, it is not possible to run the server side code on your computer. If you have access to a copy of Apache (a Web server software package) and a database, you can do some local debugging, but this is not likely the case for the vast majority of readers.
If you’re not planning to use an out-of-the-box CMS solution, all you need is a database and some PHP code to set up a simple single user content-delivery system. This should be relatively easy to upload and test. Some PHP scripts can also be tested locally by installing the PHP software; however, you must make sure that the version matches the one available on your Web host.
The final kind of site that you’ll look at is easy—it’s simply a collection of pages that contain images and details as well as a way to order products. All of these elements are available as off-the-shelf Open Source installable modules.
The behavior is actually just a subset of a CMS, so that is the model that is required. Picking an easily customizable CMS such as PHP-Nuke or Drupal will reduce the development time.
The Web programmer needs to create a module for displaying the pictures and the description, as well as for maintaining some session data. For example, the simplest way to do this is to use the authentication from an out-of-box CMS. This will require that visitors join the site before they can order, but this is the general model of most online shopping sites.
Next, the database has to be populated with the images and textual descriptions so that they can be reproduced in the pages of the CMS. There might be a module available for download that can plug in to the chosen CMS, so check the main support site to see if there is one available.
At the same time, you might also like to find a shopping cart that has already been implemented for the CMS in question. These shopping carts usually integrate well with the authentication system, thus tying it all together.
Finding pre-built modules will save time in long run, because all you need to do is glue them together using your PHP skills, and a site can be up and running in hours. As soon as you need to start implementing your own modules, it can take weeks before you’re ready for production.
The final step is to add a forum. This will also be based on the CMS solution you’ve chosen, as it needs to integrate. This forum will be used for customer feedback, questions, problems, and so on. It is a far better mechanism than having a support email because it allows other customers to collaborate and help solve the problem, which fosters a sense of inclusion.
The icing on the cake is to deploy your XML skills to obtain a live feed of urgent questions so that you can stay in touch. All of this uses technology to solve problems and present solutions where, in the days before Web programming, the only tools a site owner had were an email address, some Web forms, and their time.
This chapter provides some basic guidelines on how to get up and running, but it essentially contains everything that you need to know before you choose your exact site building path. It has been mentioned many times in the book, but it also bears mentioning just one last time—mashing together existing solutions is easier than building them from scratch.
If you want to build a site that has a blog, but do not find a Web host that will let you install WordPress, the easiest option is to use AJAX in the Web page and connect to a Yahoo! Pipes, or Blogger blog feed.
In fact, even if your Web host will let you install WordPress, if you are adept at writing HTML, the AJAX option will probably give you far more flexibility. The reason for this is simple—it is easier to lay out a table with three columns, and put a menu on the left, content in the middle, and adverts on the right, than to use a real content-management system.
On the other hand, if you want to implement an online game of some kind, you will need to pull all your skills together—HTML, CSS, JavaScript, and PHP, probably coupled with SQL and XML to boot!
But here again, leveraging an Open Source CMS such as Drupal or PHP-Nuke to create the framework and authentication systems will save you hours of time when creating the final system. It’s all time you can spend on other, more worthwhile, activities.
The next chapter in the book (and the last one) provides a list of some of the best places to go when this book doesn’t have the detail that you need. It also lists some great Web resources that give every indication of being around forever. That’s a rare commodity in this online world, so they must be of high quality.
Hopefully, though, the book, along with this getting started chapter, has given you enough of a head start that you can begin to build your Website straight away without any additional information.