Detailed Info: Tasks

Tasks should look like this:

---
id: "<task id (can be anything)>"
urlSlug: "<hyphenated-url (will show in user's browser)>"
name: "<user-facing task name>"
callToActionLink: "<optional destination URL of Call To Action button>"
callToActionText: "<optional custom call to action text for button>"
---

Task content here in markdown format

This is a Markdown file (file extension .md). It contains two sections. At the top of the file is pairs of labelled information enclosed in three dashes --- on top and bottom. This is known as the files "gray matter" and can be thought of like its metadata: information here can be read by the code and used to build the page. Our task expects the following gray matter properties:

• id is the constant ID of this task. IMPORTANT - this should NOT be changed once set.
• urlSlug should be hyphenated and lowercase and will be what shows in the browser address bar
• name is the task title that the user sees
• callToActionLink is the URL for the CTA button. This should be an empty quotation marks "" if does not exist
• callToActionText is the custom text for the CTA button. This should be an empty quotation marks "" if does not exist (if there is a link but no CTA text, it will default to showing "Start Application")

Each should be listed in between the --- lines, in the form key: "value" with no commas after each line.

The content of the task is Markdown formatted. Much like GitHub content, it can have styles and formats applied to it such as: headers, links, bold, italics, numbered lists, bullet lists, and more. There are many guides out there that are reference sheets and tutorials for writing in Markdown syntax. Here's one to get you started.

Notes

As a Markdown file, it can have contextual info added to it. See the guide on adding contextual info

Task files can ALSO have "boxed text" in them, which we used to consider where the "destination" text would go, but can now be expanded and customized for any task.

The syntax is to wrap any content that you want "boxed" on the screen as follows:

||
|---|
| **bold text if you want**: my content here |
| **another bold text**: the next line of content in the box |

To be clear, you need all of those silly pipes and dashed lines around it. Sorry! It's the easiest way to hack markdown into customizing this styling for us.

The vertical characters there are the pipe character, which is the shift+\ key on your keyboard (above enter key). So the whole thing is, line by line:

• || (two pipes on their own line)
• |---| (three dashes enclosed in a pipe on each side, own line)
• | content | (your content, as many lines as you want, with a pipe and a space on the front and end of it

Examples

An example Task file with all fields:

---
id: "check-site-suitability"
urlSlug: "check-site-suitability"
name: "Check Site Suitability"
callToActionLink: "https://www.njconsumeraffairs.gov/regulations/Chapter-28-Board-of-Cosmetology-and-Hairstyling.pdf"
callToActionText: "Read the Requirements"
---

Before selecting a location, verify that the site meets the Department of Consumer Affairs' Board of Cosmetology licensing guidelines. The Board will review your floorplan during the application review process to determine if a site meets board requirements, including considerations around bathroom access and an area designated for cleaning implements and tools, among other items.

To complete this step, you must have:
- Identified potential locations

After you complete this step, you will have:
- Floor plan of the tenant fit-out at your location, drawn to scale.

An example Task file with no data in the optional fields:

---
id: "business-description"
urlSlug: "business-description"
name: "Business Description"
callToActionLink: ""
callToActionText: ""
---

Describe your business, the specific product or service that you will offer and the features that make it special or different from your competitors.