Front Rules

File structure

• Follow to Next.js app router structure

/app/xxxx → common

ex)
/app/components/button
/app/hooks/use-common-hooks



/app/[feature]/xxx → feature

ex)
/app/[feature]/components/some-component
_app/[feature]/hooks/use-some-hooks
/app/[feature]/page.tsx

Storybook

• If you add a component to common components, please add it to Storybook so that everyone can look at it easily

Import/Export

• Use index file to export
• Use alias to import, except index file

Styling

• Use even numbers (not odd numbers) for styling. If there are odd numbers in Figma, you can ignore them
• If sizes or colours are weird, you can adjust them while you're making a page. How to look in a web browser is more important.