- Course: CPLN-692-401/MUSA-611-401, University of Pennsylvania
- Location: Meyerson Hall B2
- Schedule: 2-5PM, Fridays
- Instructor:
- Nathan Zimmerman, npzimmerman@gmail.com
- TA:
- Yixuan Hu (Emily), arena_hu@hotmail.com
- Office Hours:
- Nathan Zimmerman: Friday 12:00PM-1:30PM @the GSC (and special request as necessary)
- Emily: Wednesday 5:30PM-6:30PM @Meyerson Basement (and special request as necessary)
- Need help?
- Internet Search (stack overflow is your friend!)
- Map-based Web Application Examples
- Data Sources
- You Don't Know JS - A set of free online books which start from scratch and go, in-depth, into javascript concepts and best practices.
- Mozilla Developer Network - Javascript reference materials (highly authoritative)
- Eloquent Javascript - This is a free book with some advanced content. As you think about the application you might like to build for your final, the chapters on HTML forms, drawing with javascript, building a game, and constructing your own painting application will push further than we can in class.
Throughout this 15 week course, you'll be learning to program applications using HTML, CSS, and Javascript. In addition to programming skills, we will stress the "tools of the trade": you will use a text editor designed for programming; your code will be turned in with git and managed through github. You will be programming in the same way and with some of the same tools as software developers in the industry.
We'd like to keep the course somewhat freeform — there are basic skills which must be touched on, but your interests will help shape the direction to a large extent. There will be a self-directed final assignment that can take on any topic you find interesting (so long as you use some tools from our class).
This syllabus is a living document. As the course progresses, greater detail will be added to reflect the content of each week.
Grade | Score | Grade | Score | Grade | Score |
---|---|---|---|---|---|
A+ | 97–100 | B+ | 87–89 | C+ | 77–79 |
A | 93–96 | B | 83–86 | C | 73–76 |
A- | 90-92 | B- | 80–82 | C- | 70–72 |
- Assessment Method / Grading Criteria:
- Participation, attendance, and homework: 20%
- Midterm Project: 30%
- Final Project Proposal: 5%
- Final Project: 45%
Each week will have a different repository with the seed for that week's assignment. Turning in an assignment will consist of editing the template project provided as a part of each week's repo and uploading your changes to github. Assignments are due (on github) before the next week's class.
We will provide a menu of appropriate features for an application to be programmed midway through the course (in a lab and at home with a completely open book). This assignment will stress the basics of open-source, online mapping applications.
The final assignment for the class will be decided through a project proposal. Final projects will be done in groups or independently— criteria for success will be hammered out in the final project proposal and group projects (if we have any) will be expected to engage with a wider scope and greater difficulty than individual projects. Group projects will also leverage the power of github to make collaboration simpler and more transparent for grading purposes (this will make more sense once you're familiar with github).
Subject to change as necessary!
- Introductions and university boilerplate
- Using Git and Github (using the git CLI - we will revisit this almost every class)
- Github's Atom Text Editor + javascript extensions
- First steps with Javascript (playing in the console)
- Editing your first online map
- JS Review:
- Data types
- Variables
- Conditions
- Functions (a topic we will continually return to)
- Libraries and imports
- Review:
- Arrays
- Writing loops
- Iterators (this is an extension to our prior work with functions)
- Objects
- Lab:
- Function anatomy and thinking functionally
- Underscore functions
- Refactoring code
- Introduction to jQuery
- Async behaviors
- HTML structure
- jQuery selectors
- APIs
- Geojson
- Where to find spatial data
- In class (collaborative!) work on midterm project
- Midterm presentations
- Discussion of direction for future classes
- Code review, discussion of best practices
- Turf
- Spatial SQL
- Mapbox
- Leaflet Draw
- D3/Chart.js
- Bootstrap
- Using the command line
- Python
- Advanced debugging
- Vector tiles
- node.js (writing javascript for the server)
- Google Earth Engine
In compliance with Penn's Code of Academic Integrity, blatantly and egregiously copying another student's work will not be tolerated. However, because this course is designed to help prepare students for work in professional programming environments, copying and pasting is not universally prohibited: we encourage students to work together and to freely use the internet as a resource for finding solutions to vexing problems. Citing every copied and pasted line of code is not necessary. Large patterns or multiple lines of code taken from external sources should, however, be noted with in-code comments. If an instance is unclear, you should feel free to speak with the instructors.