A friend recently asked for a list of front-end web development resources. Instead of emailing him a list, I figured I’d write a blog post so others could possibly benefit from it.
A Note on the Term Web Development
The term “web development” is an umbrella term that is often used to describe a wide range of technologies that go into the design and development of a web site.
Wikipedia defines web development as,
Web development is a broad term for the work involved in developing a web site for the Internet or an intranet. Web development can range from developing the simplest static single page of plain text to the most complex web-based internet applications, electronic businesses, and social network services.
An analogy: “I am a web developer” can be compared to saying “I work for Walmart”.
When you first hear “I work for Walmart”, you probably think of a cashier or greeter. However, with a corporation as large as Walmart, there are thousands of different positions. Do you work at a corporate office? If so, are you in the HR department, finance department, customer relations department, sales department, or in Walmart’s IT department? Are you swimming at the C-level or are you an intern?
Just as the phrase “I work at Walmart” is very broad, so isn't, “I'm a web developer”. Oftentimes you will see web development broken into two categories: front-end and back-end. Front-end development is the group of technologies that are shipped to the user's browser, e.g. HTML, CSS, JavaScript. Back-end development is the group of technologies that are on the servers, such as a server side language (PHP, Python, .NET), a database (MySQL, MongoDB, Oracle), a web server (Apache, Nginx) and a number of other technologies. Depending on how granular you'd like to get, which often depends on the scale of the website, there can be literally hundreds of different technologies involved in serving up a webpage. Just think of how many technologies Google or Amazon use for their sites. They may use a set of technologies for one website, while using a completely different set of technologies for another site.
For the purposes of this post, front-end will encompass HTML, CSS and JavaScript.
1 Tutorials
- Codecademy
- The Odin Project
- Learn CSS Layout
- Shay Howe's Learn to Code
- appendTo
- Code School - Angular
- Code School - Try jQuery
2 All Encompassing Sites
3 Courses
- Saylor - HTML & CSS
- Udacity - Front End Dev
- Udacity - Intro to HTML and CSS
- Udacity - JavaScript Basics
- Udacity - Web Development