Lifelong Learning

A Website Coding Starter Kit

For most people, the Internet is a necessity when it comes to locating or sharing information. It is not surprising that there are over a million websites in existence today. Platforms such as Google Sites make it easy to create a webpage of your own from a template and sites such as Wordpress.com allow you to customize using widgets. However, there is something very satisfying in creating a website from scratch and knowing that it will turn out exactly the way that you want. It also allows you to register a unique domain name that does not include the Google or Wordpress domain in your web address. By following a few easy steps and making use of free resources and software, anyone can learn to create a website of their own.

Step 1. Choose which programming languages to learn

For basic webpages with static content, one only needs HTML (Hypertext Markup Language) and CSS (Cascading Style Sheets.) This will allow you to structure the site and format it with colors, fonts, and graphics. Websites containing dynamic (interactive) content will require a scripting language such as JavaScript or jQuery. The language Python is gaining popularity for its effectiveness and simplicity. Choose this language if you are also interested in application development.

Step 2. Get the right software

An internet browser

In order to test your code, you will need at least one internet browser. It is more advantageous to test it in multiple internet browsers, as the website might look slightly different in each one. Options are Internet Explorer, Mozilla Firefox, Google Chrome, Opera, or Safari.

A text editor

One can write code with nothing more than a simple text editor. Most operating systems come with a standard editor such as Notepad on PCs or TextEditor on Macs. All you need to do to start coding to enter the code into the program and save it with the correct file extension such as ".html", ".css" or ".js." If you prefer to use something more advanced you can download a free text editor such as Notepad++ for Windows machines or TextWrangler for Macs. These programs have an interface specifically designed for coding and allow you to easily run your code in an internet browser. If you do not want to add any additional programs to your machine, consider an online sandbox program such as JS Fiddle, Pastebin, or Codepen. These websites are free to use and only require an email address to create an account. You view your HTML, CSS, and JavaScript code side by side and see an instant preview of how your site will look. You also have the option to save and share your programs with other users.

An FTP (File Transfer Program)

If you are creating content for a personal website with a registered domain, you must transfer your files full of code from your own computer to a web server in order for it to be viewed by the public. Filezilla and Cyberduck are file transfer programs that can be downloaded for free.

Step 3. Take advantage of free resources

W3C

The World Wide Web Consortium (W3C) is an international community that develops open standards for the web. The site contains information on various languages. It also includes the HTML Validator, which can check uploaded files for errors.

Project <code>

A free 10-week course in computer programming offered by the New York Public Library.

Codeacademy

A series of self-paced online tutorials in a variety of programming languages. All you need to sign up is an email address.

Lynda.com

Another great set of interactive lessons and tutorials, accessible for free to all New York Public Library members.

The New York Public Library offers many materials to help you further your study. Check out Lauren Lampasone's blog post on computer programming resources or browse NYPL's catalog for books and other materials. Happy coding!

Comments

Patron-generated content represents the views and interpretations of the patron, not necessarily those of The New York Public Library. For more information see NYPL's Website Terms and Conditions.

Two additional useful resources

Heroku -- Cloud web server with free options. I started using this tool myself and it is excellent. Heroku is a server for static and dynamic webpages. It comes with simple, intuitive to use command line tool for setting up your pages. Also it has clear documentation on how to use it. Here is the link: https://www.heroku.com/ Stackoverflow -- This is a programming essential. It is an amazing resource with a huge wealth of knowledge. If you are stuck or debugging, google it and look for stackoverflow posts. I've found that google searching has worked more efficiently than the stackoverflow search tool. CAUTION: Do your research, try to solve your problem and only post questions when you are absolutely stuck and have done quality research. When you post, explain what you are trying to do, what you have done, and what is not working. Great post!

A Great Resource Directory

coursacado.gregorywickham.com has links to lots of useful resource to learn the necessary programming languages for web development.

I'm really glad you wrote up

I'm really glad you wrote up this post - I wasn't aware that NYPL allows access to lynda.com. That's amazing - lynda.com is a really good resource. I'm not sure if this exists already, but it would be helpful to have a categorized list (e.g., "technology") of all the resources that NYPL gives access to. I wonder what other resources NYPL gives us access to that I don't know of. NYPL is awesome - keep doing what you're doing!