[wip] Docs: Add First dashboard tutorial (PR 3)

[sometimescasey]

(reopened from https://github.com/evidence-dev/evidence/pull/2047 bc I merged from main instead of next and messed up the revert)

Description

Work in progress for a "first 10 minutes in Evidence" sort of tutorial.

Taking inspiration from https://guides.rubyonrails.org/getting_started.html.

Feel free to Slack me comments or leave feedback directly on the PR!

Checklist

• [ ] For UI or styling changes, I have added a screenshot or gif showing before & after
• [ ] I have added a changeset
• [x] I have added to the docs where applicable
• [ ] I have added to the VS Code extension where applicable

[changeset-bot[bot]]

⚠️ No Changeset found

Latest commit: 3a7fdb297c5a446b420f755f194e29f0e4bb6c91

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[netlify[bot]]

✅ Deploy Preview for evidence-development-workspace ready!

Name	Link
🔨 Latest commit	3a7fdb297c5a446b420f755f194e29f0e4bb6c91
🔍 Latest deploy log	https://app.netlify.com/sites/evidence-development-workspace/deploys/66b6581a2e8ce70008897042
😎 Deploy Preview	https://deploy-preview-2099--evidence-development-workspace.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify[bot]]

✅ Deploy Preview for evidence-test-env ready!

Name	Link
🔨 Latest commit	3a7fdb297c5a446b420f755f194e29f0e4bb6c91
🔍 Latest deploy log	https://app.netlify.com/sites/evidence-test-env/deploys/66b6581a2e8ce70008897044
😎 Deploy Preview	https://deploy-preview-2099--evidence-test-env.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify[bot]]

✅ Deploy Preview for next-docs-evidence ready!

Name	Link
🔨 Latest commit	3a7fdb297c5a446b420f755f194e29f0e4bb6c91
🔍 Latest deploy log	https://app.netlify.com/sites/next-docs-evidence/deploys/66b6581a51c168000844446a
😎 Deploy Preview	https://deploy-preview-2099--next-docs-evidence.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[sometimescasey]

Set your project token as the CHROMATIC_PROJECT_TOKEN environment variable

Feel free to either disregard this failure or share the token w me, either works :)

[archiewood]

we can ignore these chromatic tests for this

[ItsMeBrianD]

@archiewood what's the status on this?

[sometimescasey]

@archiewood what's the status on this?

Hey @ItsMeBrianD! Still WIP on some edits - apologies for the delay, I was away last week as well.

I'm going to redo the images so the highlight colors are consistent shape/colors, and I think that's the only big change remaining.

@archiewood let me know if there's anything else from your feedback doc that I haven't already addressed which is a blocker

[archiewood]

@sometimescasey the only other thing I noticed - seems like the header numbering needs to be reset?

[vercel[bot]]

@sometimescasey is attempting to deploy a commit to the Evidence Team on Vercel.

A member of the Team first needs to authorize it.

[sometimescasey]

Hey @archiewood - apologies again for the massive delay, but I found some time this weekend:

• Images updated for consistent color / shape of highlighting
• Removed unused images
• Section numbering updated
• Edited some of the explanation sections on sources and markdown queries based on your feedback
• Went over the doc for tone; took the most colloquial sounding bits and made them a bit more formal, but I thought re-writing the whole thing in passive voice would be overkill. Let me know your thoughts

It looks like you guys have moved to Vercel for deploys and I'm not authorized to your org, but I verified that this succeeds locally:

export NODE_OPTIONS="--max-old-space-size=4096"
pnpm build:docs
pnpm run preview:docs

Let me know your feedback and next steps!

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 9, 2024 6:02pm
next-docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 9, 2024 6:02pm

[archiewood]

@sometimescasey thank you for this!

This is ready to go.

I've made a few edits:

• Integrated styling and components to use Evidence components where possible
• A bit of terminology we have recently updated: Project/Dashboard -> App
• There was one query name which was being reused which is not allowed, so I appended _top100

[sometimescasey]

Amazing!! Thanks for getting it to the finish line. And gratitude to everyone for the patience around this as well - I know it took a long time. 🙏🏻 Curious re whether folks will find it helpful!

[mcrascal]

@sometimescasey this is a fantastic contribution, thank you! I expect this will become one of the most popular pages across all of our web properties. Thousands of people are going to read this and be helped by this.

[sometimescasey]

@mcrascal thanks so much, comment made my day :) Hope that is true! Let me know how it lands with users