Setting up your environment

This series is designed for absolute beginners wanting to take their first steps into web development.  By building a site from scratch you will learn the basic skills needed to build websites from scratch using HTML, CSS, JavaScript, PHP and MySQL.

First we need to set up a working environment.  There are a few programs you will need before we can delve into some code.  Below are listed my personal preferences, however for the sake of impartiality I have listed a number of other options for some of the programs if for no other reason than to demonstrate that web development is far from a one-dimensional industry and that for each problem there are often a variety of solutions.

Text Editor

The text editor is the primary tool used during web development.  As such there are many choices that purport to give various benefits.  I’ll only focus on a few here, but be sure that there are many more options than those listed here.

My Recommendation – Sublime Text

Sublime Text

This is my text editor of choice for a number of reasons:

  • It’s lightning quick
  • It looks good
  • It’s easily customisable with the Package Control Plugin
  • The Bird’s Eye View panel for each file

The main gripe that people seem to have is that there is no support for Code Intelligence, however this doesn’t particularly bother me.

Notepad ++

Notepad++

Notepad++ is similar to Sublime Text in it’s approach and similarly offers a range of plugins to customise the experience, however it doesn’t look as nice and still lacks the code intelligence features like Sublime Text.

NetBeans

Netbeans

NetBeans is an Integrated development environment (or IDE).  This means that it offers a number of tools that are designed to speed development.  The flip side of this is that it can feel a touch unwieldy at times in terms of speed.  It does offer many useful features and is worth a look

Server

To begin developing a website you also need a server in one form or another.  Initially it is worth using free software that can be installed local to your computer, but to publish anything to the internet you will need hosting and a domain name.

My Recommendation – WAMP Server

Wamp stands for Windows Apache MySQL PHP, and is a piece of software that will emulate an Apache server on your Windows PC.  It is a great place to start as the set up is really easy and it will enable you to quickly get something up and running.

The main downside is when considering pushing a website onto a live server.  It is commonly best practice to make your development and live environments identical so that you obfuscate any issues that arise from differences in set up.  This is not possible with Wamp as live Apache servers run on Linux rather than Windows.

This is not enough of a downside not to use it to get started however, and is firmly my recommendation to begin with.

VMWare Player with Ubuntu

A more involved solution that enables you to accurately replicate a live environment locally for development purposes is running a virtual machine.  This is great as it can be set up identically to your live server and is a good training ground for learning to use the command line.  It is more memory intensive and I’d recommend having a computer with at least 8GB of RAM to go down this route.

My recommendation if you want to pursue this route is to use VMWare Player and install Ubuntu onto it.  There are many tutorials that will guide you through this process so, as will no doubt become clear, the internet is your friend (search for it!).

A Real Server – Linode

If you are committed to learning web development or ready get a live server then (beware money required ahead!) my recommendation for hosting is Linode.  Put simply, they give you complete access to your server and it is easily scalable if you suddenly get loads of traffic.  It allows unlimited domains, emails and all the other stuff that hosting companies brag about.

It’s not the cheapest on the market, but then the cheapest stuff is rarely the best anyway.  You can pay monthly which is nice for the non-committal amongst us.

The major downside is that you only get command line access to your server.  I will write a tutorial soon giving a run-down of how to use the command line, but it is not for the faint of heart.

Other Tools

There are a few other tools that are helpful for development and I’ve listed these below.  Beware that some of these tools require set up that may not be beginner friendly, so you may want to return to this page once you’ve worked through these tutorials and have a grasp of what I’m talking about below.

SSH Client – Putty

To access a server remotely (for example one you might set up at Linode), you will require an SSH Client.  Putty seems to be the standard as it’s quick and generally gets out of the way to let you get on with what you’re doing.

Database Manager – SQLYog / Navicat / HeidiSQL

These tools allow you to access a database and run queries in a user-friendly environment.  There is little to choose between the options listed above so I’d encourage you to try them all out and see which one takes your fancy.

File Transfer – WinSCP

This program allows you to transfer files to and from your server using an SSH connection.  It’s quick and slick and easy to set up as long as you have SSH access to your server (you will have this if you are using Linode).

If you don’t have this luxury I’d recommend FileZilla as one of the best FTP file transfer programs about.

Conclusion

Hopefully you’ve got a work environment set up and you’re happy with your choices of programs.  The beauty of web development is that it’s always changing, so I try to keep a look out for new tools and better programs to do the tasks listed above.  If you’ve got any suggestions of tools you’ve found/use then feel free to post them below.

Just another WordPress site