Build Your Own Website
July 2017
WIFI: In3Guest
http://bit.ly/website-dc
1
Instructor
Tyler Brewer
Thinkful Mentor
Web Developer @ Excella
TAs
Wi-Fi: In3Guest bit.ly/website-dc
2
About you
What's your name?
What brought you here today?
What is your programming experience?
bit.ly/website-dcWi-Fi: In3Guest
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-dcWi-Fi: In3Guest
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-dcWi-Fi: In3Guest
5
This is what we're making
View example here
bit.ly/website-dcWi-Fi: In3Guest
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-dcWi-Fi: In3Guest
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-dcWi-Fi: In3Guest
8
HTML
bit.ly/website-dcWi-Fi: In3Guest
9
CSS - Cascading Style Sheets
h1 {
color: blue;
}
Value
Property
Selector
bit.ly/website-la
bit.ly/website-dcWi-Fi: In3Guest
10
CSS selectors, properties, values
bit.ly/website-dcWi-Fi: In3Guest
11
Margin, border, and padding
bit.ly/website-dcWi-Fi: In3Guest
12
Margin, border, and padding
bit.ly/website-dcWi-Fi: In3Guest
13
Real developers use Google... a lot
bit.ly/website-dcWi-Fi: In3Guest
14
Glitch setup & first steps!
http://bit.ly/build-website-starter
bit.ly/website-dcWi-Fi: In3Guest
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
Support 'round the clock
Your Mentor
Q&A Sessions
Career Coach
In-person Workshops
Slack
Program Manager
YouYou
18
Our 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
Web Developer
Sierra GreggSierra Gregg
Software Engineer
JP EarnestJP Earnest
Web Developer
19
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.
20

Build Your Own Website - Thinkful DC

  • 1.
    Build Your OwnWebsite July 2017 WIFI: In3Guest http://bit.ly/website-dc 1
  • 2.
    Instructor Tyler Brewer Thinkful Mentor WebDeveloper @ Excella TAs Wi-Fi: In3Guest bit.ly/website-dc 2
  • 3.
    About you What's yourname? What brought you here today? What is your programming experience? bit.ly/website-dcWi-Fi: In3Guest 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-dcWi-Fi: In3Guest 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-dcWi-Fi: In3Guest 5
  • 6.
    This is whatwe're making View example here bit.ly/website-dcWi-Fi: In3Guest 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-dcWi-Fi: In3Guest 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-dcWi-Fi: In3Guest 8
  • 9.
  • 10.
    CSS - CascadingStyle Sheets h1 { color: blue; } Value Property Selector bit.ly/website-la bit.ly/website-dcWi-Fi: In3Guest 10
  • 11.
    CSS selectors, properties,values bit.ly/website-dcWi-Fi: In3Guest 11
  • 12.
    Margin, border, andpadding bit.ly/website-dcWi-Fi: In3Guest 12
  • 13.
    Margin, border, andpadding bit.ly/website-dcWi-Fi: In3Guest 13
  • 14.
    Real developers useGoogle... a lot bit.ly/website-dcWi-Fi: In3Guest 14
  • 15.
    Glitch setup &first steps! http://bit.ly/build-website-starter bit.ly/website-dcWi-Fi: In3Guest 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.
    Support 'round theclock Your Mentor Q&A Sessions Career Coach In-person Workshops Slack Program Manager YouYou 18
  • 19.
    Our 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 Web Developer Sierra GreggSierra Gregg Software Engineer JP EarnestJP Earnest Web Developer 19
  • 20.
    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. 20