Skip to content

Instantly share code, notes, and snippets.

@MylesNottingham

MylesNottingham/mod_2_intermission.md

Last active May 4, 2023 22:26
Show Gist options
  • Save MylesNottingham/2620e50fe93906b70772b39ef2b51e02 to your computer and use it in GitHub Desktop.
Save MylesNottingham/2620e50fe93906b70772b39ef2b51e02 to your computer and use it in GitHub Desktop.
Download ZIP
Mod 2 Intermission Work
Raw
mod_2_intermission.md

B2 Intermission Work

Answer these Check for Understanding questions as you work through the assignments.

HTML

  1. What is HTML?
    Hyper-Text Markup Language
  2. What is an HTML element?
    Everything from a start tag to an end tag
  3. What is an HTML attribute?
    Attributes are defined in the start tag of an element and they provide additional information about the element.
  4. What is the difference between a class and an id? When would you use one vs. the other?
    A class name can be used by multiple elements while an ID can only by used by one. When you want to manipulate a single element vs multiple elements.
  5. What HTML would you write to create a form for a new dog with a "name" and an "age"?
<h3>Dog Generator</h3>

<form action="/dog_generator.php">
  <label for="name">Name:</label><br>
  <input type="text" id="name" name="name" placeholder="Zoe"><br>
  <label for="age">Age:</label><br>
  <input type="text" id="age" name="age" placeholder="10"><br><br>
  <input type="submit" value="Generate Dog">
</form>
  1. What are semantic tags? When would you use them over a div?
    Semantic tags describe their content. When you want to organze your web data in a way that gives both browsers and people a better understanding of the content.
  2. Explain what each of the following HTML tags do and when you would use them:
  • <h1>, <h2>, etc.
    Headings. Used to define title or subtitle sections of a page.
  • <p>
    Paragraph. Used to define an individual block of -typically- text.
  • <body>
    Body. Used to define the main content of a page.
  • <a> and the href attribute
    Hyperlink. Used to connect to another section of the page or a different site entirely.
    "href" is the link destination.
  • <img> and the src attribute
    Image. Used to define an image on the page.
    "src" is the source of the image.
  • <div>
    Division. A block level element usually used as a container for other elements.
  • <section>
    Section. Used to define a section in a document, typically with a heading.
  • <ul>, <ol>, and <li>
    Unordered List, Ordered List, and List Item. Used to define a list and the items on that list.
  • <form>
    Form. Used to create an HTML form for user input.
  • <input>
    Input. Element nested inside of the form to collect user input.

CSS

  1. What is CSS?
    Cascading Style Sheets. A seperate file that contains all of the style data for an html site.
  2. What is a CSS selector? How do you use the ID selector? The class selector?
    The selector points to the HTML element you want to style. To use the ID Selector you use the element ID prefaced with a hash character as the selector and write your declaration block as usual after that. To use the Class Selector you use the element class prefaced with a period character as the selector and write your declaration block as usual after that. You can also add the element type before the period to only style those elements in the class.
  3. What are the three ways to include CSS in your HTML documents? What are the pros and cons of each?
    External: Can style multiple sites with single file / need to create seperate file and link. Internal: Can style entire sheet in one place and has priority over external if written correctly / limited to the file it was written in. Inline: Highest priority so will override any other styles and useful for styling single elements / can only be used on a single element and so is a lot of work to implement for whole page.
  4. What is the Box Model? Describe each component of the Box Model.
    It is the idea that every HTML element is wrapped in a box.
  • Content: Where the actual data appears.
  • Padding: Transparent area between the content and the border.
  • Border: Area that wraps around the padding, separating it from the margin.
  • Margin: Final transparent area that wraps around the border.

SQL

Jumpstart Lab Tutorial

  1. What is a database?
    A means of storing, fetching, calculating, and storing data.
  2. What is SQL?
    Structured Query Language. A programming language used to interact with databases.
  3. What is SQLite3?
    A database engine that is good for experimenting and comes with MacOS.
  4. What is a Table?
    A collection of related data organized into rows and columns.
  5. What is a primary key?
    A column or a combination of columns that uniquely identifies each row in a table.
  6. What is a foreign key?
    A column or a combination of columns that is used to establish a link between the data in two tables. It creates a relationship between the tables based on the values in the columns and ensures referential integrity between the tables. The foreign key in one table refers to the primary key of another table to establish this relationship.
  7. Explain what each of the following SQL commands do:
  • insert
    Used to add new rows of data into a table
  • select
    Used to add new rows of data into a table
  • where
    Used to filter records based on a specified condition or set of conditions
  • order by
    Used to sort the result set in ascending or descending order based on one or more columns
  • inner join
    Used to combine rows from two or more tables based on a related column between them

PG Exercises

  1. How can you limit which columns you select from a table?
    With the SELECT clause
  2. How can you limit which rows you select from a table?
    With the WHERE clause
  3. How can you give a selected column a different name in your output?
    By adding AS after the SELECT clause
  4. How can you sort your output from a SQL statement?
    With an ORDER BY clause
  5. What is joining? When do you need to join?
    When you combine rows from two or more tables. When you want to use related data from multiple tables.
  6. What is an aggregate function?
    Aggregate functions in SQL operate on a column of values and return a single value as the output
  7. List three aggregate functions and what they do.
  • Count: Returns the numner of rows in a table matching a specified condition.
  • Sum: Returns the sum of a column of numeric values.
  • Max: Returns the maximum value in a column of values.
  1. What does the group statement do?
    The GROUP BY statement in SQL is used to group the result set by one or more columns.
  2. How does the group statement relate to aggregates?
    GROUP BY can be used in combination with aggregate functions to calculate summary statistics for each group.

Rails Tutorial: Task Manager

Copy and Paste the link to your Task Manager repo here:
https://github.com/MylesNottingham/task_manager
Copy and Paste the link to your Static Challenge here:
https://github.com/MylesNottingham/static_challenges

  1. Define CRUD.
    CRUD stands for Create, Read, Update, and Delete, which are the four basic operations used in relational databases and web applications to manage data.
  2. Define MVC.
    MVC stands for Model-View-Controller, which is a software design pattern that separates an application into three interconnected components:
  • The Model: Represents the data and business logic
  • The View: Displays the data to the user
  • The Controller: Handles user input and updates the model and view accordingly
  1. What three files would you need to create/modify for a Rails application to respond to a GET request to /tasks, assuming you have a Task model.
  • config/routes.rb
  • app/controllers/tasks_controller.rb
  • app/views/tasks/index.html.erb
  1. What are params? Where do they come from?
    "params" are Ruby objects created by Rails that allow us to access and manipulate data inside of our application.
  2. Check out your routes. Why do we need two routes each for creating a new Task and editing an existing Task?
    We use "post" to create and "patch" to modify.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment