/oop-practice

A place to practice object-oriented programming in JavaScript.

Primary LanguageJavaScriptMIT LicenseMIT

OOP Practice

A place to practice object-oriented programming (OOP) in JavaScript.

This is the base repository for the Init 2: OOP Practice with Bike Shop goal.

Getting Started

  1. Open a command line shell such as the Terminal app
  2. Fork & clone this repository
    Fork this repository on GitHub (help) and then clone your fork locally (help)
  3. Install Node.js and npm
    Follow the instructions in this Treehouse blog to install Node.js and npm using Homebrew on your Mac.
  4. Do your work in the subdirectories (bike-shop/, jsinfo/, music-player/)
    Be sure to read the README.md files in the subdiretories as well.

Resources

This goal makes use of the great exercises in http://javascript.info/ and http://exercism.io/. https://github.com/allyface/oop-practice

https://github.com/breyana/oop-practice

https://github.com/erikasf/oop-practice

Init 2: OOP Practice with Bike Shop

Introduction

Welcome to the second in the series of the initiation goals!

You know the ropes by now, but here's a quick refesher of what this goal contains and how to use it:

  • Review Challenge Rating to determine if this goal is appropriately challenging given your current skill level.
  • Read the Description to learn what the output of this goal will be.
  • Look to the Context for useful background information on why this goal is useful.
  • Use the Specifications to know what is needed to complete the goal.
  • Explore the Resources such as articles, tutorials, and tools.

Challenge Rating

This goal will likely be within your ZPD if you...

  • Can use fundamental programming contructs: variables, conditionals, loops, data types, functions
  • Can write basic JavaScript and execute it in a browser environment
  • Have completed the [first initiation goal][bossggle-word-game] (or something similar)
  • Have used git and GitHub to do basic tasks like forking, cloning, making commits, and pushing to a remote repository
  • Are interested in growing your JavaScript skills
  • Are interested in learning to write well-structured code using the principles of object-oriented programming

Description

Object-oriented programming (OOP) is a way of writing and organizing code. It has been around for a long time (by software standards) and is a useful and proven way to design readable, reasonable software.

In this goal, you'll work with your team on a series of JavaScript exercises in the oop-practice repo that focus on core OOP concepts, patterns, and principles.

This goal makes extensive use of the tutorials and exercises on JavaScript.info, especially those in the Objects, classes, inheritance section. It is highly recommended that you make use of this resource, even beyond what is explicitly stated in the specs.

If this is your first time working with Node.js, you will have to install it. You may also want to take some time to go through the Node.js and npm courses on Treehouse (see links in Resources > Courses).

Recommended Pace

It is recommended (but not required) that you follow along with the day-by-day pace included here. These are designed to help you break down the problem into more manageable parts so that you can pace your work appropriately.

Each day, pay attention to the terms & concepts highlighed in bold. By the end of the day, you should have a better idea of what they mean and how to use them. In other words, aim to be able to answer the question "what is X?" for yourself.

If you work thorugh a full day and have time left over:

  • Solidify your learning with the resources provided or
  • Start on the next day with your team or
  • Attempt the stretch specs

Day 1

Fork the oop-practice repo into your own GitHub account. Each team member should write code in their own fork, but you should work together and share ideas and solutions as you go.

With your team, complete the specs in Stage 1 to practice working with objects and learn about key/value pairs, object literals, and nested objects.

Day 2

Complete the specs in Stage 2 to practice working with constructor functions and the "new" keyword, and to learn about object properties, instances and instantiation, and the "this" keyword.

To make sure that you are getting enough challenge, spend the morning working solo on the JavaScript.info exercises and then use the afternoon to work in team on the bike-shop.

Day 3

Complete the specs in Stage 3 to practice working with methods and the class pattern, and to learn about prototypal inheritance, getter/setter methods, and the "proto" property.

Depending on how much support you and your team need, balance solo and team time. Make sure to always review the day's work with your team and share important learnings.

Day 4

Complete the specs in Stage 4 to practice working with classes and classical inheritance, and to learn about the "class", "extends" and "super" keywords in JavaScript.

