Advanced Front End logo

Advanced Front End

Syllabus

Course Description

Advanced Front End

Location

PCS Classroom,
735 SW 20th Place, Suite 230

NOTE: The building is LOCKED after 6:30pm. Please arrive in time for a 6pm class start. If you are unavoidably late, please tell us via the class Slack channel and text Al upon arrival.

Instructors:

Name Email Text only Slack
Alan Zimmerman azimmerman@portlandcodeschool.com 503-970-3645 @Auraelius
Kristin Valentine kvalentine@portlandcodeschool.com   @kristin

Contacting your instructors

Al:

Schedule 1-on-1 time @ https://azimmerman1.youcanbook.me/

He’ll respond on the class Slack channel within a couple hours. Please expect an email response at least within 24-48 hours. His cellphone is 503-970-3645, but it only works for text or voicemail. If you text him, please prefix your text with the word “PCS” and include your name or slack ID. Texts or voicemail will get a reply within 4 hours.

His PCS email is azimmerman@portlandcodeschool.com. Email to this address will get a reply within 24-48 hours.

Prerequisites

Students must have some experience in HTML, CSS, and JavaScript. Students can qualify by:

  • Completing the Web Foundations classes (Primer Basic and Primer Pro)
  • URLs of sites you’ve developed and deployed (or link to portfolio)
  • URLs of your web site repositories on github.com

Learning Objectives & Core Outcomes

  • Use
    • Sass to customize web sites
    • Client-side JavaScript to increase usability and reduce user errors
    • Forms to send data to servers
    • Chrome Dev Tools to debug preprocessed CSS
    • Task automation to preprocess and deploy
      • Set up a javascript-based tool chain for common tasks
      • Use package managers to manage web site configuration
      • preprocess Sass
      • generate live style guides
    • Selenium IDE for browser-based acceptance testing
      • Recording sessions
      • Identifying web page items to manipulate and test
      • Specifying correct values to test for

Schedule and Curriculum

For the most up to date schedule of activities, see the course curriculum.

Educational Expectations

To put it simply: There is more here than anybody can reasonably accomplish in the time we have. Choose your adventure, then do what you say, when you say.

You set the overall goals:

In the first week of class, schedule time to meet with the lead instructor to define your goals and set expectations for the class. You will be measured against your own expectations.

Independent of this, from time to time employers request PCS to recommend students for internships or junior developer positions. Let your lead instructor know if you are interested in being recommended. This will increase the expectations of the class.

You set the criteria for each assignment

All of the assignments are designed to be accomplished to one extent or another by any student that meets the prerequistes of the class. They are also designed to gradually require additional work for students who choose to attempt it. Finally, they include requirements that go beyond that expected of any student.

Start every assignment by reviewing its requirements. Choose what you think you can accomplish in the time you have to devote to the effort. Commit to accomplishing whatever degree of completion you choose with a high degree of quality.

Student Time Commitment

Attend every class, even if you miss one. You already paid for it, so don’t worry if you get behind. You can’t get help unless you ask for it.

This course requires 6 hours each week for classroom time. Successful students put in about 2 hours of their own time each week for each classroom hour for a total of 18 hours per week.

Please look carefully at the course meeting hours and make sure you can be available for those times.

At Portland Code School, the instructors value your time and they expect you to value theirs. Please arrive on time to limit distractions and enable other students to become successful in this course.

Assessment Methods

Assessment is based on a combination of * Classroom attendance * Classroom participation * Engagement in asking for help and requesting the education you want * on-time delivery of work based on estimates from personal goals * Quality of work on individual assignments * Quality of work on team assignments * Work on quizzes

Assessment is a fancy education word that is often associated with grades. Since we don’t give grades at Portland Code School, assessment means something else:

For us, assessment means communication, and communication is a two way street. When you need help, we’re here to provide it. But we can’t read you mind, so it’s really important that you tell us what you’ve done and how you’ve felt about it.

You can communicate in this class by:

  • Connecting with other students: track what you and other students are doing and where you are at with the course material
  • Schedule appointments with the instructor or with a teaching assistant
  • Complete any forms we ask you to do
  • Quizzes: these tell us what you know based off of what we hope you learned.

Home and Class Work

You will have plenty of opportunities to learn both in the classroom and on your own. Homework will include:

  • Completing class assignments to build web sites of increasing complexity
  • Watching screencasts with experienced lecturers, interactive exercises, and quizzes
  • Performing online interactive coding exercises to explore JavaScript and jQuery
  • Participating in individual assignments to create a multi-functional personal blog
  • Participating in several team projects to discover client requirements, specify, and build web sites of increasing functionality

Screencasts

You will all have Treehouse accounts assigned to you the week prior to class and you will be assigned screencasts each week. You are required to complete the quizzes and earn the badges. We will review your progress every two weeks to make sure you are on track.

