SlideShare a Scribd company logo
1 of 23
Download to read offline
Build an App with Javascript & jQuery
August 2017
WIFI: TGS guest
Pass: tgsvisitor384
http://bit.ly/thinkful-jquery-app
1
Instructor
TAs
Jasjit Singh
Thinkful Atlanta General Manager
Self-taught developer
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
2
About you
What's your name?
Why do you want to learn JavaScript/jQuery?
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
3
About Thinkful
Thinkful helps people become developers or data scientists
through one-on-one mentorship and project-based learning
These workshops are built using this approach.
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
4
Suggestions for learning
Don't treat this as a drill, we're making something real
Don't get discouraged, struggle leads to mastery
Don't be shy, take full advantage of our support
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
5
This is what we're making
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
6
Agenda
Go over starter code (10 min)
Learn key jQuery & Javascript concepts (30 min)
Build your app! (30 min)
Go over solutions (10 min)
Next steps (10 min)
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
7
Quick HTML/CSS Refersher
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
8
Starter code walkthrough
http://bit.ly/tf-shopping-list
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
9
Think of our HTML as a "tree"
<form>
list-content
<input>
item-input
<ul>
shopping-list
<button>
add-item
WiFi: TGS Guest
Pass: tgsvistior384 10
bit.ly/thinkful-jquery-app
What is Javascript? What is jQuery?
<input>
<ul>
shopping-list <button>
<li>
String
cheese
<li>
Summer
sausage
<li>
Chicken
nuggets
11
<div>
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
"Grabbing" a section directly
$('.shopping-list')
jQuery always starts with this
Element to grab
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
12
jQuery walkthrough
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
13
Attaching an "Event Listener"
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
14
Real developers use Google... a lot
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
15
Let's work on the first step together
http://bit.ly/tf-shopping-list
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
16
Solution
WiFi: TGS Guest
Pass: tgsvistior384 bit.ly/thinkful-jquery-app
17
Ways to keep learning
18
For aspiring developers, bootcamps fill the gap
19
87%87%
job-placement rate + job guarantee
Link for the third party audit jobs report:
https://www.thinkful.com/bootcamp-jobs-statshttps://www.thinkful.com/bootcamp-jobs-stats
Thinkful's track record of getting students jobs
20
Our students receive unprecedented support
Your Mentor
Q&A Sessions
Career CoachSlack
Program Manager
YouYou
Local Community
21
Mentorship enables flexible learning
Learn anywhere,
anytime, & at your own
pace
You don't have to quitYou don't have to quit
your job to startyour job to start
career transitioncareer transition
22
Thinkful Two-Week Trial
Talk to one of us and email jasjit@thinkful.comjasjit@thinkful.com to learn more
Two-week course with 6 mentor
sessions for $50 ($750 value)
Start with HTML, CSS and JavaScript
Option to continue with full bootcamp
Financing & scholarships available
Offer valid for one week after eventOffer valid for one week after event
Jasjit SinghJasjit Singh
GM, Atlanta
23

More Related Content

What's hot

Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408Justin Ezor
 
Build a Web App with JavaScript & jQuery
Build a Web App with JavaScript & jQueryBuild a Web App with JavaScript & jQuery
Build a Web App with JavaScript & jQueryThinkful
 
Js tests like a pro
Js tests like a proJs tests like a pro
Js tests like a pro500Tech
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-128-133-443 (1)
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-128-133-443 (1)Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-128-133-443 (1)
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-128-133-443 (1)Justin Ezor
 
Accessible client side routing - Nick Colley
Accessible client side routing - Nick ColleyAccessible client side routing - Nick Colley
Accessible client side routing - Nick ColleyFrontEnders
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408 (1)
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408 (1)Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408 (1)
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408 (1)Justin Ezor
 
casestudypinterest
casestudypinterestcasestudypinterest
casestudypinterestDave Green
 
Deck 6-80-140-196-213-271-321-364-438 (1)
Deck 6-80-140-196-213-271-321-364-438 (1)Deck 6-80-140-196-213-271-321-364-438 (1)
Deck 6-80-140-196-213-271-321-364-438 (1)Justin Ezor
 
Labuildwebsiteseptember5
Labuildwebsiteseptember5Labuildwebsiteseptember5
Labuildwebsiteseptember5Thinkful
 
Intro to js august 31
Intro to js august 31Intro to js august 31
Intro to js august 31Thinkful
 
Build an App with JavaScript & jQuery
Build an App with JavaScript & jQuery Build an App with JavaScript & jQuery
Build an App with JavaScript & jQuery Aaron Lamphere
 

What's hot (12)

Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408
 
