← All projects/1 - Introductory Course/Getting started - Tooling

Guide: Getting started - Tooling

Description

Code Editor

A code editor is the main tool in a web developer's toolbelt. In modern times it's not only the tool you'll be writing the code in but it's also the ecosystem that will be helping you go through the complex modern development environment, with it's built-in features and plugins. In this Guide you should install and get acquainted the main code editor we'll be using in the course: VSCode.

Accounts

As a web developer you will need to have online tools to help on your work. To start with, create an account on Github, Repl.it and Glitch, and read up on them.

Github hosts code you create with Git, and we will be using it to deliver almost all work to be done throughout the course.

Both Repl.it and Glitch will allow you to create quick, working prototypes (demos) in HTML, CSS and Javascript and other programming languages.

Terminal

The terminal is a software that allows you to run scripts and different kinds of software just by typing their names and some options in a command line. It will prove very useful in your day-to-day life as a web developer.

Git

Git is a versioning system that widely used to keep track of different code versions (so that it is clear what changed with each iteration). Github is a company that makes use of this technology to host many Git repositories. Learning Git is paramount when dealing with code both because it organizes the workflow and because it makes it very easy to collaborate and share your work.

Markdown

Markdown is a way to write rich text with only a simple editor. It is going to be used in every project in this course to create a README.md file, which should contain relevant information about that work. Markdown can also used to manage the content of  websites that don't rely on the use of databases for such.

Knowledge

  • Understand what a code editor is
  • Understand what code versioning is

Skills

  • Be able to use a code editor (create code files, save them)
  • Be able to install and use supporting tools for the code editor
  • Be able to create quick code prototypes online
  • Be able to use Git for code hosting and versioning
  • Be able to write a document in Markdown format

Topics

  • VSCode
    • Extensions
      • Prettier
      • Live Server
      • GitLens
      • Polacode
  • Accounts: Github, Repl.it and Glitch
  • Terminal
    • VSCode Terminal
  • Git
  • Markdown

Action Points

  • Install VSCode
  • Add a folder (workspace) to VSCode , then create and save files in it
  • Look up and play with some VSCode Extensions (Prettier, Live Server, GitLens, Polacode)
  • Create an account on Github, Repl.it and Glitch

Deliverable: Nothing

Every guide has a deliverable attached to it, but this one is an exception. We are just warming up, so you don't need to deliver anything just yet. Nonetheless, here are some pointers you should try and accomplish:

  • Create accounts on Github, Repl.it and Glitch
  • Install VSCode and create a project (Workspace) in it
  • Learn how to use the Terminal to navigate the file structure of your computer and to execute commands (e.g. list files in directory)
  • Create a Git repository, on Github, from the command line (Terminal). It can contain just dummy text files but why not create a little HTML + CSS Project? (See the Concepts Guide)
    • Create a README.md file in your Git repository using Markdown (try creating a title, a paragraph, a list…)

Classes

Resources