1. Build Your Own WebsiteBuild Your Own Website
March 2018
WIFI: Cross Camp.us Members
Password: innovate
bit.ly/website-labit.ly/website-la
Interactive Slides: bit.ly/website-la-slides-32018
1
2. Instructor
Cyrus Kia
Thinkful Web Dev Flex Program
Technical Solutions Engineer
(Pagely)
TAs
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-website
Justin Ezor
Thinkful LA Community Manager
Web Developer
Likes Pizza
Wi-Fi: Cross Camp.us Members
Pass: innovate
2
bit.ly/website-la
3. About you
What's your name?
What brought you here today?
What is your programming experience?
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-websiteWi-Fi: Cross Camp.us Members
Pass: innovate
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.
Wi-Fi: Cross Camp.us Members
Pass: innovate
bit.ly/website-la
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
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-websiteWi-Fi: Cross Camp.us Members
Pass: innovate
bit.ly/website-la
5
6. This is what we're making
View example here
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-websiteWi-Fi: Cross Camp.us Members
Pass: innovate
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)
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-websiteWi-Fi: Cross Camp.us Members
Pass: innovate
bit.ly/website-la
7
8. HTML - Hypertext Markup Language
<h1 class="intro">Hi there!</h1>
AttributeOpening tag
h1 element
Closing tag
bit.ly/website-la
Content
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-website
8
Wi-Fi: Cross Camp.us Members
Pass: innovate
bit.ly/website-la
9. HTML
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-website
Wi-Fi: Cross Camp.us Members
Pass: innovate
bit.ly/website-la
9
10. CSS - Cascading Style Sheets
h1 {
color: blue;
}
Value
Property
Selector
bit.ly/website-la
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-website
10
Wi-Fi: Cross Camp.us Members
Pass: innovate
bit.ly/website-la
11. CSS selectors, properties, values
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-websiteWi-Fi: Cross Camp.us Members
Pass: innovate
bit.ly/website-la
11
12. Margin, border, and padding
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-websiteWi-Fi: Cross Camp.us Members
Pass: innovate
bit.ly/website-la
12
13. Margin, border, and padding
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-websiteWi-Fi: Cross Camp.us Members
Pass: innovate
bit.ly/website-la
13
14. Real developers use Google... a lot
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-websiteWi-Fi: Cross Camp.us Members
Pass: innovate
bit.ly/website-la
14
15. Glitch setup & rst steps!
http://bit.ly/build-website-starter
Wi-Fi: Digital Ignition
Pass: Countdown54321
bit.ly/build-own-websiteWi-Fi: Cross Camp.us Members
Pass: innovate
bit.ly/website-la
15
16. Ways to keep learning
More Structure
Less Structure
More SupportLess Support
16
17. 325+ mentors with an average of
10 years of experience in the eld
17
18. Support 'round the clock
Your Mentor
Q&A Sessions
Career Coach
In-person Workshops
Slack
Program Manager
You
18
19. Our results
92%92%job-placement rate + job guarantee
Kaeside Iwuagwu
Link for the third party audit jobs report:
https://www.thinkful.com/bootcamp-jobs-stats
Frontend Developer
Sierra Gregg
Software Engineer
JP Earnest
Web Developer
19
20. Thinkful's free resource
Talk to one of us and email justin.ezor@thinkful.com to learn more
Web Development Fundamentals
Covers HTML, CSS and JavaScript
Unlimited mentor-led Q&A sessions
Personal Program Manager to help you
set goals and navigate resources
Student Slack Channel
bit.ly/free-web-labit.ly/free-web-la
20