Skip to content

madycakes/mouse-be-gone

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

19 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Mouse Be Gone!

Purpose

To see how good you are without the mouse!

Rules

  • No mouse/trackpad use!
  • Keyboards only!
  • Ordered lists should be done in order
  • Unordered lists can be done in any order
  • You may use Google for help but only if you use your keyboard

How To Play

  1. fork this repo
  2. copy the clone link

~ FROM THIS POINT ON YOU ARE NOT ALLOWED TO USE YOUR MOUSE ~

~ FROM THIS POINT ON YOU ARE NOT ALLOWED TO USE YOUR MOUSE ~

~ FROM THIS POINT ON YOU ARE NOT ALLOWED TO USE YOUR MOUSE ~

Don't forget to commit your work often!

  1. Open your terminal
  2. Change directory to the project folder
  3. Clone the repository
  4. Open the project in your text editor
  5. Complete each of the tasks below

Good luck!

Tasks

Level One (Let's Get It Started!)

Set Up

  1. Create a new branch called omega
  2. Checkout to a new branch called alpha
  3. Check to see you have three branches
  4. Run live-server

HTML

  1. Find index.html
  2. Move index.html to the correct directory
  3. Reload your live-server page

CSS

  1. Find styles.css
  2. Move styles.css to the correct directory
  3. Link styles.css to the project

I MESSED UP!

  1. Commit your code
  2. Checkout to master
  3. Delete the alpha branch
  4. Checkout to a new alpha branch

Check Yourself

  • make sure your webpage says Hello World!
  • make sure your background-color is not white

Level Two (Keep It Going!)

Set Up

  1. Commit and push your code to GitHub
  2. From the alpha branch create a new branch called beta
  3. Run live-server

HTML

  1. Change the title of the website
  2. Create a div element with an id
  3. Create a div element inside the first div with no id or class identifiers

CSS

  • give the first div a different background-color
  • give the second div a different background-color and border

Javascript

  1. Make a new folder called js
  2. Copy the app.js into js
  3. Link app.js to the project
  4. Using ONLY Javascript inside of the second div add the phrase My name is ENTER_YOUR_NAME_HERE!

Bash

  • smoke test your application

I Messed Up!

  1. Commit your code
  2. Checkout to alpha
  3. Delete the beta branch
  4. From your alpha checkout to a new beta branch

Check Yourself

  • make sure you have 2 divs of different colors
  • make sure your webpage console is logging Hello World!
  • make sure the second div says your name

Level Three (Final Round!)

Setup

  1. Commit your code and push to GitHub
  2. Checkout to the omega branch
  3. Merge your beta branch into your omega branch
  4. Run live-server

Javascript

  1. make a new folder in js called app
  2. create a file called index.js in the app folder
  3. copy the contents of app.js into index.js (COMMAND LINE ONLY!)
  4. replace the contents of app.js with the following: var app = require('./index');

Bash

  1. Create a project folder outside of the Mouse Be Gone! folder
  2. Copy all of the contents from the Mouse Be Gone! repo into the new repo using ONE line of code in your terminal

I Messed Up!

  1. Commit your code
  2. Checkout to master
  3. Delete the omega branch
  4. From your master branch checkout a new omega branch
  5. Merge your beta branch into your omega branch

Check Yourself

  • make sure app.js only has one line of code
  • make sure your webpage console is logging Hello World
  • make sure all of your background-color changes carried over from the original directory

End

If you made it this far CONGRATULATIONS!!!

You are an awesome keyboard ninja!

Stretch Goals

  1. In your project folder initialize a new git repo
  2. Create a new repository on GitHub (you may need to use your mouse/trackpad)
  3. Link the new git repo on your computer to your new GitHub repository

About

How good is your keyboard-fu?

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • HTML 65.0%
  • CSS 21.1%
  • JavaScript 13.9%