Build a Web App with JavaScript & jQuery
Build a Web App with JavaScript & jQueryBuild a Web App with JavaScript & jQuery
Build a Web App with JavaScript & jQuery
 
Js tests like a pro
Js tests like a proJs tests like a pro
Js tests like a pro
 
Learn react the right way
Learn react the right way  Learn react the right way
Learn react the right way
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-128-133-443 (1)
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-128-133-443 (1)Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-128-133-443 (1)
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-128-133-443 (1)
 
Accessible client side routing - Nick Colley
Accessible client side routing - Nick ColleyAccessible client side routing - Nick Colley
Accessible client side routing - Nick Colley
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408 (1)
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408 (1)Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408 (1)
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41-93-163-212-239-274-347-408 (1)
 
casestudypinterest
casestudypinterestcasestudypinterest
casestudypinterest
 
Deck 6-80-140-196-213-271-321-364-438 (1)
Deck 6-80-140-196-213-271-321-364-438 (1)Deck 6-80-140-196-213-271-321-364-438 (1)
Deck 6-80-140-196-213-271-321-364-438 (1)
 
Labuildwebsiteseptember5
Labuildwebsiteseptember5Labuildwebsiteseptember5
Labuildwebsiteseptember5
 
Intro to js august 31
Intro to js august 31Intro to js august 31
Intro to js august 31
 
Build an App with JavaScript & jQuery
Build an App with JavaScript & jQuery Build an App with JavaScript & jQuery
Build an App with JavaScript & jQuery
 

Similar to Deck 6-80

Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41(1)
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41(1)Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41(1)
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41(1)Thinkful
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47Ivy Rueb
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (1)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (1)Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (1)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (1)Ivy Rueb
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (2)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (2)Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (2)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (2)Ivy Rueb
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14Thinkful
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-55
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-55Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-55
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-55Ivy Rueb
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72 (1)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72 (1)Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72 (1)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72 (1)Ivy Rueb
 
Build an App with JavaScript & jQuery
Build an App with JavaScript & jQuery Build an App with JavaScript & jQuery
Build an App with JavaScript & jQuery Aaron Lamphere
 
Build an App with JavaScript and jQuery - LA - July 27
Build an App with JavaScript and jQuery - LA - July 27Build an App with JavaScript and jQuery - LA - July 27
Build an App with JavaScript and jQuery - LA - July 27Thinkful
 
Jsjqwebapp.12.14.17
Jsjqwebapp.12.14.17Jsjqwebapp.12.14.17
Jsjqwebapp.12.14.17Thinkful
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72Ivy Rueb
 
Batbwjs117
Batbwjs117Batbwjs117
Batbwjs117Thinkful
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74Ivy Rueb
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74Ivy Rueb
 
Intro To JavaScript
Intro To JavaScriptIntro To JavaScript
Intro To JavaScriptIvy Rueb
 
Thinkful DC - Intro to JavaScript
Thinkful DC - Intro to JavaScriptThinkful DC - Intro to JavaScript
Thinkful DC - Intro to JavaScriptTJ Stalcup
 

Similar to Deck 6-80 (20)

Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41(1)
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41(1)Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41(1)
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-41(1)
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (1)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (1)Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (1)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (1)
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (2)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (2)Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (2)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-47 (2)
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-55
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-55Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-55
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-55
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72 (1)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72 (1)Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72 (1)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72 (1)
 
Build an App with JavaScript & jQuery
Build an App with JavaScript & jQuery Build an App with JavaScript & jQuery
Build an App with JavaScript & jQuery
 
Build an App with JavaScript and jQuery - LA - July 27
Build an App with JavaScript and jQuery - LA - July 27Build an App with JavaScript and jQuery - LA - July 27
Build an App with JavaScript and jQuery - LA - July 27
 
Jsjqwebapp.12.14.17
Jsjqwebapp.12.14.17Jsjqwebapp.12.14.17
Jsjqwebapp.12.14.17
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-14-25-72
 
Batbwjs117
Batbwjs117Batbwjs117
Batbwjs117
 
Batbwjs27
Batbwjs27Batbwjs27
Batbwjs27
 
DC jQuery App
DC jQuery AppDC jQuery App
DC jQuery App
 
Batbwjs36
Batbwjs36Batbwjs36
Batbwjs36
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52-74
 
Intro To JavaScript
Intro To JavaScriptIntro To JavaScript
Intro To JavaScript
 
Thinkful DC - Intro to JavaScript
Thinkful DC - Intro to JavaScriptThinkful DC - Intro to JavaScript
Thinkful DC - Intro to JavaScript
 
Batbwjs42
Batbwjs42Batbwjs42
Batbwjs42
 

More from Ivy Rueb

Getting Started in Tech
Getting Started in TechGetting Started in Tech
Getting Started in TechIvy Rueb
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-33-82-317
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-33-82-317Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-33-82-317
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-33-82-317Ivy Rueb
 
