Individual Project

Purpose

During the term, you will develop an individual project that will help you learn the basics of Ruby on Rails and demonstrate your understanding of how to create an (eventually) interactive website.  This project will incorporate HTML, CSS, JavaScript, and Ruby on Rails to create a multi-page website that showcases your technical skills.

Overview

The content of the website is up to each individual student.  There are many, many possibilities for your website.  Some are listed below.  Above all, we expect the final product to be at a level where you would be proud to show it to someone else. We highly recommend that you eventually incorporate it into a portfolio that you can show to prospective employers, graduate schools, or clients. 

Your website will eventually need to incorporate dynamic content that is programmed in Ruby (on Rails).  You can keep it fairly simple, especially when it comes to graphic displays. But find an idea that requires Ruby programming and use of a database to store persistent data. You will be building this website up progressively, so you can start simple and build it out as you learn more of what Rails can do.   Most of the assignments designated “Homework” are designed to guide progressive development of this individual project.  

Some examples from prior courses (used with permission) or under current development:

By the end of the term, your individual project needs to be something substantial that you would be proud to show to a prospective employer or graduate school to show what you can do towards creating an interactive, full-stack website.  

Potential Project Ideas

Very IMPORTANT NOTE:  you can use the Hartl tutorial’s “Twitter lite” example as your individual project (see item 2 in the list below).  I will ask you to make some changes, such as using a different color scheme, but that tutorial is an allowable individual project.  I think you will learn Ruby on Rails more deeply if you try doing something of your own imagining, but I recognize that there is very little time available in the short term we have for Spring 1.

    1. A programming team name generator
    2. A micro-posting site that focuses on  your interest or hobby (simply follow the Hartl tutorial step by step with minor modifications)
    3. A diary or journal app (tutorial available at Rails Girls)
    4. An informational site based around a dataset that interests you (look at kaggle.com and https://archive.ics.uci.edu/ml/index.php for datasets)
    5. Website scraper
    6. A Mad Lib page generator (see this page for a fairly serious version: https://csc105.herokuapp.com/contact …. Note that you need to refresh the page to see the changed content each time)
    7. Product catalog and shopping cart
    8. Any board games
    9. Sudoku game and solver 
    10. Quiz game
    11. Flash cards for any topic
    12. To do list
    13. Tracker.  Habits, hobbies, runs, any activity or sport recorder.  You can record and track any data set you can imagine.
    14. Photo gallery
    15. Chat application
    16. Online exam
    17. Paired programming randomizer for a class
    18. Extracurricular events calendar for a class, department, or club.
    19. Pig Latin generator
    20. Specialized lorem ipsum generator 
    21. Calculator
    22. Collection organizer (i.e. recipes, books, trading cards, etc.)
    23. Project Euler problems
    24. Dice roller
    25. Rewrite Chore Wars or some sort of variant for your floor, house, or team.  
    26. https://www.freecodecamp.org/news/every-time-you-build-a-to-do-list-app-a-puppy-dies-505b54637a5d/ (uses React, but just for inspiration)

These are just ideas to get you thinking …. if you come up with something that is not on this list, but it uses Ruby on Rails and an SQL-type database, it will be a good project for you to use for your individual project.

Project Requirements

At a minimum, your dynamic website must include:

  1. Three web pages
  2. A common navigation bar that appears on all pages and is used to navigate to those three pages
  3. Each web page must include content the equivalent of several paragraphs (if  you cannot think of any content, use a lorem ipsum generator such as: https://www.lipsum.com/), this could be photos or data if appropriate to your website
  4. A database that is used to generate some content on one or more pages.  
  5. A style sheet that controls the colors and fonts of each page in your website.  Your color scheme must not be the default dark grey and white from the Hartl tutorial.
  6. One or more images that are stored in the app/assets/images directory.  Note that images must be size appropriately for the web (approx 300 px by 400 px) and have some connection to the content on your page.  
  7. Must be posted on Heroku (or other deployment site)
  8. Must be available on GitHub (you may leave it private and invite your instructor to view the repo)
  9. Must cite all sources of content that you did not produce. Note that it is an Academic Honesty violation if you use content that you are not authorized to use and don’t cite correctly. This is especially true of an images you use in your site!!

Tasks

  1. Decide on the type of project you want to create as your individual project.  You can change your mind during the semester, but once you create a database, it becomes more challenging to change directions.
  2. Homework: New Rails App
  3. Homework:  Static Website
  4. Homework: Add Ruby to App
  5. Homework: Automated Testing
  6. Homework: Adding a Database
  7. Homework: Adding a Form
  8. Homework: Usability Testing

Assessment

Each homework assignment listed in the Tasks section has its own rubric.  All together, the home assignments count for 10% of your grade.

Additionally, this project counts toward 25% of the grading for your final portfolio assignment and may form the basis for answering reflection questions as part of that portfolio.