Students’ comments from fall 2019

Each of these comments was given on the UF course evaluation form for JOU 3633 in fall 2019. Of course there were some negative comments too, but those are not included here.

“Professor McAdams’s course was one of the most challenging courses I have taken in my time at UF, but I appreciated every minute of it. I feel I have a competitive edge as I’m looking for jobs in the next few months.”

“Very passionate about subject and really helpful. One of the best professors I’ve had!”

“Overall, I enjoyed the way the course was set up. The weekly video tutorials were very helpful and the textbook provided a lot of great detail on topics.”

“Professor McAdams is a great professor who has taught us a lot about coding. One of her greatest strengths as an instructor is her thoroughness and attention to detail in everything she does like our lecture videos and assignment instructions. This made it easy not only to understand the content she was teaching but also be able to know exactly what I have to do for the assignments in order to get a good grade.”

“Enthusiastic about the course and made herself available for an extra 3 hours on Friday, which proved to be tantamount to my success. Easy to talk to explain problems, too. She was very patient with problems students faced, no matter the size of the problem; I really appreciated this aspect.”

“Professor McAdams knew the answers to my questions and if she couldn’t figure it out she spent her time to do so. She answered my emails promptly and was an overall good instructor.”

“Professor McAdams was very helpful and supportive throughout the entire semester. Her lectures were thorough and provided a lot of information from the book and external sources. She was very present with her students and would always provide links to helpful resources used by professionals in the field.”

“I can make my own website now and understand coding language! Super helpful.”

“Everything I learned in this course will help me in the future should I decide to go down a creative route or not.”

“The entirety of the frontend development I learned in this course will help me in my professional growth. I’ve diversified my skill set and can now expand the types of positions I apply for.”

“HTML, CSS, and JavaScript will not only be applicable in a potential job for the future, but these three things have already helped me use my brain in ways that I never did before.”


Fall 2019 in Web Apps

Here are some things students said about this course (on the official course evaluation form) at the end of fall 2018:

This course had an assortment of resources and reference material. It let students not only prepare, but go beyond the scope of the course itself if they wanted to. The instructions for assignments were very well detailed and thorough. Reading material was always relevant. Workshop hours were great, especially having them at the end of the week when the deadline is coming fast.

I love the world of tech and coding, and I could tell from my first day in lab that Professor McAdams had the same interest and enthusiasm. Even better, she had the skills I was looking to gain. The class required a lot of effort; it was intense. I had to put in more time into this class than my more difficult classes, but it was worth it and it goes to show how much effort McAdams put into the course herself. Thanks to this class, I feel confident in the skills I have learned and I feel at a good starting point to keep learning and developing my front-end skills independently.

Intro to Web Apps is one of the most valuable classes I’ve taken in the j-school. I really got a sense of new skills that I could see myself using in career — even an entry-level position in digital editorial — that would set me apart from other applicants (or at least put me in the ranks of other journalism grads who have web design skills). The course-load was challenging with quizzes/a hefty amount of reading and videos each week, but the format of the class made sense for what we were learning, and it challenged me to come to lab as prepared as possible and soak in all the material in the way that worked best for me.

This class was really difficult for me and I hated it at times during each project, but each time I finished a new one I was so proud of my work and I’m so glad I have this new skill. I thought that all of the course materials were relevant and helpful to the assignments.

My favorite class of the semester. I learned so much!

The course is full?

There are two sections of Intro to Web Apps for fall 2018. Each is restricted to 20 students.

Students are likely to drop right up until the Drop/Add deadline on Tuesday, Aug. 28, at 11:59 p.m.

If you want to add this course, you need to watch it in ONE.UF. This is the only way to get a seat if one opens up. Only you can enroll yourself if a seat becomes available! There is no waiting list.

Only undergrad students majoring in JOU, ADV, PUR or TEL may enroll in this course.

A word of advice: It is likely that some students will drop after the first lecture on Tuesday, Aug. 28.

It would be really good if you come to the lecture that day to hear the instructions for the first week. That way if you do get in, you won’t be behind all the other students.

The lab on Aug. 22 will not meet.

Fall 2018 updates

JOU 3363 Introduction to Web Apps for Communicators is a course specifically for students in the College of Journalism and Communications, in any of our four majors. No prior experience with any kind of coding is expected. We start from zero.

Some of the past students have said this was the hardest course they took at UF. That might be true, but how do you define “hard”? If you mean you will work for hours and hours each week and not always be satisfied with your results, then yes, it is hard. But if you mean the concepts are difficult to grasp, as in physics or economics — then, no, this course is NOT hard!

The concepts and rules of writing web languages — HTML, CSS and JavaScript (not Java; that’s different) — are pretty simple and straightforward. There are rules, and you can easily learn the rules. However, making everything fit together, look good and work well takes time. Code is learned by doing, by trial and error, by writing it and testing it and failing and then trying again.

