version 2.0
This comprehensive course gives you everything you need to begin a career in front-end web development. In this fast-paced, project-based 16-week course, you will be introduced to all the skills necessary for web application front-end design and development.
Not a contract
For definitive contractual agreements, see the "Portland Code School Student Enrollment Agreement" that you signed. Nothing in this syllabus is intended to supersede or replace terms agreed to in that document. Where a conflict exists, that document will apply.
Monday/Wednesday/Friday 9:00 AM to 11:50 AM
PCS Classroom, 1771 NW Pettygrove Street, Ste 140 Portland, OR 97209
Al Zimmerman
Email: azimmerman@portlandcodeschool.com
Phone (text and voicemail): 503-970-3645
Office Hours: Monday 1 - 3pm
Contacting your instructor
I am available for a short period of time after each class. My main office hours are Monday 1-3pm in the PCS classroom. I'm also willing to meet with you by prior arrangement online in a Google hangout or Skype screen sharing session. My calendar is as tightly fitted as a Moroccan mosaic, however, and we may have to work a little to find a time that works for both of us. Office hours work best.
My PCS email is azimmerman@portlandcodeschool.com. Email to this address will get a reply within 24-48 hours. My cellphone is 503-970-3645, but it only works for text or voicemail. If you text me, please prefix your text with the word "PCS". Texts or voicemail will get a reply within 4 hours.
This class continues your education in front end development. You should already have created one or more web sites (using any technology) and be familiar with basic command line usage. If you have questions about these prerequisites, contact your instructor.
The core abilities for students in our program are as follows. They are designed to be the overarching goals for everything you do. Each of them have been specifically requested by the employer network and we believe that they are good goals for all developers to aspire to and flesh out.
- Create code quickly and efficiently
- Create high quality code
- Collaborate with teammates effectively
- Understand and apply current technologies
- Learn new technologies and techniques easily
- Understand and apply computer science concepts
- Understand and apply business and product development concepts
- Speak effectively about technology in interviews and while networking
- Utilize the technical and functional aspects of each lesson topic
Technical abilities are skills needed to succeed in front end web development
- Understanding basic principles of user interface design and user experience
- Constructing web sites with valid HTML, CSS, JavaScript, and jQuery
- Styling modern, fresh-looking designs with CSS3
- Creating responsive designs that work on phones, tablets, or traditional laptops and wide-screen monitors.
- Using CSS frameworks like Bootstrap and Foundation
- Programming simple JavaScript routines
- Using jQuery to provide interactivity and engaging user experiences
- Creating easy-to-maintain, hand-crafted sites using static site generators
- Using content-management systems like WordPress to speed development
- Collaborating with development teams using GitHub
Career abilities are skills needed to have a successful freelance career
- Using project management - time management, effective teamwork both as team lead and individual contributor, iterative and agile development strategies
- Understanding how to succeed in the job market
- Creating & cultivating peer and professional networks
- Developing Life-long learning strategies - identifying information sources, reading code, developing mentoring relationships
- Developing self-motivated job skills for working at home and delivering on time
- Communicating your skills - portfolio development, presenting your work, making business connections, interviewing
- Working with job agencies like 52ltd and Vitamin T
Class hours: Monday, Wednesday & Friday 9a - 11:50a
You must attend all classes. Class begins promptly at 9am. Late arrivals and missing team members are very disruptive. If you are going to miss class or even be as little as 10 minutes late, please text Al at 503-970-3645 prior to 9am.
This course requires 9 hours each week for classroom time. In addition, successful students devote approximately 2-3 outside hours of their own time each week for each classroom hour. In effect, think of this as a second job of between 20-25 hours each week if you want to get your money's worth.
A core skill of professional work is being able to estimate when you will complete a task. This requires being aware of your own skills and your own productivity. Unlike classes at other schools, this course may not always tell you when assignments are due. Instead, it requires you to estimate completion times for all assignments, to measure both your effort and your productivity, and to learn time management techniques that work for you.
While setting your own assignment deadlines, you will asked to cultivate a bias towards action and to complete assignments as fast as possible while maintaining a high level of quality. Like a product launch, each assignment has a "market window", after which it becomes worthless. Since most of our work is project-based teamwork, rapid completion of assignments will require learning how to motivate other members of your team as well as meeting your own commitments. This is all part of a professional skill set.
You all have Treehouse accounts. If you did not receive notice of your Treehouse account, please contact me. There are many alternative screencasts available for all of the topics that we will cover in this class, but we want you to invest time in the Treehouse ones. 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.
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.
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.
The web is full of places where you can learn to program. Again, the problem isn't finding a resource, it's completing what you set out to do. We've chosen one or two that we want you to work to completion.
Required: CodeAcademy (http://www.codecademy.com)
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 coding 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.
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 will have a work session for creating 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.
You are required to learn and use Sublime Text. (http://www.sublimetext.com) The "stable" version is V2, but Al has been using V3 for a long time and it's fine. (http://www.sublimetext.com/3) Sublime Text is not free. You can try it for free and that will get you through this class, but you should consider buying a copy when you get a job.
Now, you may already have a favorite text editor. I understand where you're coming from. However, one characteristic of professional programmers is they can walk into a shop and quickly adopt whatever tool set that company is using. Lots of programmers use Sublime Text and, if all the students in this class use it, we can learn from each other and get the most out of the tool.
Git is a distributed version control system. It is complicated, arcane, and difficult to learn. Yet, it is one of the most commonly used and essential to any freelancer. We will start using git in the first week and emphasize its use throughout. You will be required to be able to use git from the command line, but we will also explore graphical user interfaces to make your use of git more transparent and powerful.
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. Front end development was stone tablets and chisels before browser-based tools.
There will be more tools introduced as the class goes on, but these are good places to start.
One type of tool we will not use is WYSIWYG ("What you see is what you get") development environments like Dreamweaver. By the end of this class, you will be easily and quickly coding interesting and compelling web sites "by hand."
Our ultimate goal is to be able to give a shining recommendation about you to any and all possible employers. Over the years, Al has managed and hired many software engineers at both a junior and senior level. Our goal for you is that we would want to hire you ourselves.
Along the way, we will be asking ourselves the same questions about you that all hiring managers will be asking about you:
- Can you work in a team?
- Can you handle jobs on your own?
- Can you communicate in such a way that the people you deal with find you reliable?
- Can you find effective decisions, not just the "right" ones?
- Can you follow instructions and finish assignments ahead of schedule?
- Can you extrapolate from vague inputs and take the initiative to resolve any missing information?
- Do you have a bias towards action and taking risks?
- Can you manage your use of your own time?
- Can you deliver in a team context?
- Do you have effective learning strategies?
- Can you use testing techniques?
- Do you write valid code?
- Can you effectively code the front end of a modern, responsive web application?
Notice that the soft skills are at the top of the list and the programming skills are at the bottom. We will talk more about this in class.
Your progress will be assessed using a variety of methods:
- Attendance - You need to show up and do the work
- Completion of assignments - we will keep track of whether you do what we ask you to do
- Code reviews - we will read and assess your code
- Quizzes - we will ask you questions and evaluate your answers
- Instructor reviews - your instructor will observe your work and take notes
- Peer reviews - we'll talk to everybody in the class to see how folks are doing on teamwork and partnering
- Participation in the community - we will ask you to hang out with your peers, meet people, and report back
- Portfolio web site - we will help you design and build a portfolio web site where you can show off your work and abilities
We will keep records of your progress. Your records are private to you and your instructor. However, at the end of the session, employers ask us for recommendations -- the names of particularly talented and hard-working students. We use student scores and evaluations to identify students for these recommendations.
We will check-in 1-on-1 with you every two weeks. You will get early notice if you need to step up your game in any particular area. After that, if in our judgment we think you still aren't able to complete the demands of the course and become a viable front end developer, we will discuss alternatives with you that may include termination of your contract with Portland Code School. For your part, if you feel you are not getting your money's worth, you can terminate your contract at any time. Check your student contract for details.
Don't worry: every two weeks, you also get to evaluate us. Fair is fair, after all. We practice agile methods here which means we do regular retrospectives and make improvements.
This class is "homework first" - with the exception of the first session, all sessions require students to prepare by watching screencasts, reading assignments, coding, testing, or otherwise performing assignments /before/ the next class so that they arrive ready and prepared to contribute to the team. You will not have the opportunity to catch up in class.
Students who attend class unprepared diminish the learning opportunities for everyone, not just themselves.
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)
Each term, students may collaboratively establish other norms and expectations specific to that cohort. There will be discussions at the beginning of the term and at regular intervals to make sure these are understood by all.
This course relies on the following cycle to teach each new concept:
- Watch, listen, read, and write
- Play & fail
- Challenge yourself
- Collaborate with others
- Teach
Watch, listen, read, and write: Some concepts are easy, some take a little while longer to internalize. So we provide multiple modalities: screencasts, reading, conversation. We encourage note-taking both personally, by hand, and for the class as whiteboard or easel scribe
Play and fail: Children learn faster than adults because they play and they don't care about failing. We encourage a playful, safe learning environment. We use interactive coding tools and encourage students to try every new idea out for themselves. We encourage test-driven development, where the first step is failure (and the last step is triumph!).
Challenge yourself: Studies have shown that you learn the most when you have the most to lose - right after failure. For some people, it feels bad to feel stupid. For us, confusion is the first sign that we're learning and the first taste of fun times ahead.
This course teaches students how to become self-learners, how to challenge themselves to learn new skills through experimentation and trial and error. To that end, many exercises and quizzes are taken from around the web through a meticulous process to make sure the carefully curated work is relevant and high quality. The answers are all available to students if they look for them. None of these are tests in the traditional sense. If they wanted to, students could easily find, copy, and claim these answers for their own. However, this would all but guarantee that they do not acquire the skills necessary for employment. By participating in this course, students agree not to use Google, StackOverflow, or similar methods to simply find, copy, and claim answers to exercises and quizzes for their own work.
Collaborate with others: Employers tell us that the most important skill is working on teams. Students work together in pairs and small groups to understand problems, design solutions, and construct code. They use test-driven design to verify that their solutions work. They perform code walk-throughs to compare their work with the rest of the class. The point is to make sure that everybody in the class arrives at a working solution, not to find out which students are capable of finding a solution on their own and which are not.
This class puts an emphasis on participating in community. We require students to attend local community events in the beginning, then we expect them to volunteer at and eventually lead community events. Like experienced developers, we use the community as our primary means for building a business network and finding employment.
Teach: You don't fully understand something until you teach it to others. This class requires students to teach each other and gives them frequent practice in small, easy doses to help them become comfortable.
This also includes blogging and contributing to online forums like mailing lists and StackOverflow.com. Helping others in the community by relating what you know is an excellent way to earn a good reputation and build a personal brand. The reason this is such a wonderful time to be learning software development is because people are so willing to help each other. Students learn how to pay this forward.
After getting some basics under their collective belts, students will be requested to identify one or two potential capstone projects that they can accomplish in teams of 3. These projects should provide meaning or value on a topic the students find interesting. If they can't identify a project, Portland Code School and its network of partners and employers may have several to choose from.
Students will pitch these projects to the PCS staff and will collaborate with staff to scale the scope so that students have a good chance of success by the end of term (including some failures along the way!).
During the final week of class, students will present their completed projects to their fellow students, staff, and members of our employer network.
Details will be provided as the class proceeds.
- Month 1 - HTML/CSS/JavaScript, simple sites, tools, teamwork, community
- Month 2 - Advanced HTML/CSS, creating interactivity with jQuery; responsive design, web frameworks (Bootstrap),
- Month 3 - Wordpress, specifying web applications with user stories and wireframes, career guidance: portfolios, collaboration
- Month 4 - Capstone project design and construction, job hunting skills, pitching to clients, making technical presentations and mentoring others in the community
We will cover material on four major themes: Career, Code, Process & Tools
- Joining the Community
- Developer culture
- Local developer resources
- Online communities
- Freelancing techniques
- Contracting
- Working with other freelancers
- Looking for work
- Making critical technical choices
- Understanding different types of work and their roles
- Project management
- Time management
- Client communication
- Project management platforms
- HTML5
- New elements and their use
- Page structure
- CSS3
- Preprocessors like SASS
- CSS frameworks (bootstrap, foundation)
- JavaScript & jQuery
- Javascript / ECMA Script fundamentals
- Using 3rd party libraries
- jQuery libraries and patterns
- CMS's
- Wordpress
- Other Content Management Options
- Static site generators
- Hosted solutions (Squarespace, Shopify, etc)
- Analysis
- User Stories
- Content Strategy
- Managing Client Expectations
- Design
- Functional design vs graphic design
- Wireframes, paper prototyping, rapid prototyping
- Comps, wireframes, and site sketches
- Testing
- Manual vs automated testing
- Multi-browser testing
- Project planning and management
- Working on a team
- Production best practices
- Being a one-person shop
- Budgeting time and money
- Learning while working
- Writing code
- Sublime Text and other editors
- JsFiddle
- Productivity utilities
- Source control and collaboration
- git and github
- Basecamp
- Google Apps
- Mockup and prototyping
- Pen and Paper
- Invision
- Wireframing
- Testing
- Selenium
- W3C validation
- Deployment & DevOps
- SSH / SFTP
- C-Panels
- Moving a CMS to a different server
- Heroku
###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.
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.
Every two weeks, 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.
You should all have access to a Google calendar called, "PCS" and should have received an email to this effect. If you haven't, please contact Kristina, Cris, or Al and we will make sure the class calendar is available to you. We will try to make sure this calendar is always up-to-date.