Overview
During the term, you will develop an individual project that will aid you in learning 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.
The content of the website is up to each individual student. There are many, many possibilities for your website: you could develop a website for a club or non-profit organization, such as creating a “library catalog” for the CS department’s fiction book collection on Noyce 3rd floor. 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. If you want, you could make a portfolio website as your project, though you’ll need to think outside the box on how to have it meaningfully include a database.
You will build this site in stages, starting with static HTML & CSS pages and gradually develop a site that incorporates the major functionality of Ruby on Rails with an SQL-type database backend. This process will take about 2 weeks and will overlap beginning to work on the team project. The intent of these assignments and the individual project is to give you practice with the basic technical skills most common to all team projects and organize/contextualize your learning of these tools. Think of the individual project assignments as the “Lab” component found in the introductory sequence of 151-161-207.
If you run into issues where Rails is complaining about bootsnap, add the following line to your Gemfile: “gem ‘bootsnap'”.
Recommended Resources and Readings
- Michael Hartl’s Ruby on Rails Tutorial Chapter 1.3-1.6, using the AWS Cloud 9 or AWS Educate IDE (or MathLan or your own computer). Use GitHub instead of BitBucket.
- How to add an existing project to GitHub using the command line: https://help.github.com/en/articles/adding-an-existing-project-to-github-using-the-command-line
- Github Tutorial
- Codeacademy’s Ruby on Rails tutorial: https://www.codecademy.com/learn/learn-rails
- Ruby & Rails Naming Conventions
If you need a refresher on Unix/Linux command line, see Hartl 1.3 (Table 1.1).
If you have technical issues in using AWS, check the Frequently Asked Questions page. Troubleshooting tips are at the bottom.
Assignment Details
- Do this assignment after getting your Ruby on Rails environment set up and have a Heroku account established. For instructions, see the Hartl tutorial Chapter 1 (and the Getting Started Lab ONLY IF you are using MathLAN or your own computer). You may use either the online IDE or your own computer or MathLAN. If you use a Mac OS computer or are able to use one of the LINUX operating systems on a PC, you may find that running Ruby on Rails on your own computer will give you fewer challenges in the long run.
- Start a new (Ruby on) Rails app. Note that if you want to specify a particular version of Rails in the command line the underscores before and after the version number are essential to avoid an error message.
- Make sure that you can start the rails server and see the Rails default test page. If you are running the app on MathLAN, you will need to specify a different port from 3000 (which can cause a conflict if you are connecting remotely). I have been using the command rails server -p 3001. Then, when you enter the URL in the browser window, use localhost:3001 instead of localhost:3000.
- Put the new app under version control (Git recommended) and make an initial commit
- Create a new GitHub repo and upload the new app to the repo (you will provide the URL to that rep to the instructor). If you are familiar with GitHub, jump down to Step 6.
- Push the new app to Heroku
- Make the homepage state “hello world!” or something else (section 1.3.4 of Hartl). Make sure you push the changes to both GitHub and to Heroku. (See Git – Working with Remotes for how to handle two repos.)
What to hand in (via PioneerWeb):
Create a text file that includes:
- A link to your individual project GitHub repo. If you make your repo private, add me as a collaborator for the term so that I can see it. If you prefer to use a different online version control system for your individual project, you may. Make sure that you allow me to view the repo and provide the link in the document you upload to PioneerWeb. I will use the online repo to view your code for feedback and grading.
- A link to the Heroku deployment of that individual project. Again, if you prefer, you may deploy elsewhere for your individual project. Just make sure that I can view it running on the service or server of your choice.
Scoring (Rubric) 10 points possible
-
- Successfully create a Ruby on Rails site
- Use the correct Ruby version or close (about 2.6 is fine)
- Use the correct Rails version (6.x)
- Put the site under version control (git)
- Uploaded to a GitHub repo that the instructor can access
- Successfully created a Heroku account
- Successfully created a test/dev group and a production group in the Gemfile
- The pg gem added to the Gemfile in production group
- Successfully deployed it on Heroku (or other deployment site such as AWS)
- App says “hello world” or other message on host site (Heroku or AWS or other)