Day 198: UT Bootcamp, Harvard Comp Sci, Binary Game

It's been three days since I last wrote on my blog, I took two days off, and then on the third, I read two books about productivity, and they were fantastic, by an author name Cal Newton.  I recommend you check out that author, he's excellent.

So, back to coding, the UT Bootcamp assigned us a Harvard Computer Science class, CS50, to do before school starts.  I started on it today, and I'm going to have to divide my day into sections in order to move forward on both this and on the FCC curriculum.  Today, I started the day by watching the first lecture for the Harvard class, and I was inspired to create this:

It works great already, it took me about 3 hours to make, from start to finish!  In the lecture, the instructor uses software just like this to demonstrate binary to the students.  Check out the JavaScript:

$(document).ready(function() { 

var randomNumber = 1;
  
$('#goalNumber').html(generateNumber());

function generateNumber() {
  var randomNumber = Math.floor(Math.random() * 255) + 1;
  return randomNumber;
  }

$("#one").click(function() {
  toggleLights1();
})  
$("#two").click(function() {
  toggleLights2();
})  
$("#four").click(function() {
  toggleLights4();
})
$("#eight").click(function() {
  toggleLights8();
})
$("#sixteen").click(function() {
  toggleLights16();
})
$("#thirtyTwo").click(function() {
  toggleLights32();
})
$("#sixtyFour").click(function() {
  toggleLights64();
})
$("#oneTwentyEight").click(function() {
  toggleLights128();
})

$("#answerField").html(answerField)
  
//This toggles a lit and unlit light bulb image on and off.
function toggleLights1() { 
    if (counter1 === 0) {
    $("#one").attr("src", "http://i67.tinypic.com/epobyr.png");
    counter1 = counter1 + 1;  
    answerField = answerField + 1;
    $("#answerField").html(answerField);
    testTotal();
    }
    else {
    $("#one").attr("src", "http://i67.tinypic.com/5efxio.png");
    counter1 = counter1 - 1; 
    answerField = answerField - 1;
    $("#answerField").html(answerField);
    testTotal();
    }
  }
  
function toggleLights2() { 
    if (counter2 === 0) {
    $("#two").attr("src", "http://i67.tinypic.com/epobyr.png");
    counter2 = counter2 + 1;  
    answerField = answerField + 2;
    $("#answerField").html(answerField);
    testTotal();
    }
    else {
    $("#two").attr("src", "http://i67.tinypic.com/5efxio.png");
    counter2 = counter2 - 1; 
    answerField = answerField - 2;
    $("#answerField").html(answerField);
    testTotal();
    }
  }
  
  function toggleLights4() { 
    if (counter4 === 0) {
    $("#four").attr("src", "http://i67.tinypic.com/epobyr.png");
    counter4 = counter4 + 1;  
    answerField = answerField + 4;
    $("#answerField").html(answerField);
    testTotal();
    }
    else {
    $("#four").attr("src", "http://i67.tinypic.com/5efxio.png");
    counter4 = counter4 - 1; 
    answerField = answerField - 4;
    $("#answerField").html(answerField);
    testTotal();
    }
  }
  
  function toggleLights8() { 
    if (counter8 === 0) {
    $("#eight").attr("src", "http://i67.tinypic.com/epobyr.png");
    counter8 = counter8 + 1;  
    answerField = answerField + 8;
    $("#answerField").html(answerField);
    testTotal();
    }
    else {
    $("#eight").attr("src", "http://i67.tinypic.com/5efxio.png");
    counter8 = counter8 - 1; 
    answerField = answerField - 8;
    $("#answerField").html(answerField);
    testTotal();
    }
  }
  
   function toggleLights16() { 
    if (counter16 === 0) {
    $("#sixteen").attr("src", "http://i67.tinypic.com/epobyr.png");
    counter16 = counter16 + 1;  
    answerField = answerField + 16;
    $("#answerField").html(answerField);
    testTotal();
    }
    else {
    $("#sixteen").attr("src", "http://i67.tinypic.com/5efxio.png");
    counter16 = counter16 - 1; 
    answerField = answerField - 16;
    $("#answerField").html(answerField);
    testTotal();
    }
  }
  
   function toggleLights32() { 
    if (counter32 === 0) {
    $("#thirtyTwo").attr("src", "http://i67.tinypic.com/epobyr.png");
    counter32 = counter32 + 1;  
    answerField = answerField + 32;
    $("#answerField").html(answerField);
    testTotal();
    }
    else {
    $("#thirtyTwo").attr("src", "http://i67.tinypic.com/5efxio.png");
    counter32 = counter32 - 1; 
    answerField = answerField - 32;
    testTotal();
    }
  }
  
   function toggleLights64() { 
    if (counter64 === 0) {
    $("#sixtyFour").attr("src", "http://i67.tinypic.com/epobyr.png");
    counter64 = counter64 + 1;  
    answerField = answerField + 64;
    $("#answerField").html(answerField);
    testTotal();
    }
    else {
    $("#sixtyFour").attr("src", "http://i67.tinypic.com/5efxio.png");
    counter64 = counter64 - 1; 
    answerField = answerField - 64;
    $("#answerField").html(answerField);
    testTotal();
    }
  }
  
  function toggleLights128() { 
    if (counter128 === 0) {
    $("#oneTwentyEight").attr("src", "http://i67.tinypic.com/epobyr.png");
    counter128 = counter128 + 1;  
    answerField = answerField + 128;
    $("#answerField").html(answerField);
    testTotal();
    }
    else {
    $("#oneTwentyEight").attr("src", "http://i67.tinypic.com/5efxio.png");
    counter128 = counter128 - 1; 
    answerField = answerField - 128;
    $("#answerField").html(answerField);
    testTotal();
    }
  }

// This sets the "You Win" text to be hidden until the player matches the total with the target number. 
$("#youWin").hide();  
  
function testTotal() {
  if ($("#goalNumber").html() === answerField.toString() ) {
    $("#youWin").show(); 
  }
}

}); //closing jQuery

