Project overview

Our project structure

We work in monorepo architecture. Most of the business logic is organized into smaller packages. The idea is that we could maintain these packages in a separate repository, and still make them work, but there are some common tools which helps to develop the components.

.
├── ...
├── packages         # This folder contains the primary packages.
│   ├── button       # A package's root folder
│   ├── core         # Package that contains global logics and utilities
│   ├── stratus      # Proxy package to simple handling dependencies
│   └── ...
├── tests            # This folder *NOT* containing the test files.
├── docs             # The main development environment
├── cli              # our CLI's source files
└── ...
Copy

#Co-location structure

We store all the related files in one package. A package contains all the tests, styles, documentation, etc. in its own folder:

button
├── __docs__
│   └── Button.mdx            # The documentation file for the component
├── __tests__
│   └── Button.spec.tsx       # Test file for the component
├── __stories__
│   └── Button.stories.tsx    # Storybook example of the component
├── components
│   ├── Button.tsx            # A component main source file
│   └── Button.style.ts       # Emotion styled components
├── hooks                     # If the component needs hook you can place it here
├── package.json
├── index.ts                  # Export all the components and hooks here
├── types.d.ts                # We have hand-made types, you must write the types here
└── README.md                 # Do not document the component here.
                              # It's just a link to our main docpage.
Copy

#Next up

• Work on Stratus