Build an App with JavaScript & jQuery
- 1. Build an App with JavaScript & jQuery September 2017 WIFI: In3 - Guest bit.ly/dc-web-app 1
- 2. Instructor TA TJ StalcupTJ Stalcup Lead Mentor, Thinkful API Evangelist, WealthEngine PokemonGO! Enthusiast 2
- 3. About you What's your name? Why do you want to learn JavaScript/jQuery? http://www.loremipsum.com/example Wi-Fi: orem Ipsum PW: orem Ipsum L L 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. 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 5
- 6. This is what we're making http://www.loremipsum.com/example Wi-Fi: orem Ipsum PW: orem Ipsum L L 6
- 7. Agenda Go over starter code (10 min) Learn key jQuery & JavaScript concepts (20 min) Build your app! (30 min) Go over solutions (10 min) Next steps (10 min) http://www.loremipsum.com/example Wi-Fi: orem Ipsum PW: orem Ipsum L L 7
- 9. Starter code walkthrough http://bit.ly/tf-shopping-list bit.ly/web-app-la 9
- 10. Think of our HTML as a "tree" <form> list-content <input> item-input <ul> shopping-list <button> add-item 10
- 11. What is JavaScript? What is jQuery? <input> <ul> shopping-list <button> <li> String cheese <li> Summer sausage <li> Chicken nuggets 11 <div>
- 12. "Grabbing" a section directly $('.shopping-list') jQuery always starts with this Element to grab 12
- 14. Attaching an "Event Listener" http://www.loremipsum.com/example Wi-Fi: orem Ipsum PW: orem Ipsum L L 14
- 15. Real developers use Google... a lot 15
- 16. Let's work on the first step together http://bit.ly/tf-shopping-list http://www.loremipsum.com/example Wi-Fi: orem Ipsum PW: orem Ipsum L L 16
- 17. Solution 17
- 18. 18
- 19. 19
- 20. 20
- 21. Our students receive unprecedented support 1-on-1 Learning Mentor 1-on-1 Career MentorProgram Manager Los Angeles Community You 21
- 22. 22
- 23. Thinkful Two-Week Trial Talk to one of us and email [email protected]@thinkful.com to learn more Two-week Free Course Trial 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 BenjyBenjy SchechnerSchechner Education Advisor 23