How to develop a site for the web
published 2016-03-25 | tags: #development
Table of Contents
This post does not deal with the basics of HTML, CSS, or Javascript, but rather a simple and often overlooked part of the web-dev toolchain.
If you would like help with the basics of HTML, CSS, and Javascript I suggest Codecademy.
Web Development, especially the front-endy stuff, is a great way to understand how computers think and can be a wonderful foray into computer programming. Anybody that's made a website probably remembers their first time:
- Open up a text editor.
- Type something like the following in:
<h1>Hello world!</h1>
<p>This is so cool!</h1>
Save As index.html.- Right click and open the file in your browser.
- Marvel at what you've created and hack away at it all night long.
And there you go! You've got a website made and ready to roll. It's not on a server, and you can't tell your friends to go to it from their computer --but those are just technicalities. You can still celebrate doing a thing like a boss.
Unfortunately, when you test your website by viewing local files you're missing out on a lot of advantages and quirks that you get when you host a website on a real server using something like Apache or Nginx.
For instance, when you run check your website by clicking through
file///home/username/project/files.html all of your hyperlinks that
should point to http://mywebsite.ext/somepage/ will take you to
file:////somepage when they should take you to
file:///home/username/projects/myawesomesite/somepage/index.html.
Run A Development Server (it's easy!)
The Short Answer
Use Python!
$ python2 -m SimpleHTTPServer
Serving HTTP on 0.0.0.0 port 8000 ...
The Longer Answer
You can run your own local webserver to serve files locally. This gets you all of the developmental advantages of running a webserver without having to rent or run a server in the cloud. The best part is that it's very easy to run a development web server.
Here's how:
- Install Python
- Navigate to
your-awesome-websitedirectory/folder. - Run
python -m SimpleHTTPServerif you installedpython2or runpython -m http.serverif you installedpython3.
These instructions assume you are doing things in a Unix environment (OSX or Linux) thought the commandline. If you are using Windows you should check out this stack overflow post for Windows-specific help.
Then in your web browser go to the address http://localhost:8000 and
bam! Your Website.
