HomePage Header
Click on this image to see the site for yourself!

For my first web programming class, our final project required us to implement a mock educational kid’s camp website. We implemented both client and server sides, as well as form validation, a data visualization feature, and two fun games for kid’s to play!

 

Front End

We implemented the front-end using HTML5, CSS, Javascript, and Bootstrap.

Back End

Forum Page HeaderFor the back-end, we used an Oracle database and implemented relational tables and defined primary and foreign keys using SQL. We embedded SQL queries within PHP script to allow users to click on items in our “camp store,” once an item is added to a customer’s shopping cart, the number of items in stock in our database decreases by 1. We also included a forum page where visitors to the site can leave comments about their previous camp experiences, what they are excited for, etc.!

 

Screen Shot 2016-07-07 at 10.52.36 AM
Click on this image to see the class availability for today!

Data Visualization

 

We used SQL and SVG to implement a dynamic graph that shows the number of campers signed up for a particular class, as well as how many spots are left.

 

 

 

Computer Games

Sample Activities Page Header
Click on this image to see the games for yourself!

We implemented two kid’s computer games using javascript. Try playing them here!

 

 

Form Validation

We included a form on our website allowing parents to fill out their child’s information and emergency contact info, thus we included form validation for important fields.

 

Shopping Cart, Camp Store, and Log in

Screen Shot 2016-07-07 at 10.53.02 AMWe also implemented the camp store, a shopping cart feature, and checkout pages using PHP and SQL. We also provided a page in which users can log in, and if they then choose to checkout from the store, our code will recognize their login email and give them  a 10% discount.

 

 

Check out our website HERE and leave feedback below!