It takes a lot of time and a lot of effort. It takes attention and dedication. It requires interest and a desire to learn. This is not a course where you sit back and watch and listen. You have to work at it every week.

Labs and lecture

The lecture combines two sections in one room for one period each week. We’ll go over the most-missed questions on the weekly quiz and get tips for doing the week’s assignment. It is not a traditional lecture covering the week’s material — that material is covered in online videos. It is assumed you will watch the videos for the week before the lecture class meeting, so that you can ask questions if needed.

The lab sections are limited to 20 students each. During the lab, you’ll work on the week’s assignment. Near the end of the semester, you’ll give a presentation in lab about your final project.

This course follows a flipped-classroom model, which is why the labs are reserved for working on your assignments — you will read assigned sections in the required textbook and watch video lectures about the material before starting the assignment. If you skip the reading or the videos, you are likely to find the assignment difficult, especially after the first few weeks of the semester.

Plain talk about file names

There are a lot of conventions in web design and development, meaning “the typical ways things are done.” When you don’t follow the conventions, sometimes it would make a hiring person scratch her head and wonder why you don’t do things in the typical way.

The way we name files and folders in websites and apps follows some conventions. Some of these make a huge difference, and some are just for convenience.

  1. The primary HTML file on a site, or in a subject folder, is named index.html. This is more than just a convention — the browser will open that file automatically if it is left off the end of the URL. Examples: (index.html at top level of site opens) (index.html in the /examples/ folder opens)
  2. The primary CSS file for a site or a project usually has a name that indicates its status as the main CSS for the site. Thus many web developers would name it main.css, or possibly styles.css. Some people like to name it default.css or site.css. When you have different projects, you will likely name the style files to match the project name. Look in the /css/ folder here to see examples.
  3. Note that a JavaScript library — such as Highcharts — often includes its own CSS file. Typically, that file is named after the library — highcharts.css, for example. Thus you should NOT name your personal CSS file the same name as a library you are using. It might create problems, later if not immediately.
  4. Your folder names in a web project should clearly indicate the contents of the folder. All images are typically inside a folder named /images/. The CSS files are often inside a folder named /css/. but (alternatively) may be inside a folder named /styles/. The JavaScript files are often inside a folder named /js/. but (alternatively) may be inside a folder named /scripts/.

As you continue learning and exploring other people’s projects, you will probably see folders named assets, modules, components, model, view — these will contain components that make the site or app work, rather than pure HTML files.


  • Filenames and folder names NEVER have spaces in them.
  • They contain no punctuation other than possibly an underscore or a hyphen.
  • Do not use uppercase letters in filenames or folder names.
  • All files have a file extension — .html, .css, .jpg, .png, etc.
  • The only dot in a filename is the one at the start of the file extension.

Follow the conventions, and your work will be easier!

If you want to ADD this course

A lot of students who wanted to take this course could not get in. It filled up in the beginning of April. There should be only 20 seats, but we raised the cap to 25 seats.

Since April 5, four students dropped, and four others were able to add. The course is still filled.

Students may drop this course until 11:59 p.m. on Friday, Aug. 25. If you want to join the course, you need to add it yourself, so just keep watching the UF registration system until Drop/Add ends.

IMPORTANT: If you hope to add the course, you MUST come to the first class meeting. I will be explaining a number of things about how to succeed in this course and what you will need. Also, all of you must read the official syllabus PDF file, which you can find here.

The first class meeting begins at 10:40 a.m. on Tuesday, Aug. 22, in Weimer 3032. 

NOTE that this class is offered ONLY in the fall semester. It will be offered again in fall 2018. Only students enrolled in Journalism, Advertising, Public Relations or Telecom may take this course.

Followup on Assignment 3

Here is a list of points to consider:

Observations from Assignment 3

Keep in mind that the header, footer, article, section, aside, and figure elements are always OPTIONAL. You do not need to use these. Use them if they make sense in your document structure.

Figure vs. img alone: Many people use the img element with just a p for the caption and attribution — without using figure and figcaption at all. Note that you may use figcaption ONLY inside a figure element. No figure? No figcaption! Using figure is OPTIONAL.

Box-sizing and the box model

This is an up-to-date article (brief) about the box-sizing property. It’s on a very good website for CSS tips and tricks. You might find some other good ideas there.

I showed this CSS in class:

p { 
	-webkit-box-sizing: border-box; 
	   -moz-box-sizing: border-box; 
	        box-sizing: border-box;
	width: 500px;
	padding: 20px 10px;

/* an alternative, if you don't need to worry about old browsers */ 

p { 
	box-sizing: border-box;
	width: 500px;
	padding: 20px 10px;

Robbins (p. 309) explains the box-sizing property.


You should use this CSS validator to check your CSS files.

You should continue using this HTML5 validator to check your HTML files.