Build Your Own Website August 2017 WIFI: Cross Camp.us Events http://bit.ly/website-la 1
Instructor Fernando Arocho Self-taught developer Lead Software Engineer - Revuelo TAs Wi-Fi: Cross Camp.us Events bit.ly/website-la 2
About you What's your name? What brought you here today? What is your programming experience? bit.ly/website-laWi-Fi: Cross Camp.us Events 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. bit.ly/website-laWi-Fi: Cross Camp.us Events 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 bit.ly/website-laWi-Fi: Cross Camp.us Events 5
This is what we're making View example here bit.ly/website-laWi-Fi: Cross Camp.us Events 6
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) bit.ly/website-laWi-Fi: Cross Camp.us Events 7
HTML - Hypertext Markup Language <h1 class="intro">Hi there!</h1> AttributeOpening tag h1 element Closing tag bit.ly/website-la Content bit.ly/website-laWi-Fi: Cross Camp.us Events 8
HTML bit.ly/website-laWi-Fi: Cross Camp.us Events 9
CSS - Cascading Style Sheets h1 { color: blue; } Value Property Selector bit.ly/website-labit.ly/website-laWi-Fi: Cross Camp.us Events 10
CSS selectors, properties, values bit.ly/website-laWi-Fi: Cross Camp.us Events 11
Margin, border, and padding bit.ly/website-laWi-Fi: Cross Camp.us Events 12
Margin, border, and padding bit.ly/website-laWi-Fi: Cross Camp.us Events 13
Real developers use Google... a lot bit.ly/website-laWi-Fi: Cross Camp.us Events 14
Glitch setup & first steps! http://bit.ly/build-website-starter bit.ly/website-laWi-Fi: Cross Camp.us Events 15
Ways to keep learning More Structure Less Structure More SupportLess Support 16
325+ mentors325+ mentors with an average of 10 years of experience10 years of experience in the field 17
Career prep and job-placement Liz Stephanie Our career services team has helped 93% of our grads begin jobs at companies like: 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. 19

Build Your Own Website with HTML/CSS

  • 1.
    Build Your OwnWebsite August 2017 WIFI: Cross Camp.us Events http://bit.ly/website-la 1
  • 2.
    Instructor Fernando Arocho Self-taught developer LeadSoftware Engineer - Revuelo TAs Wi-Fi: Cross Camp.us Events bit.ly/website-la 2
  • 3.
    About you What's yourname? What brought you here today? What is your programming experience? bit.ly/website-laWi-Fi: Cross Camp.us Events 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. bit.ly/website-laWi-Fi: Cross Camp.us Events 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 bit.ly/website-laWi-Fi: Cross Camp.us Events 5
  • 6.
    This is whatwe're making View example here bit.ly/website-laWi-Fi: Cross Camp.us Events 6
  • 7.
    Agenda Learn key HTMLand CSS concepts (30 min) Go over starter code (10 min) Build your site with our support! (30 min) Steps to continue learning (10 min) bit.ly/website-laWi-Fi: Cross Camp.us Events 7
  • 8.
    HTML - HypertextMarkup Language <h1 class="intro">Hi there!</h1> AttributeOpening tag h1 element Closing tag bit.ly/website-la Content bit.ly/website-laWi-Fi: Cross Camp.us Events 8
  • 9.
  • 10.
    CSS - CascadingStyle Sheets h1 { color: blue; } Value Property Selector bit.ly/website-labit.ly/website-laWi-Fi: Cross Camp.us Events 10
  • 11.
    CSS selectors, properties,values bit.ly/website-laWi-Fi: Cross Camp.us Events 11
  • 12.
    Margin, border, andpadding bit.ly/website-laWi-Fi: Cross Camp.us Events 12
  • 13.
    Margin, border, andpadding bit.ly/website-laWi-Fi: Cross Camp.us Events 13
  • 14.
    Real developers useGoogle... a lot bit.ly/website-laWi-Fi: Cross Camp.us Events 14
  • 15.
    Glitch setup &first steps! http://bit.ly/build-website-starter bit.ly/website-laWi-Fi: Cross Camp.us Events 15
  • 16.
    Ways to keeplearning More Structure Less Structure More SupportLess Support 16
  • 17.
    325+ mentors325+ mentorswith an average of 10 years of experience10 years of experience in the field 17
  • 18.
    Career prep andjob-placement Liz Stephanie Our career services team has helped 93% of our grads begin jobs at companies like: 18
  • 19.
    Take a Thinkfultour! 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. 19