Skillz: Hello, Codepen!

Description

Codepen.io describes itself as a “playground for the front-end side of the web”. As a tool, it is designed with experimentation, collaboration, and learning in mind. Perfect! It is also a tool we will use for just those things in this class. To work this skillz, you need to do the following:

  • Create a Codepen account, if you don’t already have one. Peruse the help page as needed for guidance on getting around.
  • Create a new pen and experiment with JavaScript, HTML, and/or CSS (minimally, “Hello, World!” is sufficient, but your should try to push yourself)
  • Browse the pens others have created. Find one your think is interesting and study how the pen was created. Fork the pen and try to tweak it, break, and make it yours.
  • Embed both pens into your portal page, or subsidiary page for this class linked to from your portal.

Materials & Technology

  • Codepen.io account
  • Web browser

Objective

  1. Familiarize self with Codepen.io’s interface and offerings.

Deliverable

  • HTML page posted to portal (or portal itself) with two pens embedded: one self created, the other forked and altered.
  • URL to Skillz posted to corresponding dropbox basket in eCompanion course shell

[This Skillz is posted to both GWD238 and GWDB223]

Comments are closed.