Computer B Course Intro - GPA High School

302 views

Published on

Here are some of the basics you'll need to know for the GPA Computer B course.

Published in: Education, Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
302
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Computer B Course Intro - GPA High School

  1. 1. COMPUTER B: CODING COURSE OVERVIEW & INTRO MR. SNOWBERGER
  2. 2. NEW THINGS FOR THIS SEMESTER 1. All computers have Deep Freeze 1. Nothing you install will stay 2. Nothing you save will remain 2. All students have Google Drive (with new email) 1. You all have 30GB FREE 2. SESO – Save Early, Save Often 3. All phones will be collected 1. (And occasionally returned for projects)
  3. 3. COURSE BREAKDOWN WEBSITE CODING • Essential (2-3) • HTML5 (1) • CSS3 (1) • Potential (1+?) • PHP? • JavaScript? • WordPress? SMARTPHONE APPS • Harvard Online • Android Apps (6) • iDevice Apps (6) • App Stores (1) http://cs76.tv/2012/spring/
  4. 4. GRADING BREAKDOWN CODING PROJECTS • Website (40) • Initial work (20) • Weekly progress (2) • (Total = 2*12 ~ 20) • Smartphones (110) • Android (50) • iDevices (50) • App Stores (10) TESTS/HOMEWORK • Midterm (30) • Final (40) • Homework (30) • Weekly question (2) • (Total = 2*16 ~ 30) • Bonus Points (1-1) • For outside work
  5. 5. AND PARTICIPATION (50) ATTENDANCE • Expected • All topics build upon each other. • Miss too many, you can’t finish. • Not graded • (Included in Participation grade) PARTICIPATION • In-class • No sleeping • No surfing while lecturing • No games/videos • Weekly • Blog progress report • Homework question • Graded weekly
  6. 6. TOOLS • Pre-installed • Lightshot (screenshots = press PrtSc) • Filezilla (file uploads, if necessary) • To-be-installed • Notepad++ (web programming) • Eclipse (Java + Android SDK) • Xcode and iOS SDK for Windows • Possibly? • WAMP (for running a local Apache server) • WordPress (if we get into WordPress dev)
  7. 7. SOFTWARE DEVELOPMENT KIT BY THE WAY, WHAT IS SDK?
  8. 8. WEBSITE CODING FROM HTML5 TO CSS 3
  9. 9. WHY LEARN (WEBSITE*) CODING? • It’s fun.* • It’s the easiest form of coding to begin with.* • It’s quickly becoming an essential computer skill (coding is becoming the new literacy). • Coding jobs in the US will grow by 30% (twice the normal rate) by 2020. • “It teaches you how to think.” – Steve Jobs
  10. 10. WHY CODE? http://www.code.org/ http://www.youtube.com/watch?v=nKIu9yen5nc
  11. 11. WHAT’S THE DIFFERENCE? HTML: STRUCTURE CSS: STYLE http://coding.smashingmagazine.com/2009/08/04/designing-a-html-5-layout-from-scratch/
  12. 12. WHAT ARE THE BASIC PARTS OF A WEBSITE? 1. Header 2. Navigation 3. Sidebar 4. Body 5. Footer http://net.tutsplus.com/tutorials/html-css-techniques/html-5-and-css-3-the-techniques-youll-soon-be-using/
  13. 13. BASIC OPTIONS LAYOUT 1. One-column 2. Two-column 3. Three columns 4. Multi-column 5. Horizontal 6. Mobile WIDTHS (THE 3 F’S) 1. Fixed 2. Fluid 3. Flexible • Widescreen (max) • Regular screen • Tablet • Phone (min)
  14. 14. LAYOUT EXAMPLES
  15. 15. FLEXIBLE WIDTH (AKA RESPONSIVE)
  16. 16. CHECK OUT THESE EXAMPLES 1. Korean Tourism Organization 1. http://english.visitkorea.or.kr/enu/index.kto 2. My Korean Learning Website 1. http://www.keytokorean.com/ 3. TalkToMeInKorean.com 1. http://www.talktomeinkorean.com/ 4. Smashing Magazine Web Design 1. http://www.smashingmagazine.com/
  17. 17. WEBSITE LANGUAGE HTML5
  18. 18. MOST BASIC “TAGS” • <!DOCTYPE> • <html> • <meta /> • <head> • <body> • <header> • <footer> • <nav> • <aside> • <div> • <title> • <h1…h6> • <p> • <a> • <em>, <i> • <strong>, <b> • <blockquote> • <img /> • <br /> • <!-- -->
  19. 19. MORE COMPLEX ELEMENTS • Forms (multiple tags) • Lists (for example) • Ordered List <ol> • Unordered List <ul> • List Item <li> • Tables (7 tags) • Media (multiple tags)
  20. 20. LET’S MAKE SOMETHING

×