Instructions
Study the following required Demos-n-Deets demos:
As a first step toward acquiring the skills covered in the demos, you must read the demos; however, you will not learn much by simply reading them in a passive manner. Instead, you should digest the demos in a more active manner. Thus, the active reading assignments are designed to help ensure that you get the most out of your first reading of the demos.
For the active reading assignment, follow these key instructions:
-
Perform the steps. As you read through each assigned demo, you must perform the steps of the demo on your machine.
-
Think deeply about each step. Resist the urge to do mindless copying and pasting of code, because it will undermine your engagement with the material, and thus, decrease the learning benefits. Instead, try to think deeply about each step, so you are clear on the rationale for the step and how it works.
-
Name screenshot files as specified. Each required screenshot for an Active Reading has a label (e.g., sa2-ar-03). For each screenshot file, the name of the file should match the specified label exactly.
- Important! All screenshots must include your computer’s desktop or your terminal prompt in the background so that it is recognizable as your machine. Also, all screenshots of web pages must display the entire URL of the page in the browser’s location bar. (Watch out, as some browsers like to hide parts of the URL unless you click on it.)
How to Start Each Active Reading Demo
Each time you go to do an Active Reading for a new demo, start like this:
cd
into your workspace folder. You’re going to download a new project folder, and this is where it will go.
- Find the “Base App Code Branch” link in the demo. It links to a GitHub repo that contains the base app. It also mentions the branch that the base app is on.
- Do a
git clone
of the base app repo to download it, giving the working directory a custom name, like sa1-ar-model-classes
.
cd
into the new working directory.
- Do a
git switch
to the base app branch specified in the demo.
- Open the working directory in VS Code.
What to Submit
- For the New/Create Forms demo, three screenshots:
- sa4-ar-01: one of the new-resource page with an empty form,
- sa4-ar-02: one of the index page after a successful form submission, with the success notification showing, and
- sa4-ar-03: one of the new-resource page after an unsuccessful new/create form submission, with the failure notification and error-message annotations showing.
- For the Edit/Update Forms demo, three screenshots:
- sa4-ar-04: one of the edit-resource page for one of the seed model objects with no changes yet made to the form entries,
- sa4-ar-05: one of the show page after a successful edit/update form submission, with the success notification showing, and
- sa4-ar-06: one of the edit-resource page after an unsuccessful form submission, with the failure notification and error-message annotations showing.
- For the Destroy Actions demo, three screenshots:
- sa4-ar-07: one of the controller class, with the
destroy
method visible,
- sa4-ar-08: one of the HTML.ERB index view template, with the
button_to
call associated with the destroy
action showing, and
- sa4-ar-09: one of the index page after a model object was successfully destroyed, with the success notification showing.
- For the Validation Helpers demo, two screenshots:
- sa4-ar-10: one of the model class, with the added validation visible,
- sa4-ar-11: one of the console with both calls to
valid?
showing.