grailed-code / frontend-interview Goto Github PK

Grailed Frontend Interview

This application is a simple e-commerce store intended to serve as a template for interviewees to demonstrate their ability to work within an existing codebase. The patterns, components, and code are not what is necessarily used in the Grailed codebase, and some of them are intentionally complex to provide interviewees with an opportunity to show how well they pick up and emulate existing patterns.

(back to top)

(back to top)

• Home / - demo page for existing UI components that can be reused
• Shop Page /shop - a page that listings products and will let users sort, filter, and find producs they like

(back to top)

This application can be run either locally or in codesandbox. It currently exists as a synced template that can be forked here

Install NPM packages

npm install

Run the application

npm run dev

Run the tests

npm run test

Lint

npm run link

(back to top)

The application has an established project structure just like you'd see in any existing codebase.

• __tests__ - All tests are kept here. The internal structure of this folder should map to the rest of the project structure. For example, the tests for the lib/utils/classnames.ts file lives at __tests__/lib/utils/classnames.test.ts.
• components - This folder is where components are kept. They are nested as closely to the page they're built for, with the highest level components being ones that are universal/global/reusable.
  • components/pages - the components for the pages. The Next pages folder should use very minimal JSX/ui code and it should be kept here as much as possible
  • components/ui - universal UI components
• lib - shared non-ui components
• pages - the NextJS pages folder

(back to top)