Build Your Own Website with HTML/CSS
- 1. Build Your Own Website August 2017 WIFI: CrossCamp.us Events bit.ly/website-la 1
- 2. Instructor Megan Buzzas Thinkful Web Dev Student Freelance web developer TAs CrossCamp.us Events bit.ly/website-la 2
- 3. About you What's your name? ! What brought you here today? I'm curious about a career as a developer I'm considering enrolling in a bootcamp What is your programming experience? I'm completely new to programming " I've been self-teaching for a few months # I'm already a developer$ CrossCamp.us Events bit.ly/website-la 3
- 4. 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. CrossCamp.us Events bit.ly/website-la 4
- 5. Suggestions for learning Don't treat this as a drill, we're making somethingwe're making something realreal 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 CrossCamp.us Events bit.ly/website-la 5
- 6. This is what we're making View example here CrossCamp.us Events bit.ly/website-la 6
- 7. Agenda Learn key HTML and CSS concepts (30 min) Go over starter code (10 min) Build your site with our support! (30 min) Steps to continue learning (10 min) CrossCamp.us Events bit.ly/website-la 7
- 8. HTML - what is it? HTML (HyperText Markup Language) is the content and structure of a webpage. <h1 class="intro">Hi there!</h1> Attribute Opening section tag h1 element Closing section tag bit.ly/website-laCrossCamp.us Events bit.ly/website-la 8
- 9. HTML tags, elements, attributes CrossCamp.us Events bit.ly/website-la 9
- 10. CSS - what is it? CSS (Cascading Style Sheets) determines the visual representation of HTML content. h1 { color: blue; } Declaration block Value Property Selector bit.ly/website-laCrossCamp.us Events bit.ly/website-la 10
- 11. CSS selectors, properties, values CrossCamp.us Events bit.ly/website-la 11
- 12. Our project for tonight Your mission for tonight is to build your very own "About Me" page using Glitch.com. CrossCamp.us Events bit.ly/website-la 12
- 13. Glitch setup & first steps! Fork the starter code here CrossCamp.us Events bit.ly/website-la 13
- 14. Real developers use Google... a lot CrossCamp.us Events bit.ly/website-la 14
- 15. Ways to keep learning More Structure Less Structure More SupportLess Support 15
- 16. Our instructors help us write, teach, and improve our workshops & curriculum 16
- 17. Career prep and job-placement Liz Stephanie Our career services team has helped 93% of our grads begin jobs at companies like: 17
- 18. Take a Thinkful tour! Talk to one of us to set something up ! Take a look through Thinkful's student platform to see if project-based, online learning is a good fit for you % While we're at it, give us feedback on tonight's workshop. 18