There’s a lot we’re going to sort through on this first day of class. We’ll walk through the Web Design 1 and Web Design 2 syllabi as well as figure out the accounts and tools you’ll need to be able to be successful in the course.

But no coding today (ok a tiny bit), only getting your ducks-in-a-row with your workspace. Here’s the rundown:

Topics

Additional details for these topics can be found on the accounts and tools page if needed.

• Mac or PC with regular access;
• CUNY Academic Commons Account and Blog Author
• Reclaim Hosting – Domain Name and cPanel and File Manager Review
• Visual Studio Code – Customizing and Workflow Basics
• Google Chrome – default browser and extensions.

Tutorials

• Web Dev Bootcamp Tutorial Introductions and basics of the web/tools (videos 011 -018)
• Visual Studio Code Basics
• Visual Studio Code Customizing
• cPanel and File Manager Review
• CyberDuck FTP Client Setup

Problem Set

The following files/folders described in the Visual Studio Code Basics Tutorial (or follow description below) should be uploaded to your server as described in cPanel and File Manager Review and linked to in your post.

• design1 OR design2 folder
  • week1 folder
    • test.html
    • test.css

Visual Studio Code

the preferred text editor for writing code and managing projects

• Install Visual Studio Code to a desktop computer which you have regular access;
• Consider installing/reviewing my preferred extensions as well as favorite font – tutorial covering this process (to come);
• Review the basics of using VS Code with a tutorial (to come).
• Extensions list:
  • Live Server
  • Material Theme
  • Material Theme Icons
  • Prettier
• json of user settings if you want to do a quick copy-paste update: VSCode Command Palette => search “user settings” and select “Preferences: Open User Settings (JSON)” => overwrite JSON with below:

{
  "workbench.colorTheme": "Material Theme Darker",
  "workbench.iconTheme": "eq-material-theme-icons-darker",
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.wordWrap": "on",
  "editor.formatOnSave": true,
  "editor.fontSize": 14,
  "prettier.singleQuote": true,
  "editor.fontFamily": "Menlo, Monaco, 'Courier New', monospace",
  "[html]": {
    "editor.defaultFormatter": "vscode.html-language-features"
  }
}

For the Blog

Link to your design1 OR design2 folder on your server. Make sure this is linked text not a pasted URL in the text like this: https://makercommons.org/design1

Upload a screenshot of your developer environment. It should likely look something like this:

Describe your setup and comfort level with all the accounts and tools you’re being asked to setup and use. Review the accounts and tools list to make sure you cover everything.

Colt gives a basic description of how web browsers send ‘requests’ for webpages. Describe that process in a couple sentences – how a client talks to a server.