JavaScript Design Patterns

Advanced

Approx. 6 weeks

Assumes 6hrs/wk (work at your own pace)

Join thousands of students Course Summary

This course covers methods for organizing your code, both conceptually and literally. You’ll learn the importance of separating concerns when writing JavaScript, gaining hands-on experience along the way. Separating concerns can be done with or without an organizational library or framework. We’ll learn how to separate concerns without one, and then we’ll explore an organizational library together. You’ll also learn strategies for exploring other libraries and frameworks on your own.

By the end of this course, you’ll understand (from experience) the importance of code organization, and how to implement it with either vanilla JavaScript or an organizational library or framework. Your applications will start looking clean and professional—not just to your users, but also to anyone who looks at the code driving your applications.

Why Take This Course?

Many developers dive right into projects without thinking of the organization or structure of the code they’re writing. It's easy to hack projects together, but the best developers spend the extra time to think about the organization of their application and adhere to sound organizational practices.

In order to write clean code that will get you your next job or promotion, you'll need to have a solid understanding of organizational techniques, and you'll need to implement those techniques in your projects. Software developers who write clean and organized code are surprisingly hard to find, so if you can master code organization you’ll be a step above the rest.

Prerequisites and Requirements

This course is for intermediate web developers with some experience with JavaScript, and some prior experience with a JavaScript library, such as jQuery.

Students should also be proficient in HTML and CSS, and should have experience creating static pages.

See the Technology Requirements for using Udacity.

What Will I Learn? Projects Project: Neighborhood Map You will develop a single-page application featuring a map of your neighborhood or a neighborhood you would like to visit. You will then add additional functionality to this application, including: map markers to identify popular locations or places you’d like to visit, a search function to easily discover these locations, and a listview to support simple browsing of all locations. You will then research and implement third-party APIs that provide additional information about each of these locations (such as StreetView images, Wikipedia articles, Yelp reviews, etc). Syllabus Lesson 1: Changing Expectations

We'll first start by building a project the way you already know how: without an overarching organizational paradigm. Specifically, we'll discuss pain points and difficulties that are easy to run into when you don't use an organizational model. Then, we'll discuss a paradigm that will help us in the future, and we’ll see some examples of that paradigm in action.

Lesson 2: Refactoring

We'll spend some time discussing how our new paradigm applies to the project we worked on in Lesson 1. Then we'll rebuild the project with the new organizational paradigm.

Lesson 3: Using an Organizational Library

We'll explore how to use KnockoutJS, an organizational library, to organize our code and to reduce the amount of boilerplate code we write. Our resulting application will be well-organized, easy to understand, and extendable.

Lesson 4: Exploring Unfamiliar Code

In this final lesson, we'll spend some time talking about how to explore code that you didn't write, possibly even using a library or framework that you aren't familiar with. Exploration is one of the most important skills for a developer to foster. and this lesson will get you started on that journey.