For some of you, screencasts will be a slow experience. Feel free to skip ahead to the quiz for each module to see if you already know what they are teaching. If you have trouble with the quiz, watch the screencasts. Also, speed up the tempo if you can follow along at the faster speed.

Making screencasts a good use of your time

Everybody has different learning styles: some people learn well through screencasts. However, realistically, the density of information is very low. Screencasts can make some subjects more accessible by having a friendly person introduce you, but there is no substitution for reading about topics on your own, studying them in depth, and then applying your knowledge by programming.

As you watch screencasts, some topics will be difficult. Some people have a natural inclination to seek out other textbooks or other screencasts when the one they are watching or reading is difficult to understand. However, this is just a delaying tactic, a form of avoidance. If you are having difficulty learning using one method of learning, the best technique is to use an entirely different method of learning.

In our case, the best alternative when you think you don’t understand how to code is to start coding. Stop the playback and try it yourself. Turn a normally passive activity, watching TV, into an active learning experience by programming while you watch.

There is no better way to learn coding then to do it, to fail, and to puzzle out what is going on. It will be a waste of time for you to switch textbooks or switch screencasts if you find that the offered resources are not giving you immediate understanding.

Interactive Programming Exercises.

You will be required to work through several interactive coding exercises on Codecademy (http://www.codecademy.com). These are free of charge.

Additional requirements

Computer

You need to provide your own computer for this class.

Portland Code School highly recommends MacBook Pros running OSX 10.9 or later. Most of the best web development tools are developed on that operating system first. The important aspect of OSX is the underlying UNIX-like operating system. We place an emphasis at being able to work on a Unix/Linux command line level, down in the guts of the operating system.

Portland Code School will rent you a MacBook Pro for $30 a month during this course. It’s a great deal.

A good alternative is Linux/GNU. Most of your web applications will be deployed on Linux/GNU virtual hosts in the cloud. Any Debian-based distribution will do.

Windows is at best a third alternative. While we will do our best to use cross-platform tools and techniques, you may have to discover Window alternatives on your own.

If you have a Windows laptop and you cannot manage to obtain or rent a MacBook Pro to work with in this class, we can help you a virtual Linux instance that you can use for class activities. You don’t need an extremely powerful laptop, but we can talk about the minimum specs if you are in this situation.

We’re not saying that professionals should demand a particular tool set. Your instructor is comfortable on any of these platforms and easily moves from one to another as the client requires it. It’s just makes for a more cohesive classroom experience and simpler class materials to simplify and focus on one.

Other Tools

You have the option to choose either atom (https://atom.io/) or Sublime Text. (http://www.sublimetext.com) Atom is an up-and-coming text editor that has many of the good qualities of Sublime but is missing a few. It’s free, however.

Git You know it. You love it. You can’t stand it.

The Chrome Developer Tools are a wonderful suite of browser-based tools that allow you to see what you are coding. There are tools like these for every major browser, but we focus on Chrome. These are built in to the browser.

There will be more tools introduced as the class goes on, but these are good places to start.

Mutual Respect

This class depends upon an atmosphere of mutual respect among students and staff. Together, we create a safe place to listen, learn, speak candidly, and fail safely. This is not a typical college class, it’s a team effort producing a final product: jobs for everyone. You have the opportunity to make deep connections here that you will enjoy the rest of your career.

Students are expected to act at their highest capacity and with mutual respect for each other regardless of age, race, gender identity and expression, sexual orientation, or prior experience. Instructors are expected to lead in this regard by example.

In a related vein, this class requires work in close proximity to others as we code and debug in pairs and small groups. Good hygiene is mandatory and an additional sign of respect for your colleagues.

Grievances Procedure

Students who observe or experience any behavior on the part of instructors, staff, or students at Portland Code School that does not meet the school’s Code of Conduct should take action. If you experience or perceive a problem, attempt to work it out on your own, if possible, but do not hesitate to bring it privately to the attention of your instructor. If this is unsatisfactory, bring it to the attention of the school Director (Cris Kelly) or Assistant Director (Shawna Scott)

Instructional ADA statement

Students who have a documented disability and require a classroom adjustment or accommodation should contact the instructor and/or the PCS Director prior to the first class session.

Course content and calendar subject to change

The instructor reserves the right to modify course content and/or substitute assignments and learning activities in response to institutional, weather or class situations.

We adjust the class each session to the needs of the current students. We may slow the pace or add additional work, as needed. We also carefully incorporate new technologies as they become significant to your employability. As a result, we often are creating class materials as we go. You will always get advance notice of classwork.

You also get to evaluate us. We use a technique called “project retrospectives” to identify what’s working for you and what we need to improve. We try to improve the course as we go.


Syllabus version 2.0