E36: Your Choice with Semantic UI

In the IslandSnow WOD, you were guided through the rebuilding of a web page using Semantic UI.

Now is your chance to practice that skill on a site of your choosing. Here are the instructions:

  1. Choose a page to rebuild using Semantic UI.

    • It should not require a login to access.
    • It must not have been built using Semantic UI. (That would make things too easy.)
    • No other student in either section of ICS 314 has chosen that page.
    • Your page must enable you to implement at least one menu, at least two “sections”, and customize formats (margins, lists, background colors etc.) Your page should be roughly equivalent in complexity to the Island Snow WOD page. Just like that WOD, you can choose to implement only a subset of a complex page.
  2. When you’ve chosen your page, post a link to the page to the #your_choice channel to claim it. Make sure before you post your link that no other student has posted the same link first!

  3. Create a github repo to hold your code.

  4. Implement your page using Semantic UI in a manner similar to the Island Snow WOD. Avoid using their CSS code—the point of this is to use Semantic UI for as much of the styling as possible. If you need to use a little CSS to customize a Semantic UI component, that’s OK. Note that links do not need to work, and you don’t need to include more than three menu items in a dropdown list. Just demonstrate that you could implement all the items if you wanted to.

  5. When you are done, commit your code to GitHub.

You do not have to keep track of how long this takes. To grade this WOD, we should be able to clone your repo and preview your site in IntelliJ.

Submission Instructions

By the time and date indicated on the Schedule page, submit this assignment via Laulima.

Your submission should contain:

In addition, please post two screen shots of a browser window to the #your_choice channel: (1) your chosen page, and (2) your re-creation of it using Semantic UI. We all want to see what you came up with!