Thursday, June 20, 2013

Set up the best web development environment - Netbeans + Apache + PHP + MySQL + jQuery and lots more!


Well, PHP, MySQL, jQuery - the three most essential tools we need to create the next gen websites or develop interactive content in the world of HTML5.
jQuery will run client side, but PHP and MySQL require server side programming. Hence we need to set up a similar environment on PC, and also we need something to code our thoughts and ideas using our knowledge. Netbeans is one of the best IDE(Integrated Development Environment) that can let you do this with much ease, and basically its free. Everything that you will need to complete this tutorial will be free.

Step 1: Set up a server

There are various apps that let you create an Apache+PHP+MySQL environment of your Windows PC. My favorites are:
Software Download Link Extra notes
Zend Server Click here More secure, High level server administration, might not have the latest version of PHP, MySQL and other modules
EasyPHP Click here Less Secure, Easy administration and installation of modules. Fast updates to PHP and MySQL << Recommended 
WampServer Click here Less secure,option to convert to web server, might not have the latest version of technologies(Apache, PHP, MySQL)

Well, just install these apps like you install any other Windows Software and your server will be up and running in no time.
This was easy, wasn't it?
Now comes the coding part..

Step 2: Install Netbeans

Why Netbeans?
Well, its fully featured, easy to use and has support for lots of languages and is FREE! You will also need JDK(Java SE) latest version. Here is the link.

Step 3: To create projects using NetBeans

Well, creating projects is easy. Now what you need is a simple selection to make when you are kick starting your development. In the New Project Wizard, choose PHP>PHP Application.

If you are creating a PHP project for the first time, Netbeans will take few seconds to activate the PHP Module.
 When you are in this screen when going through the New Project wizard, make sure you check the box copy files to a folder option as mentioned below. 
Now, select the path according to the location of your public www folder(also called document root). If you have downloaded any of the above softwares that I have mentioned, here is a guide to those folders:
ZendServer - <path to Zend Server installation directory>\Apache2.2\htdocs
EasyPHP - <path to EasyPHP installation directory>\data\localweb
WampServer - <path to WampServer installation directory>\www

Thats it! You are done!

Additional Notes:

  1. I prefer EasyPHP as they have latest technologies, so less or no bugs will be encountered when developing.
  2. Do set up root password for your MySQL databases. This makes your server quite secure, in case you decide to make the same server live.
  3. Copy the jQuery script into the folder where you can use it properly. For less amount of code, I prefer to save the .js file into the same directory as the main web page is.
  4. It is always better to choose a proper web host, rather than hosting the scripts yourself. Sure this is a DIY package for creating a web server, but its not secure enough.
  5. WAMPServer comes with phpMyAdmin by default, to access it use localhost\phpmyadmin. For ZendServer and EasyPHP you will have to install the modules.For tutorial on Zend Server, visit this link and for EasyPHP, just activate the phpMyAdmin module in the server administration GUI.
Now that you have set up a complete web Development server, how about kickstarting to learn web development? Check out one of the best books I recommend for beginners to start learning web development by clicking here!

2 comments:

  1. After examine a number of of the blog posts on your web site now, and I really like your manner of blogging. I bookmarked it to my bookmark web site record and can be checking again soon. Pls try my website online as well and let me know what you think.
    Free File sharing site : dozens of them

    ReplyDelete
  2. It is very helpful infomation for students to get the Web development.Thanks for sharing this useful information.This is nice information posting for fresher student.This is the great information. I will really join it..

    ReplyDelete