ekingery/How-To-Program-a-Computer

Website developed as part of a brief presentation on programming to a kindergarten classroom

Career Day - Software Engineering

This repository contains information on how to program a computer, including a sample program that serves the Smines City Technology website. This was developed for my daughter's kindergarten classroom.

How To Program A Computer - Presentation

A brief slideshow presentation for the kids.

Learning to Program / Resources

• Best Apps and Websites for Learning Programming

• Code Play Learn is a local independent coding school for kids with a branch in Oak Park. Classes are typically offered for kids in grades 1-12.

• Crash Course on Computer Science and Crash Course for Kids: The Engineering Process

• Learn more about Margaret Hamilton

  • Margaret and the Moon is an outstanding book!

• Introduction to Simple Web Applications (like this one) with Flask

How does this work?

This python module (smines_city) scrapes information from the school lunch calendar and displays it, along with data from a weather API. It is deployed to heroku and built using a lightweight python web framework called Flask. It also uses:

• Paper CSS Framework for style / design of the html markup.
• Beautiful Soup for scraping data from the calendar page.
• Dark Sky API package and Skycons.
  • Set your own API key using heroku config:set DARKSKY_API_KEY=<yours>

Local Development

Assuming you have an updated version of Python and pip on your machine, install all your dependencies:

pip2 install -r requirements.txt 

Then you can start a local flask server with this command: FLASK_APP=smines_city/__init__.py FLASK_DEBUG=1 DARKSKY_API_KEY=<your_key> flask run

Note that you will need to have acquired a DarkSky API key. Instructions for that can be found below in the "Deploy to Heroku" section.

Tests

Tests can be run using the pytest command.

Deploying to Heroku

You can deploy a copy of this application directly to Heroku by following these steps:

1. Click this button:
   1. Sign up for Heroku if you don't already have an account, or log in with your existing account if you have one.
   2. Name the app anything you like.
2. Now, as deployed, the application won't yet work, so don't go view it yet. If you do, no harm done. You'll just see a "Not ready yet!" message come up in your web browser. Instead, click the button that says "Manage App."
3. Next, you're going to need a DarkSky API key. Go here in a new browser window and click the "Try for Free" button, sign up, and get your secret key.
4. Next, you will need to add your DarkSky secret API key as a config variable in Heroku.
   1. Back in the Heroku dashboard, click "Settings"
   2. Next, click "Reveal Config Vars"
   3. Next, create a new config var, with "KEY" set to DARKSKY_API_KEY and "VALUE" set to your DarkSky key
   4. Next, click "Add"
5. Now your app is configured. You can click the "Open App" button in the upper-right corner of the Heroku and you should see today's lunch and weather!

Pseudocode

Parsing the calendar on the school lunch table is a good example of a common programming task. Less of an academic exercise and more of a puzzle, it provides a good example of how to use pseudocode to arrive at a solution.

Function 1. Find the next relevant menu day

Use this logic (in order) to determine what day's menu we want to display. This assumes that the school calendar always displays all weekdays in the month. You can find this pseudocode implemented in the date_to_display function.

 * Make a call to the date / time library to find out what day it is.
 * If it is between 11am on Friday and 11am on Monday, we are likely interestedin Monday's menu.
 * If it is before 11am on a weekday, we are likely interested in the current day's menu.
 * If it is after 11am on a weekday, we are likely interested in the next day's menu.
 * Return the chosen day (for use in the function below).

Function 2. Look up the menu item corresponding with a menu day

Once we know the day of the month we are interested in, we need to pull the menu for that day from the calendar. The calendar is represented as an html table element. This means the table is composed of rows <tr> and data <td> elements. You can find this pseudocode implemented in the menu_for_day function.

On a side note, Web APIs are popular because they often provide this type of data without the need to scrape pages, etc. For example, this application uses a weather API to display the day's weather.

 * Search for a <td> with data equal to the day we are interested in.
   * If it is not found, search for the next highest day.
 * Store the position of the found <td> element, where 1-5 correspond to M-F.
 * Access the next <tr> and pull the data from the <td> in the position stored above.
 * Return the day's menu data to the user interface for display.