BMI Calculator:

Demonstrate your ability to do graphic user interface in Python using HTML and CSS. Simple web server with Bottle. Build a web application which prompts the user for his or her height and weight, sends that data to another page, which calculates the BMI as well as some feedback.

About BMI

Body Mass Index (BMI) is a predictor of health based on an easily calculated formula. The essential formula is this:

[weight / (height)2] x 703 

where weight is measured in pounds and height is measured in inches.

Body mass is evaluated according to the following chart:

BMI status

under 18.5 underweight

18.51 to 24.9 normal

25 to 29.9 overweight

30 and over obese

Setting up bottle

This project requires you to set up a bottle web service on pythonanywhere.It is possible to run this project from a local machine for testing, but pythonanywhere makes it easier for us to see and grade your project.

• Navigate to pythonanywhere and login as usual
• Move to the web tab
• Click on the "New Web Project" button
• Choose the latest versions of bottle and python
• You will be given a default directory (mysite) - that's fine for now or you can change it
• Go back to the files system and you'll see the mysite directory along with a prototype bottle_ap.py
• Test it as-is before you make changes
• You'll definitely want to add a views directory to mysite.
• You may also want a static directory. If you go with that, be sure to also mark it as a static directory in the web panel.

The Form Interface

Need web-based graphical interface to communicate with the user. The input formshould have the following features:

• Be an HTML page in the views directory displayed with the template() function
• Text fields to input height in feet and inches
• A text field to input weight
• Labels to indicate BMI and the user's status (underweight, normal, and so on...)
• Labels to explain what each text field or label means
• A submit button to begin the calculation
• A form with the appropriate method and action

Result calculator

Modify your server so that it maps results to a second page.This page should have the following:

• Be an HTML template stored in the views directory loaded by the template function
• Have a python section (use the <%%> tricks to move to python)
• Include the bottle request library
• Extract all the appropriate fields from the previous forms
• Write python code to produce a BMI value and description
• Store these values in python variables
• Create HTML for output
• Incorporate python variables with the {{ }} operators

Tips

• Diagram your UIs first on paper
• Focus on functionality before beauty.Make it work before you make it pretty
• Design your form for input and test it before worrying about output
• have second page to process the data
• On your first pass, you may just want to ensure that you are getting all the expected data from the form.
• Errors WILL NOTBE REPORTED on the web page. If you get a server configuration error, use the web panel of pythonanywhere to look at the error log.You may need to refresh the error log to see the last error message.
• Combine the feet and inches fields to determine total height
• You may need to convert variable types for input and output
• Calculate the user's BMI status according to the chart above, and report this to the user
• Even if you know how to all this on the client-side with JavaScript, that's NOT the point of this app.The goal here is to apply your server-side python knowledge.