Skip to content

Instantly share code, notes, and snippets.

@robertorodriguez12
Last active August 12, 2020 00:49
Show Gist options
  • Save robertorodriguez12/c03ea76c2149d142feab9486129b7d86 to your computer and use it in GitHub Desktop.
Save robertorodriguez12/c03ea76c2149d142feab9486129b7d86 to your computer and use it in GitHub Desktop.

B2 Intermission Work

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

HTML

  1. What is HTML?
  • HTML stands for Hyper Text Markup Language and is the standard markup language for creating web pages. It also describes the structure of a web page.
  1. What is an HTML element?
  • An HTML element is defined by a start tag, content and then the end tag. For example <h1>My First Heading</h1>
  1. What is an HTML attribute?
  • HTML attributes provide additional information about elements. Attributes usually come in a name/value pair. for exmple name="value".
  1. What is the difference between a class and an id? When would you use one vs. the other?
  • The main difference between a class and an ID is that the ID can be used to identify one element, a class on the other hand can be used to identify more than one.
  1. What HTML would you write to create a form for a new dog with a "name" and an "age"?
  • <form> is likely the HTML element you'd want to use.
  1. What are semantic tags? When would you use them over a div?
  • Semantic tags clearly describe what it is doing to both the browser and developer. AN example of a semantic tag is , , and . These tags clearly define the contents. You would use a semantic tag over a DIV tag when you want to describe exatly what the contents of that area are.
    1. Explain what each of the following HTML tags do and when you would use them:
    • <h1>, <h2>, etc.: <h1> and <h2> are header tags, you would use these when you show new titles. Similar to the #in markdown.
    • <p>: this represents a paragraph
    • <body>: this defines the document's body. The best way I can compare it to something I already know, is similar to the def/end for methods.
    • <a> and the href attribute: The tag defines a hyperlink and the href specifies the URL. an example is Visit W3Schools
    • <img> and the src attribute: is used to embed an image in an HTML page, the src secifies the path to the image.
    • <div>: defines a section in an HTML document.
    • <section>: this defines a section in an HTML document.
      is a semantic way of describing what it is.
    • <ul>, <ol>, and <li>
        • : is an unordered bulleted list.
          1. : this is an ordered ist, it can be numerical or alpabetical.
          2. : this defines a list item. This is usually used inside of a
              or
          3. <form>: this tag is used to create an HTML form for user input. It can contain several different elements such as , , etc...
          4. <input>: This tag specifies an area where the user can enter data.

        CSS

        1. What is CSS?
        • CSS is a language that describes the style of an HTML document. It describes how HTML elements should be displayed.
        1. What is a CSS selector? How do you use the ID selector? The class selector?
        • The CSS selector points to the HTML element that you want to style. To use the ID selector, you want to write a hash character followed by the id of the element. for example #para1 ( this selects the para1 id). To use the class selector you add a "." before the class name. For example .center
        1. What are the three ways to include CSS in your HTML documents? What are the pros and cons of each?
        • External CSS: with an external style sheet, you can change the look of an entire website by changing just one file. Each HTML age must include a reference to the external style sheet file inside of their link element in the head section. A downside is that you cannot include any HTML tags within it. This can be created in a text editor but must be saved with a .css ending.
        • Internal CSS: The internal CSS style may be used if one single HTML page has a unique style. Downside is, the changes need to be made to every HTML page if you have multiple.
        • Inline CSS: This is used to apply a unique style for a single element within the HTML page.
        1. What is the Box Model? Describe each component of the Box Model.
        • The box model is used when talking about the design and layout of an HTML page, the diferent elements within the box model are:
          • Margins: This is an area outside of the border of the page, it's basically the white space between the page end and the border of the content.
          • Border: A border goes around the padding and the content.
          • Padding: Padding is transparent, it is similar to the margins, however this is for between the content and border.
          • Content: The actual content of the box, text, images, etc...

        SQL

        Jumpstart Lab Tutorial

        1. What is a database? The core of every web application. A database is a means of storing, fetching, calculating and sorting data.
        2. What is SQL? SQL is a structured query language and it is how we interact with different databases.
        3. What is SQLite3? stores the data in a plain text file, This makes it more accessible, easier to move, rename, delete and transfer between databses.
        4. What is a Table? A table is used to store data in a database. Each talbe contains multiple colums that is associated with different data types.
        5. What is a primary key? A field in a talbe which uniquely identifies each row/record in a database table.
        6. What is a foreign key? A foreign key is used to link two tables together.
        7. Explain what each of the following SQL commands do:
        • insert: Inserts new data in to the database
        • select: Extracts data from a database
        • where: This is used to filter records and extract those that fulfill a specified condition.
        • order by: This keyword is used to sort the result-set in ascending or descending order.
        • inner join: This selects records that have matching values in both tables.

        PG Exercises

        1. How can you limit which columns you select from a table?
        • You can limit which colums you select from a table by selecting only the ones that you need. Instead of doing SELECT * FROM table_name you can do SELECT column1, column2, column3 FROM table_name.
        1. How can you limit which rows you select from a table?
        1. How can you give a selected column a different name in your output?
        • You can use a form of SQL SELECT AS to rename columns in your query results.
        1. How can you sort your output from a SQL statement?
        • Order by is one way to sort the output from a SQL statement. The order by sorts the data in asending order, but there are other ways of sorting your data.
        1. What is joining? When do you need to join?
        • Joining allows you to combine records from two different tables.
        1. What is an aggregate function?
        • An aggregate function performs a calculation on a set of values and returns a single value.
        1. List three aggregate functions and what they do.
        • Count: counts how many rows are in a particular column
        • Sum: Adds together all the values in a particular column
        • Min: returns the lowest values in a particular column.
        1. What does the group statement do?
        • 'group' groups the results of one or more columns.
        1. How does the group statement relate to aggregates?
        • The 'group' statement relates to aggregates such as (count, mas, min, sum, avg, etc..) in a manner to group the result set by one or more columns.

        Rails Tutorial: Task Manager

        1. Define CRUD.
        • Create, read, update and delete, this refers to the SQL build process for applications.
        1. Define MVC.
        • MVC is model view controller, it is a software design pattern that is usually used for developing user interfaces.
        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.
        • A task controller, methods to create or gain access to those tasks, HTML pages to depict what you want.
        1. What are params? Where do they come from?
        • Params are paramaters that come specifically from what is being passed to the application controller via a GET or POST request.
        1. Check out your routes. Why do we need two routes each for creating a new Task and editing an existing Task?

        Deliverables

        1. Copy and Paste the link to your Static Challenge repo here
        2. Copy and Paste the link to your Task Manager repo here
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment