Make custom renderers codelab more goal-oriented

[BeksOmega]

Category

• Codelabs

Component

Custom renderers codelab

Describe the bug

Right now the custom renderers codelab reads more like a guide than like an actual codelab. It gives background information, and tells you about a bunch of different options for customizing connection shapes. This is especially apparent on the opening page, where it tells you you're going to build 4 renderers in one codelab.

Expected behavior

Codelabs should have a clear goal, and should walk you through the steps (each building on the last) to reach that goal.

I think this is actually a pretty simple fix. Instead of framing it as four renderers, frame it as one, and be clear at the beginning and end of each step how it helps reach the goal.

Additional context

1. The "guide" style information can be provided in that format in the actual devsite guides.
2. The codelab also needs some copy editting, e.g. import './renderers/javascript'; should be import './renderers/custom';