CS 347: Lab 1 – Critique
Welcome to CS 347: Web Development. This is a course in which we write software that runs in a web browser. Software that runs in a browser is easy to share with others, is easy to update, and is written using modern languages and development tools. I’m Chris, and I’m happy to be teaching a course that feels relevant and human-oriented.
You will be making things of your own design in this course. In other courses you get a specification to meet. That won’t happen in this course. You must demonstrate creativity and ownership. There won’t be many academic chores to do. Instead, you will be maintaining a blog and completing three open-ended projects: a static website, a web service, and a React app. You will learn to administer a web server and have it serve out websites securely.
At the start of every semester, I get pretty excited about the learning that will happen. I think about the things I will say and the code I will write. By the middle of the semester, I am bitter and jaded, because I feel like I’m doing more learning than the students are. At that point, we all want the semester to be over.
I’m trying to avoid taking too much control over your learning this semester. I will do minimal lecturing. Instead, I will be turning what I would have said or done in a lecture into a semi-interactive electronic book that you will read at your pace and actively play along with. You will read a chunk of this book before each of our classes. During class, you will team up with one or two others in the room and complete exercises that use concepts discussed in the book.
Exercise
On this first day of class, you haven’t done any readings. So we’re going to do a little activity that builds off your experience as a consumer of the web. You will pair up and critique the website of one of these local businesses:
- Cupcake Company
- Urgie’s Cheesesteaks
- Dart Resale and Trade
- Magpie Diner
- Heritage Oaks Golf Course
- Digital Minerva
- Divine Unity Church
- Shirley’s Popcorn
- Riner Rentals
- Kline’s Dairy Bar
- On the Road Collaborative
- Dreamland Tattoo
- Gary’s Pianos
- Harrisonburg Electric Cooperative
- Strite’s Donuts
With a partner, answer the following questions and be prepared to give a one-minute rundown of your most interesting findings:
- Tell about the site’s visual style. What is pleasing to look at and interact with? What isn’t pleasing? Be opinionated.
- Tell about the site’s usability. Is anything broken? How are the pages organized? How does one navigate?
- Compare the site between desktop and mobile browsers. How do the experiences compare?
- Open your browser’s developer tools and reload the page with network throttling on. (Search the web for how to do this.) How will visitors with low-speed internet fare?
- In the developer tools, enable element picking via the mouse. (Look for an icon with a cursor on it.) Drag the mouse around the page to see how it’s put together. What things do you notice?
Submit your answers on Crowdsource to receive credit.
TODO
- Read the syllabus.
- Join the Slack.
- Install Visual Studio Code and its Live Share and Live Server extensions.
- Set up your Digital Ocean droplet following the posted guide.
- Set up Apache and your blog on your droplet following the guide that will be posted soon.
- Read chapter 1 of All Over the Web.
See you next time.