var counter1 = 0; 
var counter2 = 0;
var counter4 = 0;
var counter8 = 0;
var counter16 = 0;
var counter32 = 0;
var counter64 = 0;
var counter128 = 0;

var answerField = 0;

Here's what happens when you win:

Okay, that was fun, now I'll continue with the lecture!

All right, I finished the first lecture, going through the second lecture now.

All right, I'm done with both lectures.

They were amazing.  Moving on to the walkthroughs (a series of short videos), then the shorts (a series of videos a little bit longer), and then the first problem set, problem set 0.

SUMMARY OF CODING SKILLS 

Books:                                                                                               Status
"Head First HTML and CSS," by E. Robson & E. Freeman                      Complete

"A Smarter Way to Learn JavaScript," by Mark Myers                          Complete

"HTML and CSS," by Jon Duckett                                                        Complete

"JavaScript and JQuery," by Jon Duckett                                            Complete

Team Treehouse (Front End Web DevTrack Complete):                     Status

How to Make a Website                                                                     Complete

HTML                                                                                                Complete

HTML Forms                                                                                      Complete

HTML Tables                                                                                     Complete

HTML Video and Audio                                                                       Complete

CSS Foundations                                                                                Complete

CSS Basics                                                                                         Complete

CSS Layout Techniques                                                                      Complete

CSS Layout Basics                                                                              Complete

CSS Selectors                                                                                     Complete

Responsive Layouts                                                                            Complete

CSS Flexbox Layout                                                                            Complete

Git Basics                                                                                          Complete

Console Foundations                                                                          Complete

Introduction to Programming                                                              Complete

JavaScript Basics                                                                               Complete

JavaScript Loops, Arrays, & Objects                                                   Complete

AJAX Basics                                                                                       Complete

JQuery Basics                                                                                    Complete

Interactive Web pages with JavaScript                                               Complete

Object-Oriented JavaScript                                                                Complete 

Accessibility                                                                                      Complete

Website Optimization                                                                        Complete

Front End Performance Optimization                                                  Complete

Aesthetic Foundations                                                                        Complete                 

Design Foundations                                                                            Complete  

Adobe Photoshop Foundations                                                            Complete

Adobe Illustrator Foundations                                                      66% Complete

Other Courses:                                                                                     Status

HTML and CSS (Codecademy)                                                               Complete

Introduction to Web Dev (The Odin Project)                                         Complete

Web Dev 101 (The Odin Project)                                                    33% Complete

Free Code Camp (FCC)                                                                           Status

1. Get Started with Free Code Camp                                                     Complete

2. HTML5 and CSS                                                                                 Complete

3. Responsive Design with Bootstrap                                                      Complete

4. Gear up for Success                                                                          Complete
5. jQuery                                                                                             Complete
6. Basic Front End Development Projects                                              Complete
7. Basic JavaScript                                                                                Complete
8. Object Oriented and Functional Programming                                    Complete
9. Basic Algorithm Scripting                                                                   Complete
10. JSON API's and Ajax                                                                         Complete
11. Intermediate Front End Development Projects                                  Complete

12. Intermediate Algorithm Scripting                                                     Complete

13. Advanced Front End Development Projects                                       On 4 of 6

14. Claim Your Front End Development Certificate

15. Automated Testing and Debugging
16. Node.js and Express.js
17. Git
18. MongoDB
19. API Projects

20. Dynamic Web Application Projects

21. Claim Your Back End Development Certificate

The Coding Boot Camp at UT Austin                                               Status (starts 4/19/2016)
Week 1-6: Mastering the Browser (HTML, CSS, JavaScript, JQuery) 

Week 7-10: API & JSON (RESTful API"s, parsing JSON, AJAX)

Week 11-14: Server Side (Node.js, MySQL, MongoDB)

Week 15-18: PHP (WordPress, CodeIgniter, Laravel) 

Week 18-21: Full Stack Coding
Week 22-24: Final Project

CodePen: http://codepen.io/Adancode/

GitHub: https://github.com/Adancode

LinkedIn: https://www.linkedin.com/in/adamcamacho1
Team Treehouse: https://teamtreehouse.com/adamcamacho
Free Code Camp: http://www.freecodecamp.com/adancode

Hours Spent Coding Today: 5.5

Total Hours Coding: 1,027.5