Fall 2020 Syllabus (Schedule)
Classes meet M W F 10:10 - 11am over Zoom and in Kochel 77. Zoom attendance is required for all students in all class meetings. The classroom is optional, but even in the classroom you will be connecting to Zoom to team up with your classmates.
We plan to host Wednesday meetings only in Kochel 77, as long as the class is willing and it is safe.
For in-class meetings, we must all wear masks and maintain a safe social distance. Remember: Your mask protects me, my mask protects you.
This contains a detailed explanation of course policies and the basis for grades.
This link jumps to the closest day to today's date. Review the schedule as we get started to get a sense of how this course will work on a daily basis.
All the Tools You Need As We Begin:
Download and install the following software on your own personal computer(s) on or
before the first day of class. These software tools are available in our campus computing
labs, too.
- <oXygen/>.
The DIGIT program has purchased a site license for this software, which
is installed in Kochel 77 and the Lilley Library computers. The license also permits
students enrolled in the
course to install the software on their home computers (for course-related use
only). When installing this on your own computers, you will need the
license key, which we have posted on our course Announcements section of
Canvas.
- Zoom: Make sure your Zoom installation is up-to-date, and you are ready to
connect. The Zoom link for our regularly scheduled class meetings is posted in
Canvas: Look for the Zoom menu option.
- All students require a good means of secure file transfer (SFTP) for homework
assignments and projects (also available in the campus computer labs). There are
several good options available. We recommend you download and install on your own
computers one (or more) of the following, depending on your platform: (Feel free
to experiment with these and others!)
- Windows users: one of the following FTP clients—the functionality is
similar:
- FileZilla
(This is our favorite client because it behaves the same way across platforms.)
- WinSCP (This is one we used for a long time, since the 1990s, but we now use SSH and Filezilla
more frequently.)
- SSH Secure Shell Client
- Mac users:
- Linux users: You probably don’t need to install anything,
but look at how your system handles secure file transfer (SFTP).
(FileZilla or other clients designed for Linux
environments.)
- Rusty with coding? Don‘t remember anything from DIGIT 110? Don’t worry! Past students
in this course
who never saw anything like markup or XML code have designed projects (like these) and even spoken about them at undergraduate conferences! You will learn to develop
your own digital tools and how to manage digital projects as teamwork.
Class Web Resources:
Week 1 |
Topics |
Do before class |
M 08-24
|
Welcome! Introduction to the course. Clay Shirky on Love,
Internet Style and the Ise Shrine (9 minutes) What does an ancient wooden shrine have to
do with digital projects? Intro to XML in oXygen and some things we can build
with it. |
Respond to Dr. B's Poll (see Canvas / Penn State email).
Find the Zoom link for class (on Canvas / Penn State email). |
W 08-26
|
XML coding: a
recipe for Whipt Syllabub. Elements, attributes, comments, escape
characters, and "pretty-printing" in <oXygen/>. How file systems recognize XML documents (File extension, and XML declaration line). Introduce XML Exercise
1. |
Install oXygen XML Editor and add our license key so we
can all use this during our meeting today. Read my Introduction to XML and experiment
with the code in the tutorial: Can you tell what makes markup
well-formed or not? |
F 08-28
|
- Discussion of homework, and XML, applications of distinct identifiers. Building on a first pass of markup.
- @xml:ids, ref/pointers and project
stitchwork :
- Introduce XML Exercise 2: (see
Do before class for M 8/31)
|
Complete XML
Exercise 1 |
Week 2 |
Topics |
Do before class |
M 08-31
|
Discussion of homework (XML Exercise 2). Introduce the Bash
shell and GitHub. |
Complete XML Exercise 2: Revise the code in your XML Exercise 1 to do the following:
- Add @xml:id attributes to either equipment or food items (or both), and come up with distinct identifier codes.
- Look for words in the steps that reference the distinct identifiers and apply new markup with attributes that point to or reference the xml:ids
- Look for historical details of interest and/or action words to code and reference.
- Revise the code of the Syllabub recipe to match the new code of your Shrewsbury Cake recipe. Consider putting @xml:ids on the recipe root elements,
and pointing to those codes from each recipe when it refers to the other one.
- Submit your revised Syllabub and Shewsbury Cake recipes on Canvas for XML Exercise 2.
|
W 09-02
|
Getting started with command line, git, and GitHub. Mindful file
management. Markdown vs. markup in GitHub issues: Hands-on work with our class
GitHub
repo. |
Git Exercise 1 (setting up your GitHub account). Watch my video introducing
the Bash shell and "home" on your computers and practice the shell commands I am introducing.
|
F 09-04
|
Adding cp and mv to the shell commands list. Learning git commands and working at command line (hands-on
exercise). Building a code repository for a digital project. |
|
Week 3 |
Topics |
Do before class |
M 09-07 Labor Day, PSU classes in session anyway!
|
- Overlapping Hierarchies: Group Exercise with "Ozymandias."
- User Experience (UX): Launch discussion.
|
- Git Shell Practice (starting today for seven days): Make
sure your personal repo and the class repo are properly set up and cloned to
your computer. Using your Bash shell, practice some basic git commands to build
a habit. On alternating days, push to the other repo (if you pushed to your
personal repo today, tomorrow you will pull and push a file to our class repo).
- Complete XML Exercise 3: Mark up a text of
your choice (any genre, manageable but reasonable size, any language). Work on
applying attributes with your elements in a careful and systematic way.
- Review feedback on your coding exercises so far and
submit revisions if I asked you to.
|
W 09-09
|
Hands-on introduction to schemas with Relax NG: How to write the rules for
an XML project |
|
F 09-11
|
Relax NG: data types, mixed content. Document data
modeling.
|
Watch my video on Relax NG and how to write it in oXygen, and
complete Relax NG Exercise 1: - Make a folder to hold this homework, since it will contain two files. Save the folder using our homework filenaming conventions.
- Open this ozyMeta.xml file (open the link, and right-click to save on your computer with your homework, then open in oXygen).
- Open a new Relax-NG Compact syntax file in oXygen, and set your editor in tile view so you can see the ozyMeta.xml file next to your schema file. Delete the code in the Relax NG file so you have a blank slate to start with.
- Write a Relax NG Schema in Compact Syntax that models the content of this XML file as you study it. (Save the schema in the same directory with your XML file so you can easily find it.)
- Associate the schema with the XML file (in oXygen go to Document > Schema > Associate Schema, and browse to locate the schema. Click OK and note the new schema line at the top of your XML file.
- Zip (compress) the file directory holding your XML file and the Relax NG schema file, and submit this on Canvas at the upload point for this assignment.
Review XML syntax and consult the Intro to Relax NG as you work on
this, and ask for help on out digitProjectDesign-Hub by opening an issue if you get stuck. Continue GitHub
practice! |
Week 4 |
Topics |
Do before class |
M 09-14
|
Troubleshooting and debugging Relax NG issues. Tour of course
projects with strong research questions. Initiate Class GitHub Project
Proposals |
- Complete Relax NG Exercise 2: Write a Relax NG schema for one of the XML documents you created for the XML homework assignments (making changes to the XML as you wish). Upload both your XML and your schema file in a zipped (compressed) directory on Canvas.
- Post in Discussion of student digital projects on digitProjectDesign-Hub
|
W 09-16
|
Relax NG and project team management. Work on Relax NG issues. Discuss project ideas, research questions. |
- Complete Relax NG Exercise 3: This time, choose a new text that you haven't marked up before and perform document analysis (study the document's structure and interesting features). Then write a Relax NG schema, mark up the text according to the schema, and upload both your XML and your schema file to Canvas.
- Post project proposal idea on digitProjectDesign-Hub
- Beginning from today through F 9-18: Post proposal ideas (each in its own issue) for team projects to work on this semester. Each student should post an idea for the class to consider: a project involving XML markup to be managed within a team of 2-4 students to investigate something we could study and visualize from our markup more effectively with computers than with human reading and description alone. All projects must involve a team of at least two persons, but this first exploratory proposal is an individual assignment.
- Each student must respond to at least one of the proposed ideas from another student and indicate suggestions or further ideas. You may respond to more than one if you like, and indicate which proposals interest you to work on.
- Proposal discussions will run until class time on M 9/21 when we will form project teams.
|
F 09-18
|
Project ideas and research questions to explore patterns and concepts. Locating your web space using FileZilla. Setting up SSH keys |
- Post / respond to project
proposal (now through M 9/21). Each student must respond to at least one
proposed idea from another student and indicate suggestions or further ideas.
- Install FileZilla (or other SFTP client) if you have not done so already: we'll use it in class to find your webspaces! Follow instructions posted on Canvas for setting up SSH keys to access
your personal webspace on Newtfire.
|
Week 5 |
Topics |
Do before class |
M 09-21
|
Form project teams! |
Post a project proposal / respond to another. Each
student must respond to at least one proposed idea from another student and
indicate suggestions or further ideas. |
W 09-23
|
Review Relax NG: Common issues in homework. Project discussion /
initiation time in class. |
|
F 09-25
|
- Building on the Web: connecting to and finding your web space on a remote web server.
- Hands-on: Work with FileZilla (or other SFTP client) to connect to the Newtfire web server, and set up SSH key access.
- What is "index.html" to a web server? Website addresses and file directories on a remote web server.
- Workflow from GitHub to Website: How to customize SFTP (Filezilla) to work with your GitHub repo.
|
Read our Introduction to HTML.
|
Week 6 |
Topics |
Do before class |
M 09-28
|
Continue with learning and workshopping HTML / CSS. Develop an index.html
page and link to other pages in your web space. Absolute vs. relative links (and file associations).
Make a simple CSS page. CSS resemblance and difference from Relax NG
(those curly braces). Test / troubleshoot using SSH Keys to access our web server.
|
|
W 09-30
|
- Working with CSS and HTML for code-based site development.
- Initiate first take-home test: Relax NG.
|
|
F 10-02
|
HTML and CSS
- Mindful file management: mirroring directory structures on GitHub and the web server
- Web browsers and display variations
- CSS Box Model
- Introduce Flexboxes (see tutorial)
|
- Read and apply Using
<span> and @class to style your HTML, and consult our Introduction to Cascading Stylesheets (CSS) to help complete HTML / CSS Exercise 2. (Submit this to personal or project web space).
- Consult Learn CSS Layout, Flexbox tutorial, and w3 Schools CSS Reference as you code.
(Also, check out Paletton (or hunt for other color scheme generators on the web) to help think about choosing a balanced color scheme for your website.
Experiment with writing CSS to control font, layout, color, backgrounds.
- Complete and submit the Relax NG Test
|
Week 7 |
Topics |
Do before class |
M 10-05
|
Slack chat and GitHub project management tools for improving communication, completing tasks.
Project web work. Project customizations and boilerplate with Server Side Includes (examples). Decide on project website directory names and URLs.
|
Project Checkpoint 2:
- Locate all sources for project XML markup
- Establish a clear flie directory structure on yoru project GitHub, including a distinct directory for website files
- Make sure all project team members work consistently with the GitHub directory structure (all agree on it, no one changes it without notice)
- Strong start on a project schema (Relax NG)
- A good quantity of documentation and/or markup is present in the GitHub repo.
|
W 10-07
|
Introducing Regular Expressions and autotagging. Regular patterns in documents. How to start?
|
Read Intro to Regular Expressions |
F 10-09
|
Regular Expressions: thinking algorithmically. Inside-out or outside in.
"close-open" strategy. Greedy matching. Work on Regex together. |
|
Week 8 |
Topics |
Do before class |
M 10-12
|
Regex: simplifying over-complicated expressions. Selecting for what's not there. Searching over highlighted portions of a document. |
Regex Exercise 2 |
W 10-14
|
Regex: Searching for patterns that include special regex characters. Project review. Issue short Take-home Regex Test (due Monday 10/19). |
Repair/complete and resubmit Regex Exercise 1 and Regex Exercise 2 if you were unable to create XML before.
Project Checkpoint 3:
- Some web development for site; navigation menu, page organization
- Refined schema
- XML markup: significantly more progress than the last checkpoint. Everyone's files are working with the project schema
|
F 10-16
|
Navigating XML with XPath: Introducing the XPath window in <oXygen/>, functions, axes, path steps /, and predicate filters [ ] Hands-on XPath navigation with Hamlet. |
Read our Introduction to XPath: Follow the XPath! As you read, try experimenting with the XPath expressions on our page, by downloading the explainXPath.html file, opening it in oXygen, and experimenting in the XPath window with some of our expressions. |
Week 9 |
Topics |
Do before class |
M 10-19
|
Work on XPath 1 and XPath 2 together. Using XPath axes. Predicate expressions [ ], (grouping). |
|
W 10-21
|
Go over XPath 2 , start XPath 2 together. XPath Functions, simple map vs. arrow operator. Using functions inside predicates. |
|
F 10-23
|
Go over XPath Exercise 3. Introduce string functions, and combining regular expressions with XPath. |
Complete XPath Exercise 3, or get as far as you can |
Week 10 |
Topics |
Do before class |
M 10-26
|
No synchronous class meeting today (Dr. B is participating in the TEI Technical Council twice-yearly meeting).
|
- Complete (or get as far as you can) with XPath Exercise 4: String functions
- Project Checkpoint 4: due by 11:59pm:
- Complete most XML markup for your project according to a refined project schema.
- Review/refine project research question.
- Make some significant content and/or enhance layout and styling for the website.
|
W 10-28
|
Introducing XSLT (eXtensible Stylesheets Language Transformations). XML to XML, XML to HTML. Namespaces. Setting up oXygen to write XSLT and saving as .xsl . Writing your first XSLT stylesheet transformation.
|
Read Introduction to XSLT, and watch one (or both) of the following orientation videos on how to set up oXygen to write XSLT:
|
F 10-30
|
How to write XSLT to change XML into HTML |
XSLT Exercise 1: An Identity Transformation |
Week 12 |
Topics |
Do before class |
M 11-09
|
XSLT for editions: push processing. Styling: working with XSLT and CSS together. |
|
W 11-11
|
Work together on Modal XSLT in XSLT Ex 5. |
|
F 11-13
|
Introduce xsl:sort and internal linking in HTML. XML to HTML with CSS. Apply to projects |
|
Week 13 |
Topics |
Do before class |
M 11-16
|
XML that makes graphics: SVG (Scalable Vector Graphics: Drawing elements and screen grid coordinates
|
XSLT Exercise 6 |
W 11-18
|
XSLT to SVG: working with variables to plot coordinate space |
|
F 11-20
|
Looking ahead to project completion. XSLT to SVG to make a graph |
(before class): SVG Exercise 2: XSLT to SVG
Project Checkpoint 5 (by end of day)
- Goal: XML markup is mostly complete and ready for active processing with XSLT
- Work on XSLT to HTML transformations to build content for the project website
- Improve the project website, update its organization and navigation
- Project intros: introduce the team members
- Other goals specific each team
|
|
Topics |
Do before class |
M 11-23 - F 11-27
|
Thanksgiving Holiday |
Have a peaceful and productive week! See you online.
Work on XSLT Test, SVG Exercise 3, and project development |
Week 14 |
Topics |
Do before class |
M 11-30
|
Integrating SVG and HTML for your website. Introducing simple JavaScript |
|
W 12-02
|
Associating JavaScript files with HTML, and coordinating with CSS |
- (for class): JavaScript Exercise 1
- (One Per Project Team): SVG Exercise 4 for projects: options: a timeline?, graph from project data?
|
F 12-04
|
Project sites: aplying Creative Commons license, linking GitHub repos, presentations. |
JavaScript Exercise 2: Toggling @class attributes |
Week 15 |
Topics |
Do before class |
M 12-07
|
Putting it all together: JavaScript with CSS to interact with SVG. |
JavaScript Exercise 3: JS over SVG and HTML
Project sprint |
W 12-09
|
JavaScript for projects. |
Project sprint. Prepare for Project Checkpoint 6 |
F 12-11
|
Last day: Project Checkpoint 6: Teams present their projects to the class, invite comments and feedback. Classmates from other teams ask questions, offer commentary on project GitHub repos through early next week. |
Prepare to share your project (nearing completion) with the class |
Finals Week: M 12/14 - F 12/18 |
Due |
H 12-17
|
Projects due by 11:59pm Finish developing projects on newtfire, and send a post to me on GitHub to indicate
your team is finished.
|