SYST10049 Web Development:Worksheet 1

Prev

Next

1. Familiarize yourself with Slate

1.1. SLATE —provides links to all material. Explore and familiarize yourself with the various menus (SLATE Help, Course Outline, Content, Assessments ( check out this link: Formative & Summative Evaluation), Communication, Management, Resources, IT Services, Library Services).

1.2. Sheridan Course Outline SYST10049 Web Development —read through... what are the Course Critical Performance and Learning Outcomes? What is the Evaluation Plan? what are the School of Applied Computing's Academic Procedures for Evaluations?

1.3. Course Material —provides links to course information, course content, topical outline, worksheets, and activities.

1.4. Class Plan Information — Classroom and Evaluation Policies — How evaluation works — Formative & Summative Evaluation — Getting the most out of your education — How do I get an A in (any) course? — Active learning — Learning course content — Learning for mastery, not grades

1.5. Contact information (Prof. Ellen Bajcar)

1.6. Important Dates
Sept. 5 - Dec. 15 Fall Term. See full calendar: Academic calendar
Sep. 4 Statutory Holiday – Labour Day (College Closed)
Oct. 9 Statutory Holiday – Thanksgiving (College Closed)
Oct. 23 - Oct 27 Reading Week - No Scheduled Classes for Most Programs
Nov. 24 Last Day to Drop a Class without academic penalty
Dec. 15 End of Fall Term

1.7. ✔ IT Help Desk is able to assist you. They are available by phone at 905-845-9430.

2. Prepare working environment

  1. Laptop environment: Windows • Dig deeper: Computing Requirements for Laptop Learning Programs
  2. Text Editor VS Code (or Notepad++) • Dig deeper: What text editors are available? (MDN web docs)
  3. Web browser: Google Chrome (or Mozilla Firefox) • Dig deeper: Browsing websites (MDN web docs)
  4. Local workspace: • organize your project file storage in C:\public_html\syst10049
  5. Diagrams (hierarchy, wireframe): https://app.diagrams.net/
  6. Photo editor: Adobe, Paint, Photofitre, or one you may be familiar with.
  7. Developer's tools: Chrome > Right-click > Inspect (or F12) • Dig deeper: What are browser developer tools? (MDN web docs)
  8. HTML validator: https://validator.w3.org/
    CSS validator: https://jigsaw.w3.org/css-validator/
  9. WAVE Web Accessibility Evaluation Tool: https://wave.webaim.org/
  10. Lorem ipsum (dummy) text generators https://lipsum.com/ "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters,... making it look like readable English." This site also provides images that can be used as placeholders, for the same reason.
  11. SFTP to transfer files between client and server FileZilla client (or WinSCP client)
  12. cPanel access to dev.fast.sheridanc.on.ca To request/reset password tech.fast.sheridanc.on.ca/ (Services > LAMP/Git). Information for Hostname, Web URL, cPanel URL, FileZilla setup, WinSCP setup, username and password info.
  13. Protect assignments directory: All assignments must be published and password-protected. More instructions coming soon.

3. Read and explore course material

3.1. Review (or catch up) concepts of directories and files.
Helpful video series "Computer Skills Course: File Managmeent" by Dane Hartman
3.2. Read and study the following articles (web pages)
3.3. Formulate your own answers to the following:
  1. Describe the web ecosystem. What components comprise this ecosystem? What are the major computer components and how they work?
  2. What technologies are you learning in this course? Why start with HTML and CSS? What other technologies are you likely to work with?
  3. What is the purpose of a web browser? Describe what happens when a user requests a web page.
  4. Describe how the browser processes an HTML document. Is there a difference in the process when the file is retrieved using FILE protocol and HTTP protocol?
  5. Describe what happens when you enter "sheridancollege.ca" in the browser's address area. What is the name of the file that you are requesting?
  6. What is a directory? What is a file?
  7. Describe how the files for a web project are organized.
  8. How do you name files and directories? What are naming conventions?
  9. Given the following URL , identify each part
    https://www.testing.server:8080/projects/trees/index.html
    1. Name of file being requested
    2. first directory name in the path
    3. last directory name in the path
    4. Authority
    5. Protocol
    6. Port
    7. Server name
    8. Path to file