Skip to content

Front end Familiarity Exercises

Alan Wei edited this page Apr 15, 2015 · 12 revisions

Front-end Familiarity

We recognize the need for exercises to introduce the power of front-end development. However, it's hard to design truly introductory exercises. Thus, these exercises are a little more advanced - but wow me!

Introductory

  1. Put a hover tooltip in the scheduler over a section that shows additional information, i.e. SIS Class Number.
  2. In Course Listings, bold the courses that are taught in the upcoming semester (Fall 2015).
  3. Manually code in an easter egg that detects the Konami code - alerts "Easter Egg!"
  4. Make the Save Course button actually work.

Intermediate

  1. Put a hover tip over each Grade Wheel section that shows the percentage.
  2. Hide the sidebar if the screen resolution is less than 960px (can use Javascript!).
  3. Now do the prior exercise with CSS only.
  4. Make the list of professors when viewing a course collapsible when the Enter key is pressed.
  5. Now make that list collapsible by clicking on the dividing line.
  6. Populate the Recommendations tab with Most Popular Courses in your Major(s) (may require ORM familiarity).
  7. Populate the Recommendations tab with the Most Expensive Courses in your Major(s) (may require ORM familiarity).

Advanced

  1. Replace our GradeWheel with a JS-charting tool - HighCharts, FusionCharts, etc.
  2. Put a hover tooltip in the grade-wheel that shows another graph showcasing how GPA changes over time.
  3. Animate events in the scheduler moving around when permuting through different schedules.
  4. On the Recommendations Tab, showcase a section to display a word cloud given a subdepartment.

If all of these are finished - one (1) free Boylan Heights meal, on me, for the DATA and DEV team. Finishing Introductory and Intermediate gets one (1) free Take-it-Away or Little Johns meal, on me. These are not exclusive of the rewards in the ORM exercises - you can get both if you guys do well. Good luck.

Clone this wiki locally