Website Development I

Course Info Class Notes Resources Student Websites

Course Information

for the term beginning in October 2023

Course Description

This course extends what you learned in Website Development I by introducing you to a modern, powerful, website development framework called Bootstrap. We will be working with the very latest version of Bootstrap, which is version 5.3 that was released earlier this year.

This course will therefore give you a real taste of how professional website developers work today. It will also significantly expand your knowledge of the three basic website development technologies that we studied in Website Development I: HTML, CSS, and JavaScript. We will review various aspects of those technologies as necessary.

The goal of this class is for you to build a website on a topic of your choice. That’s a big job, but you’re not going to have to build your website from scratch. Rather, you will start with a professionally-designed template and modify that template to suit both your needs and your taste.

The course will attempt to cover:

the basic organizational and design principles of Bootstrap 5
a number of the Bootstrap components that you can use on your website (we won’t have time to cover them all!)
how to override default Bootstrap 5 styles to suit your own needs and taste
best practices when building your own website from a template

Important Note: This course is going to be a significant learning experience for me as well as for you. I only started learning Bootstrap myself over the summer, and it has been a steep learning curve. I have been unable to find a book that truly teaches Bootstrap 5. All current books teach Bootstrap 4 with — at best — an addendum on Bootstrap 5. Therefore, I will supplement the textbook for this course significantly in a number of ways. See the Resources section below for further information on this issue.

Course Objectives

As in Website Development I, it is difficult to know at the outset just how far we’ll get in this course. However, as stated above, the goal is for you to build a website on a topic of your choice. We will make as much progress toward that goal as we can.

That said, here are some of the major topics that we will cover:

setting up a Bootstrap 5 website
using a website template
understanding the Bootstrap container-row-column paradigm
working with the many Bootstrap components such as buttons, cards, carousels, progress bars, and navigation bars
creating page headers and footers
interpreting the Bootstrap documentation
and just as we stressed in Website Development I: understanding the value of documentation and describe best practices in this area

Course Philosophy

The underlying philosophy in this course and the points that we will stress are exactly the same as they were in Website Development I ...

Learn concepts, not just coding techniques.

The World Wide Web is an ever-evolving information platform.
Coding techniques and syntax will change, but the concepts will not.
Given how quickly things evolve, the most important thing you can learn is how to learn.

In this field, that learning never ends, including for me!
Much of how one learns these days is by using websites like Google to search for answers.
We do not have Internet access from inside the prison, but I will provide some materials downloaded from the Web to help us understand what the Internet offers.

One aspect of learning concepts is to realize that it is important to call things by their proper industry standard names.

We will therefore stress what things are called so that you learn these names.
It is also important to know how to spell these names correctly.

Write professional code.

Your code should be:

Correct — It should work in all cases.
Clear — It should be understandable by other web programmers.
Concise — It should use resources efficiently.

Professional code includes professional documentation.

Documentation is for yourself as well as for others.
Today’s software is complex. When working professionally, you will never create a website completely on your own.
When you incorporate code into your own program that was downloaded from the web or written by anyone other than yourself, you must cite where that code came from.

Course Approach

As noted in the Course Description above, throughout this course you will work on building your own website. You will start with one of the templates that I downloaded from bootstrapmade.com and modify that template as you see fit. You are, of course, encouraged to share techniques with the other students in this course, but each of you will ultimately build your own website.

We will discuss various techniques as a class, and I will go over many of the examples in the textbook. As we did in WebDev I, I will try to end the discussion part of the class by 9:15 each day so that you have a good 45 minutes in every class to work on the computers.

I stress again that I will be learning as much from you as you will from me. There’s an old saying in education that I have always found to be true: “If you really want to learn something, teach it!” I won’t always have answers to your questions during class, but as before I will research your questions at home and try to come back with answers in our next class.

Course Resources

Our main texbook for this course is Mastering Bootstrap 4, 2nd Edition by Jakobus and Marah. Packt Publishing, the book’s publisher, has donated copies of this book for your use during this course. The book was published in 2018, so it covers Bootstrap 4, not Bootstrap 5. There are therefore a lot of things that I will need to clarify for you so that you can adapt what you are reading to the latest version of Bootstrap.

Over the summer I have rewritten all of the examples in Chapters 1-4 of this book into Bootstrap 5. A complete index of the updated examples is in the fourth tab of this website. I have also added documentation inside the code and provided comments to help you understand what’s going on.

Additional resources are available to help you learn in the Student Resources.

Class Days and Times

This class will meet in classroom 10 on the Ed floor on Tuesdays and Thursdays from 8:40 to 10:00 AM starting Tuesday, April 4, 2023. The class is intended to meet for 11 weeks, so the last class is scheduled for Thursday, June 15, 2023. However, there always seem to be occasional situations that cause us to miss some classes, so we probably will not meet on all 22 days scheduled for the quarter.

Between classes you are welcome to use the computers in room 5 on the Education floor whenever you are allowed to be here. However, I have been told that you may only do so while actively enrolled in this course.

Tentative Class Topic Schedule

The order in which we cover topics will change as the semester progresses and I learn your various interests. The table below should therefor be interpreted more as a list of things to learn than a precise schedule.

Your Instructor

Your instructor for this course is Mr. Jesse Heines, a Professor Emeritus (retired) of Computer Science. Mr. Heines is a volunteer for the New Hampshire State Prison for Men Career & Technical Education Center (NHSP-M CTEC). He has been volunteering in the prison since April 2018 and teaching behind the wall since April 2022.

Course Sponsors

The following companies and organizations have donated books or equipment or software for use in this course or have made their software publicly available at no charge. UMass Lowell has authorized us to issue course completion certificates and award Continuing Education credits to those of you who complete the course.

Other Terms

To view the website for a different term, click the appropriate link below.

Term beginning April 2023: Website Development I