Newton Girls Who Code

Tuesday Session 12, 2016-12-20

Welcome!

Please make yourself a name tag.

Today’s Goals

  • Build Sisterhood: Spotlight, Field Trip
  • Software Engineering: Version Control
  • CS Impact: Basic HTML pages

Plan for Today

  • Spotlight: Women Who Code
  • Announcements
  • Version Control and GitHub
  • Write an HTML Adventure
  • Closing Reflection

Spotlight: Women Who Code

Grace Hopper

Watch this video explaining who Grace Hopper was, and this one where she talks about nanoseconds.

Then find interesting facts!

photo from http://history-computer.com/ModernComputer/Software/images/Hopper_young.jpg

Plan for Today

  • Spotlight: Women Who Code
  • Announcements
  • Version Control and GitHub
  • Write an HTML Adventure
  • Closing Reflection

Announcements

  • Awesome field trip. Photos

  • This is the last session of 2016.
  • No meeting on December 27.
  • Club resumes 3 January 2017.

Plan for Today

  • Spotlight: Women Who Code
  • Announcements
  • Version Control and GitHub
  • Write an HTML Adventure
  • Closing Reflection

Version Control with GitHub

  • GitHub gives us a place in the cloud to save our code.
  • Lets us work together without getting in each other’s way.
    • GitHub keeps a “master” copy of the code
    • Everyone can “check out” / “pull” the current state of the code to their own computer and work on changes.
    • When you’ve made something you want to save to GitHub, you “commit” and “push” it back to GitHub from your computer.
    • Other people might have also changed the same files in the meantime. GitHub tries to be clever and “merge” the changes together; if it gets confused, it’ll ask you to fix the “merge conflict” yourself.
  • Lets us see how files have changed over time and go back to older versions if needed.

GitHub Logistics

Web interface: https://github.com/newtongwc

Sign in with:

  • Email: your @newtongwc.org email
  • Password: your Canvas password
  • Unless you are Toni or Ellen, who have pre-existing github accounts

Intro to Github Web Interface

  • Find and click on 2016tuesdays (our club’s repository)
  • Find and click on the folder that has your initials
    • This is your folder for putting any code you want
    • In the future we will probably make some more folders for Oddjobs Webserver code that we’re working on together.
  • This folder contains one file called README.md. There should be a button that says Create New File; click it.
  • Name your new file hello.py and put

print “Hello World”

in its contents.

5. Scroll down, type “Made a Hello World python program” in

the commit description box, and press Commit New File.

6. Now your file is saved in your GitHub folder.

PyCharm and GitHub

  • GitHub cannot actually run code; it only provides a place to put it.
  • PyCharm can run python code. Conveniently, it can also talk directly to GitHub without you needing to use the GitHub web interface.
  • We’ll see how soon.

Plan for Today

  • Spotlight: Women Who Code
  • Announcements
  • Version Control and GitHub
  • Write an HTML Adventure
  • Closing Reflection

Outline for our Oddjobs Webserver:

We actually write code in:

  • Google Domains to register a domain name
  • Google Cloud Platform to host the site
  • Google App Engine to act as web server
  • Python Flask for the framework and template system
    • Includes Python, HTML, CSS, maybe Javascript
  • SQLite for the database (may use MySQL instead)
  • GitHub to be a repository for our code
  • PyCharm Edu installed on student machines to author the code

Tour of Flask and PyCharm

  • Suggestion: transition from doing scatter-shot Activity Sets to learning technologies targeted for project.

  • Python: EarSketch or Storytelling with Codesters
    • Or just start playing in PyCharm Edu
  • Web Development: HTML, CSS, Javascript
    • Codecademy Activity Set
  • Databases: Schema design, SQL
    • Khan Academy activity set
  • Web Application: Flask
    • Various Flask Tutorials.

Let’s Go on an Adventure!

  • Try the “game” at https://newtongwc-examples.appspot.com/. Play a few times with different choices.
  • Now find the code: https://github.com/newtongwc/examples
    • Look at the adventure game in flask/local
    • Look at the various HTML files in flask/local/static

Let’s Run Adventure Locally

  • Start PyCharm on your machine.
  • Checkout the newtongwc/examples repository

Let’s Run Adventure Locally

  • Find the adventure game and start it in PyCharm
    • Open “7. Adventure.py”
    • Hit the “Run” icon
    • You may need to install Flask:
      • C:\Python27\python.exe -m pip install Flask
  • Follow the browser link from your “Run” window and play.

“That’s lame, I bet I could write a better adventure than that…”

Now You Write One

  • Start PyCharm on your machine
  • Checkout the newtongwc/2016tuesdays repository
  • Find your home directory (two or three initials).
  • Copy 7. adventure.py to your directory.
    • Drop the “7” in your copy, or choose any other name.

Now You Write One

  • Make a subdirectory named static
  • Put your game files into static/
  • Make a game with at least 3 choice points.
  • Add pages, images, and styling as desired.
  • Get your friends to play your adventure.
  • Commit your changes before leaving the club.

Plan for Today

  • Spotlight: Women Who Code
  • Announcements
  • Version Control and GitHub
  • Write an HTML Adventure
  • Closing Reflection

Closing Reflections

  • What has been the best thing about GWC 2016?
  • What would you most like to get out of GWC 2017?
  • Group discussion (if time)
  • Hand in your Reflection Journal (don’t take it home!!)

See you next year!

Don’t forget to be awesome!

Newton GWC, Tuesday Section, Week 12 (2016-12-20) - Google Slides