Skip to content

Repository files navigation

A coding assessment

I wrote this over the course of a weekend as a coding exercise. All feedback is welcome.

It's a Next.js project bootstrapped with create-next-app

Visit: pickle-stock-levels.vercel.app

Interesting points include:

  • Genuine TDD - 99% of iterations were test driven
  • Micro commits - try reading it commit by commit from start to finish
  • Homemade SVGs - I wrote my own graph renderer and kept the markup pretty clean

Getting Started

Install dependencies and run dev server

npm i
npm run dev

# or
yarn
yarn dev

# or
pnpm i
pnpm dev

Explore the app

Open http://localhost:3000 with your browser and you'll be redirected to the pickle eample

Example routes:

Issues

Future considerations

  • Add simple e2e tests for happy path and 404
  • Prefer returning simple date strings from API and formatting dates in UI
  • Add visual regression test to main page (i.e. using backstopJS)
  • Show item select on homepage and 404 pages
  • Return allItems from a separate API call e.g. /api/v1/stock and remove allItems from /api/v1/stock/[item]
  • Consider breaking down useChartVariables into multiple hooks
  • Consider better coupling between allItems and expectedItems to avoid mismatches
  • Consider test coverage gaps (or just add tests if any bugs appear)

About

Coding assessment with brief to fetch data and match designs. Check out the semantic HTML table with custom SVG chart.

Topics

Resources

Stars

0 stars

Watchers

1 watching

Forks

Contributors

Languages