Dashboard

Build with Vlak
Studio NoordProduction desk / sample records
Local workspaceSeptember 2026
The production floor

Overview

07–13 Sep 2026Job due dates

Sheets recorded

115Supplied production totals

Active jobs

2Due in the selected period

Needs review

1Proofs and briefs to check

Recorded output

Daily samples

Production queue

Local records · no production connection0 reviewed in this tab

Choose a period → find a job or invoice → record a local review

View source
About this download

A standalone Vite and React project using Vlak 0.5.0. Extract the ZIP, open its folder, then run npm install and npm run dev. Requires Node 22.12 or newer.

Jobs, output totals and invoices are sample records. Reviews stay in this tab and do not start production, send payments or mark invoices paid.

Installation and base examples

Inside the interface

A production workspace for reviewing print jobs and invoice records. Week and month views filter work by supplied due dates and update the recorded-output chart. Search by job or client, narrow the stage, then open a brief or invoice to record a local review. Linked invoices lead back to their jobs without changing payment status.

All production figures, due dates, briefs, and invoice amounts are supplied sample records. Review notes and reviewed states stay in this tab; they do not start production, send payments, or mark an invoice paid.

Watch the 20-second walkthrough

A short walkthrough of the working dashboard study.

Components used

Use this as a starting point

Build with Vlak

Install the components, add the stylesheet, and bring your own content. The study’s source shows how the pieces fit together.

React componentsCSS includedMIT licensed

Download the Dashboard starter

Install the package
npm install @noorddev/vlak-react
import "@noorddev/vlak-react/css";
Installation guide View study source

Start with your coding agent

A ready-to-use brief with this study, Vlak’s components, and the design guide.

Component modifications

  • Toggle group switches Week and Month, filtering the job and invoice registers by due date. Card groups the output summary, while the custom bar chart includes exact supplied values in its accessible description.
  • Input searches jobs and clients, Select filters job stages, and Badge preserves the supplied record status. Buttons open briefs, invoice line items, and linked jobs.
  • Textarea records a local review note, and Button marks or undoes the review. Focused mobile detail screens replace the register while keeping Back and the review action reachable.
  • On mobile, Overview, Jobs, and Invoices use bottom navigation. Selecting a job or invoice opens a full-height record screen with scrollable details and a pinned review action. Back returns focus to the record that opened it.