Skip to content

Instantly share code, notes, and snippets.

View ameseee's full-sized avatar

Amy Holt ameseee

  • Turing School of Software & Design
  • Denver, CO
View GitHub Profile

Gist Possibilities

Creating the Gist - OPTIONS

  • Students could fork your base template - but then anyone with the original could easily find each fork, just like a repo. Not sure how much we care, something to consider. Maybe we prefer that because it makes it easier for staff to keep track of them?
  • Students could copy and paste into a new Gist - we'd need to think through how we collect and store links, etc. if we care to access that at any given time?
  • Mod teams, you decide on the above bullet points! This is a PILOT, you can't really mess it up. The point is that we get some parts wrong and learn!
  • Speaking of Mod 1 students, this is what they get and do in Mod 0 related to Markdown and GitHub Gists.

Markdown Resources

You might want these as you design your template, and you might consider offering them to your students. Remember, let's keep it SIMPLE and not overwhelm them with resources. They are resourceful and can find more if needed!

Balancing Act

As a Front End Developer, you’re going to need to accurately build out the UI (User Interface) for websites based on comps provided by a designer. For your first project, you’ll re-create the Dashboard page of a small budgeting app to practice writing well structured, semantic HTML with clean, precise CSS, as well as take a first crack at adding some user interaction with JavaScript and the DOM.

Similar to what you might be asked to do on the job, we’ve given you the comps with a set of technical specs to go along with it and your challenge is to build it.

Note: DO NOT use CSS flexbox or grid for this project (If you don’t know what this is, no worries! You’ll learn more about these techniques in the coming weeks.)

Learning Goals

CSS Grid Challenges

Work to recreate each comp using CSS Grid. There are multiple pathways to a solution for each comp!

Level 1:

grid-1

Level 2:

grid-2

Digging In

After having some time to predict then play around with the code, answer these questions with your partner.

  1. What do you notice about the method that starts with self? When does it work? When doesn’t it? Why do you think that is?


class Hedgehog

  def initialize(name, age, allergies)
    @name = name
    @age = age
    @allergies = allergies
  end

 def invite_to_party

Iteration 1

Use TDD to create an Employee class that responds to the following interaction pattern:

pry(main)> require './lib/employee'
# => true

pry(main)> bobbi = Employee.new({name: "Bobbi Jaeger", age: "30", salary: "100000"})
# => #<Employee:0x00007fdfd48af848...>

Group Member 1 Name:

Group Member 2 Name:

GitHub Name your repo is under:

DM the person you passed your paper to your deployed FE

NOTE: For any ADD/UPDATE/DELETE actions, make sure to refresh the browser to ensure the change persists. Finding little holes in their app will be a huge help to your classmates!

What is Express?

Express is a small framework built on top of the web server functionality provided by Node.js. It helps to simplify and organize the server-side functionality of your application by providing abstractions over the more confusing parts of Node.js, and adding helpful utilities and features.

Why do we use Express?

Think about how and why we use jQuery on the front-end. Vanilla JavaScript can be verbose and difficult to read. jQuery came along to give developers a nicer-looking syntax to perform the same operations. It was a library built to abstract the trickier parts of JavaScript and make them easier to write and work with. Express was built for very similar reasons.

Just like browser-based JavaScript, the syntax for using the plain Node http library isn't the friendliest. Node gives you enough low-level features to build the back-end of an application, but Express is a light layer built on top of Node to make these low-level features a little easi

QS Rails Check-In

Please answer each question/prompt below in a PR (this could be your last PR from the night on Wednesday, October 3). Make sure to tag your instructor so we can easily respond and provide feedback! We will have 10-15 minutes to check in.

Instructor:

Deployed link:

Screenshot of CI builds (if all don't fit, include most recent):

Rails QS Submission PR

Instructions: In your final PR before the project is due, tag your instructor and include this template (completed) in the PR.

Instructor

Amy - @ameseee

Self Assessment

Please assess yourself for the following categories (above, meets, or below expectations). Provide rationale for your score for each category.