KEMBAR78
Build a Game with JavaScript - Thinkful DC | PDF
Build a Game with Javascript
July 2017
Wi-Fi: In3Guest
http://bit.ly/tf-js-game-dc
1
Instructor
Avi Zajac
Current Thinkful Student
TAs
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
2
About you
What's your name?
What brought you here today?
What is your programming experience?
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
3
About Thinkful
Thinkful helps people become developers or data scientists
through 1-on-1 mentorship and project-based learning
These workshops are built using this approach.These workshops are built using this approach.
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
4
Suggestions for learning
Don't treat this as a drill, we're making something realwe're making something real
Don't get discouraged, struggle leads to masterystruggle leads to mastery
Don't be shy, take full advantage of our supporttake full advantage of our support
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
5
This is what we're making
View example here
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
6
Agenda
Learn key Javascript concepts (30 min)
Go over starter code (10 min)
Build your site with our support! (30 min)
Go over answer key (10 min)
Steps to continue learning (10 min)
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
7
Defining a variable with Javascript
var numberOfSheep = 20
Initialize variable
Name of variable
Value of variable
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
8
Variable examples
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
9
Declaring a function with Javascript
function greet() {
return "Hello world!";
}
Initialize function Name of function
What the function does
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
10
Function examples
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
11
If/Else Statements
go to gas stationkeep driving
if false if true
need gas?
family roadtrip
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
12
If/Else Statements
function familyRoadtrip() {
if (needGas == true) {
getGas();
}
else {
keepDriving();
}
}
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
13
Comparing Values
== (equal to)
5 == 5 --> true
5 == 6 --> false
!= (not equal to)
5 != 5 --> false
5 != 6 --> true
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
14
If/Else Statements and Comparing Values
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
15
Parameters within functions
function adder(a, b) {
return a + b;
}
adder(1,2);
Parameters in declaration
Parameters used
within the function
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
16
Examples of parameters within functions
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
17
Real developers use Google... a lot
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
18
Glitch setup & first steps!
http://bit.ly/tf-guessing-game
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
19
Answers!
Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc
20
Ways to keep learning
More Structure
Less Structure
More SupportLess Support
21
325+ mentors325+ mentors with an average of
10 years of experience10 years of experience in the
field
22
Support 'round the clock
Your Mentor
Q&A Sessions
Career Coach
In-person Workshops
Slack
Program Manager
YouYou
23
Our DC results
93%93%job-placement rate + job guarantee
Zachary HoltZachary Holt
Link for the third party audit jobs report:
https://www.thinkful.com/bootcamp-jobs-https://www.thinkful.com/bootcamp-jobs-
statsstats
Junior Developer
Sierra GreggSierra Gregg
Software Engineer
JP EarnestJP Earnest
Web Developer
24
Take a tour!
Talk to me (or email tj@thinkful.com) if you're interested
Get a tour of the program to see if
project-based, online learning is a
good fit for you.
Discuss the curriculum,
mentorship, and how to create
your own learning schedule.
25

Build a Game with JavaScript - Thinkful DC

  • 1.
    Build a Gamewith Javascript July 2017 Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 1
  • 2.
    Instructor Avi Zajac Current ThinkfulStudent TAs Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 2
  • 3.
    About you What's yourname? What brought you here today? What is your programming experience? Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 3
  • 4.
    About Thinkful Thinkful helpspeople become developers or data scientists through 1-on-1 mentorship and project-based learning These workshops are built using this approach.These workshops are built using this approach. Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 4
  • 5.
    Suggestions for learning Don'ttreat this as a drill, we're making something realwe're making something real Don't get discouraged, struggle leads to masterystruggle leads to mastery Don't be shy, take full advantage of our supporttake full advantage of our support Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 5
  • 6.
    This is whatwe're making View example here Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 6
  • 7.
    Agenda Learn key Javascriptconcepts (30 min) Go over starter code (10 min) Build your site with our support! (30 min) Go over answer key (10 min) Steps to continue learning (10 min) Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 7
  • 8.
    Defining a variablewith Javascript var numberOfSheep = 20 Initialize variable Name of variable Value of variable Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 8
  • 9.
    Variable examples Wi-Fi: In3Guesthttp://bit.ly/tf-js-game-dc 9
  • 10.
    Declaring a functionwith Javascript function greet() { return "Hello world!"; } Initialize function Name of function What the function does Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 10
  • 11.
    Function examples Wi-Fi: In3Guesthttp://bit.ly/tf-js-game-dc 11
  • 12.
    If/Else Statements go togas stationkeep driving if false if true need gas? family roadtrip Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 12
  • 13.
    If/Else Statements function familyRoadtrip(){ if (needGas == true) { getGas(); } else { keepDriving(); } } Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 13
  • 14.
    Comparing Values == (equalto) 5 == 5 --> true 5 == 6 --> false != (not equal to) 5 != 5 --> false 5 != 6 --> true Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 14
  • 15.
    If/Else Statements andComparing Values Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 15
  • 16.
    Parameters within functions functionadder(a, b) { return a + b; } adder(1,2); Parameters in declaration Parameters used within the function Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 16
  • 17.
    Examples of parameterswithin functions Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 17
  • 18.
    Real developers useGoogle... a lot Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 18
  • 19.
    Glitch setup &first steps! http://bit.ly/tf-guessing-game Wi-Fi: In3Guest http://bit.ly/tf-js-game-dc 19
  • 20.
  • 21.
    Ways to keeplearning More Structure Less Structure More SupportLess Support 21
  • 22.
    325+ mentors325+ mentorswith an average of 10 years of experience10 years of experience in the field 22
  • 23.
    Support 'round theclock Your Mentor Q&A Sessions Career Coach In-person Workshops Slack Program Manager YouYou 23
  • 24.
    Our DC results 93%93%job-placementrate + job guarantee Zachary HoltZachary Holt Link for the third party audit jobs report: https://www.thinkful.com/bootcamp-jobs-https://www.thinkful.com/bootcamp-jobs- statsstats Junior Developer Sierra GreggSierra Gregg Software Engineer JP EarnestJP Earnest Web Developer 24
  • 25.
    Take a tour! Talkto me (or email tj@thinkful.com) if you're interested Get a tour of the program to see if project-based, online learning is a good fit for you. Discuss the curriculum, mentorship, and how to create your own learning schedule. 25