Build your Own Twitter bot 09/20
Build your Own Twitter bot 09/20Build your Own Twitter bot 09/20
Build your Own Twitter bot 09/20Ivy Rueb
 
Instagram filters (10-5)
Instagram filters (10-5)Instagram filters (10-5)
Instagram filters (10-5)Ivy Rueb
 
Instagram filters (8 24)
Instagram filters (8 24)Instagram filters (8 24)
Instagram filters (8 24)Ivy Rueb
 
Instagram filters (8 24)
Instagram filters (8 24)Instagram filters (8 24)
Instagram filters (8 24)Ivy Rueb
 
Build Own Website
Build Own WebsiteBuild Own Website
Build Own WebsiteIvy Rueb
 
Build a Game with Javascript
Build a Game with Javascript Build a Game with Javascript
Build a Game with Javascript Ivy Rueb
 
Frontend Crash Coarse 09/28
Frontend Crash Coarse 09/28Frontend Crash Coarse 09/28
Frontend Crash Coarse 09/28Ivy Rueb
 
Intro To JavaScript
Intro To JavaScriptIntro To JavaScript
Intro To JavaScriptIvy Rueb
 
Build a Virtual Pet with Javascript
Build a Virtual Pet with JavascriptBuild a Virtual Pet with Javascript
Build a Virtual Pet with JavascriptIvy Rueb
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-81
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-81Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-81
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-81Ivy Rueb
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-13-66
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-13-66Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-13-66
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-13-66Ivy Rueb
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57 (2)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57 (2)Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57 (2)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57 (2)Ivy Rueb
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57Ivy Rueb
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-54
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-54Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-54
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-54Ivy Rueb
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-53
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-53Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-53
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-53Ivy Rueb
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52Ivy Rueb
 

More from Ivy Rueb (20)

Getting Started in Tech
Getting Started in TechGetting Started in Tech
Getting Started in Tech
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-33-82-317
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-33-82-317Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-33-82-317
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-33-82-317
 
Build your Own Twitter bot 09/20
Build your Own Twitter bot 09/20Build your Own Twitter bot 09/20
Build your Own Twitter bot 09/20
 
Instagram filters (10-5)
Instagram filters (10-5)Instagram filters (10-5)
Instagram filters (10-5)
 
Instagram filters (8 24)
Instagram filters (8 24)Instagram filters (8 24)
Instagram filters (8 24)
 
Instagram filters (8 24)
Instagram filters (8 24)Instagram filters (8 24)
Instagram filters (8 24)
 
Build Own Website
Build Own WebsiteBuild Own Website
Build Own Website
 
Build a Game with Javascript
Build a Game with Javascript Build a Game with Javascript
Build a Game with Javascript
 
Frontend Crash Coarse 09/28
Frontend Crash Coarse 09/28Frontend Crash Coarse 09/28
Frontend Crash Coarse 09/28
 
Intro To JavaScript
Intro To JavaScriptIntro To JavaScript
Intro To JavaScript
 
Build a Virtual Pet with Javascript
Build a Virtual Pet with JavascriptBuild a Virtual Pet with Javascript
Build a Virtual Pet with Javascript
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-81
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-81Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-81
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-81
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-13-66
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-13-66Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-13-66
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-13-66
 
Deck 4-67
Deck 4-67Deck 4-67
Deck 4-67
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57 (2)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57 (2)Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57 (2)
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57 (2)
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-7-57
 
Deck 1-56
Deck 1-56Deck 1-56
Deck 1-56
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-54
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-54Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-54
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-54
 
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-53
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-53Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-53
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-53
 
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52
Deck 8983a1d9-68df-4447-8481-3b4fd0de734c-9-52
 

Recently uploaded

AI in Action: Real World Use Cases by Anitaraj
AI in Action: Real World Use Cases by AnitarajAI in Action: Real World Use Cases by Anitaraj
AI in Action: Real World Use Cases by AnitarajAnitaRaj43
 
JohnPollard-hybrid-app-RailsConf2024.pptx
JohnPollard-hybrid-app-RailsConf2024.pptxJohnPollard-hybrid-app-RailsConf2024.pptx
JohnPollard-hybrid-app-RailsConf2024.pptxJohnPollard37
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...apidays
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesrafiqahmad00786416
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century educationjfdjdjcjdnsjd
 
Spring Boot vs Quarkus the ultimate battle - DevoxxUK
Spring Boot vs Quarkus the ultimate battle - DevoxxUKSpring Boot vs Quarkus the ultimate battle - DevoxxUK
Spring Boot vs Quarkus the ultimate battle - DevoxxUKJago de Vreede
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusZilliz
 