Depending on how much support you and your team need, balance solo and team time. Make sure to always review the day's work with your team and share important learnings.

Day 5

With your team, complete the specs in Stage 5 to challenge and practice everything that you've learned so far.

Context

The series of initiation goals are designed for new members of Learners Guild to get oriented to the learning environment, build key foundational skills, and work on some fun projects.

  1. [Init 1: Bossggle Word Game][bossggle-word-game]
  2. [Init 2: OOP Practice with Bike Shop][bike-shop-oop]
  3. [Init 3: Hello Web Servers][hello-web-servers]
  4. [Init 4: Relational Databases][relational-databases]
  5. [Init 5: Web APIs][web-apis]
  6. [Init 6: Developer Tools][developer-tools]

By the time you are finished with these initiation goals, you should be skilled enough to complete the [Simple Book Store][simple-book-store] goal: it is a good target for you to aim for in your first 6 weeks.

This is the second goal. It is designed to introduce you to objects and object-oriented programming in JavaScript (...and also to the Node.js programming environment, indirectly).

By the time you're done with this goal, you will have:

  • Modeled a bike shop using object-oriented JavaScript
  • Worked through 10+ exercises to challenge your OOP knowledge
  • Applied your newfound knowledge to design an object model for a music player app

Specifications

These are the basic specs for OOP Practice, broken into 5 stages. If you complete these specs, try taking on some of the Stretch specs.

Stage 1

To get started, each team member needs to fork the oop-practice repo. Then, create a gist and add links to each fork to a file in the gist. This is your artifact.

Stage 2

Stage 3

Stage 4

Stage 5

Design a basic object model for a music player like Spotify or iTunes.

  • [x ] Song class is defined in music-player/song.js.
    • [ x] Has properties and methods that you would expect a "song" object to have, at minimum: .title, .length, .album, .artist, .track_no, .play(), .pause().
  • [x ] Album class is defined in music-player/album.js.
    • [ x] Has properties and methods that you would expect an "album" object to have, at minimum: .title, .songCount, .artist.
  • [ x] Artist class is defined in music-player/artist.js.
    • [x ] Has properties and methods that you would expect an "artist" object to have, at minimum: .name, .bandMembers, .genre.
  • [ x] Playlist class is defined in music-player/playlist.js.
    • [ x] Has properties and methods that you would expect a "playlist" object to have, at minimum: .name, .songs, .addSong(<Song>), .removeSong(<Song>), .play(), .pause().

Stretch

If you complete all of the specs listed above (the checkboxes), there's no reason to stop there! Keep practicing with these stretch specs.

With these specs, you'll be building an object-oriented version of the [Bossggle word game][bossggle-word-game].

  • Bossggle game is copied into the artifact repo under a bossggle subdirectory
  • All JavaScript in Bossggle is rewritten to use an object-oriented style (for example, there is a Game class and a Word class, with instace methods like Game#reset() and Word#isValid())
  • Bossggle game is still functional accordign to the core specs

Resources

Use these resources to fill in the gaps in your skills and knowledge as you find them. There is more here than you can do in a week, so focus on the areas that are in your zone of proximal development (ZPD).

Guides
Courses
Tutorials
Exercises
Videos
Books

[simple-book-store]: {{ site.url }}{% link _goals/69-Simple_Book_Store.md %}

[bossggle-word-game]: {{ site.url }}{% link _goals/251-Init_1-Bossggle_Word_Game.md %} [bike-shop-oop]: {{ site.url }}{% link _goals/252-Init_2-OOP_Practice_with_Bike_Shop.md %} [hello-web-servers]: {{ site.url }}{% link _goals/253-Init_3-Hello_Web_Servers.md %} [relational-databases]: {{ site.url }}{% link _goals/254-Init_4-Relational_Databases.md %} [web-apis]: {{ site.url }}{% link _goals/255-Init_5-Web_APIs.md %} [developer-tools]: {{ site.url }}{% link _goals/256-Init_6-Developer_Tools.md %}