Return To CS 100 Home

Colour Theme   Font Size Options
 
   
   
   

Starting Files

This exercise will take you through the process of starting a Replit lab and identifying, editing, and viewing your files.

Video Summary


To begin, were going to need some starting files. If you haven't already, log into Replit, go to the teams tab, and start the Lab 1 project. You should see the following files:
  1. A file named README.md. This file contains instructions on what we will be for the lab so you don't have to switch between two pages constantly
  2. Two HTML Pages. HTML pages are the pages that actually display when you open a website. Right now, most of them aren't connected to each other, but you'll fix that later.

    • index.html will be your homepage. By default, a page named index is always the homepage of every website

    • practice.html will be the page you start your checkpoint exercises on.

  3. A stylesheet file. Stylesheets determine the design and format of an HTML page. They are not directly visible when you open a webpage

    • default.css will be a starting stylesheet with a number of styling options already defined, such as colours and backgrounds

  4. A picture. Pictures can come in a number of formats. It is important to know what format your picture is saved as when you try to use it on a page

    • smile.gif is saved as a .gif type. GIF files typically have reduced colour quality, taking up less space


Viewing your pages

You are able to view your pages using the Replit previews. We'll start with the homepage, index.html. To view the page, click the run button. It should look like this:

Screenshots of the default homepage.  It has the title Welcome to John Smith's Home Page

You will notice the default name on the page is "John Smith." Since it is unlikely that this is actually your name, we are going to need to change it in the next section.