Introduction to use of FHIR Documents in ABDM
Introduction to use of FHIR Documents in ABDMIntroduction to use of FHIR Documents in ABDM
Introduction to use of FHIR Documents in ABDMKumar Satyam
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Jeffrey Haguewood
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoffsammart93
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MIND CTI
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Victor Rentea
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontologyjohnbeverley2021
 
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)Samir Dash
 
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfRising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfOrbitshub
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdfSandro Moreira
 
WSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FMESafe Software
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistandanishmna97
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native ApplicationsWSO2
 

Recently uploaded (20)

AI in Action: Real World Use Cases by Anitaraj
AI in Action: Real World Use Cases by AnitarajAI in Action: Real World Use Cases by Anitaraj
AI in Action: Real World Use Cases by Anitaraj
 
JohnPollard-hybrid-app-RailsConf2024.pptx
JohnPollard-hybrid-app-RailsConf2024.pptxJohnPollard-hybrid-app-RailsConf2024.pptx
JohnPollard-hybrid-app-RailsConf2024.pptx
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Spring Boot vs Quarkus the ultimate battle - DevoxxUK
Spring Boot vs Quarkus the ultimate battle - DevoxxUKSpring Boot vs Quarkus the ultimate battle - DevoxxUK
Spring Boot vs Quarkus the ultimate battle - DevoxxUK
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
Introduction to use of FHIR Documents in ABDM
Introduction to use of FHIR Documents in ABDMIntroduction to use of FHIR Documents in ABDM
Introduction to use of FHIR Documents in ABDM
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontology
 
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
 
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfRising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf
 
WSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering Developers
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistan
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 

Deck 6-80

  • 1. Build an App with Javascript & jQuery August 2017 WIFI: TGS guest Pass: tgsvisitor384 http://bit.ly/thinkful-jquery-app 1
  • 2. Instructor TAs Jasjit Singh Thinkful Atlanta General Manager Self-taught developer WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 2
  • 3. About you What's your name? Why do you want to learn JavaScript/jQuery? WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 3
  • 4. About Thinkful Thinkful helps people become developers or data scientists through one-on-one mentorship and project-based learning These workshops are built using this approach. WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 4
  • 5. Suggestions for learning Don't treat this as a drill, we're making something real Don't get discouraged, struggle leads to mastery Don't be shy, take full advantage of our support WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 5
  • 6. This is what we're making WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 6
  • 7. Agenda Go over starter code (10 min) Learn key jQuery & Javascript concepts (30 min) Build your app! (30 min) Go over solutions (10 min) Next steps (10 min) WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 7
  • 8. Quick HTML/CSS Refersher WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 8
  • 9. Starter code walkthrough http://bit.ly/tf-shopping-list WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 9
  • 10. Think of our HTML as a "tree" <form> list-content <input> item-input <ul> shopping-list <button> add-item WiFi: TGS Guest Pass: tgsvistior384 10 bit.ly/thinkful-jquery-app
  • 11. What is Javascript? What is jQuery? <input> <ul> shopping-list <button> <li> String cheese <li> Summer sausage <li> Chicken nuggets 11 <div> WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app
  • 12. "Grabbing" a section directly $('.shopping-list') jQuery always starts with this Element to grab WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 12
  • 13. jQuery walkthrough WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 13
  • 14. Attaching an "Event Listener" WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 14
  • 15. Real developers use Google... a lot WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 15
  • 16. Let's work on the first step together http://bit.ly/tf-shopping-list WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 16
  • 17. Solution WiFi: TGS Guest Pass: tgsvistior384 bit.ly/thinkful-jquery-app 17
  • 18. Ways to keep learning 18
  • 19. For aspiring developers, bootcamps fill the gap 19
  • 20. 87%87% job-placement rate + job guarantee Link for the third party audit jobs report: https://www.thinkful.com/bootcamp-jobs-statshttps://www.thinkful.com/bootcamp-jobs-stats Thinkful's track record of getting students jobs 20
  • 21. Our students receive unprecedented support Your Mentor Q&A Sessions Career CoachSlack Program Manager YouYou Local Community 21
  • 22. Mentorship enables flexible learning Learn anywhere, anytime, & at your own pace You don't have to quitYou don't have to quit your job to startyour job to start career transitioncareer transition 22
  • 23. Thinkful Two-Week Trial Talk to one of us and email jasjit@thinkful.comjasjit@thinkful.com to learn more Two-week course with 6 mentor sessions for $50 ($750 value) Start with HTML, CSS and JavaScript Option to continue with full bootcamp Financing & scholarships available Offer valid for one week after eventOffer valid for one week after event Jasjit SinghJasjit Singh GM, Atlanta 23