Code Editor: VS Code

Most of your time in this program will be spent in your code editor.

Code editors or IDEs(Integrated Developer Environments) come with features like syntax highlighting, code completion, and extensions that enhance the development workflow.

If you haven’t installed one yet, VS Code is the current industry favourite.

Install VS Code

If you’ve been using one you like, you can stick with it! Your instructors will be using VS Code.

Configuration

In the User Settings, make the following changes:

Set Editor: Tab Size to 2
Set Editor: Word Wrap to on

For more settings options, check out this link https://code.visualstudio.com/docs/getstarted/settings

Recommended Extensions

The following VS Code extensions will make you look cool in front of nerds:

Live Server
- Allows you to open vanilla HTML websites in the browser using a local web server.
Code Spell Checker
Prettier
Live Share

Git

Git will be a large component of this program for managing, sharing and deploying our source code.

Binary Installer for PC
Binary Installer for Mac (or find an alternate method if you’re feeling fancy)

GitHub

GitHub is a private corporation (now owned by Microsoft) that has built a world-leading community around Git. All sample code and projects will be hosted on GH and this program website is hosted using Git.

Create a GitHub account if you haven’t already. Don’t forget: your GH username will be seen by potential employers.
Watch and/or Star the program repository.
Sign up for GitHub Classroom to get your Student Developer Pack (handy free stuff)!

Slack for messaging

Slack is the preferred messaging tool for this program and is a popular tool in industry. You should see an invite to the SAIT WBDV Slack team sometime during orientation day.

Optional: Install Slack (web version available)
Tutorials: Slack 101

Note: The past cohorts of this program also have access to this Slack team but each cohort has a private channel. You’re free to meet and interact with past students of this program. You may also use MS Teams(channel name is WebDev Class-winter2024) if you’d like to avoid outside students (and your instructor(s)).

Firefox Browser

Regardless of which browser you prefer in your off-time, this course requires Firefox for its superior (for the moment) CSS Developer Tools. Chrome can be used for its Javascript Dev Tools in CPNT 262.

Install Firefox

The Mozilla Developer Network (the makers of Firefox) recently launched an entire Youtube channel to teach developers how to use Firefox Developer Tools (your best friend).