dgd03146/jung

All about me

Turborepo starter

This is an official starter Turborepo.

Using this example

Run the following command:

npx create-turbo@latest

What's inside?

This Turborepo includes the following packages/apps:

Apps and Packages

• docs: a Next.js app
• web: another Next.js app
• @repo/ui: a stub React component library shared by both web and docs applications
• @repo/eslint-config: eslint configurations (includes eslint-config-next and eslint-config-prettier)
• @repo/typescript-config: tsconfig.jsons used throughout the monorepo

Each package/app is 100% TypeScript.

Utilities

This Turborepo has some additional tools already setup for you:

• TypeScript for static type checking
• ESLint for code linting
• Prettier for code formatting

Build

To build all apps and packages, run the following command:

cd my-turborepo
pnpm build

Develop

To develop all apps and packages, run the following command:

cd my-turborepo
pnpm dev

Remote Caching

Turborepo can use a technique known as Remote Caching to share cache artifacts across machines, enabling you to share build caches with your team and CI/CD pipelines.

By default, Turborepo will cache locally. To enable Remote Caching you will need an account with Vercel. If you don't have an account you can create one, then enter the following commands:

cd my-turborepo
npx turbo login

This will authenticate the Turborepo CLI with your Vercel account.

Next, you can link your Turborepo to your Remote Cache by running the following command from the root of your Turborepo:

npx turbo link

Useful Links

Learn more about the power of Turborepo:

• Tasks
• Caching
• Remote Caching
• Filtering
• Configuration Options
• CLI Usage

jung's Issues

Set up tsup to design-system workspace

📌 Issue

• Set up tsup to design-systme workspace

☑️ To-do

• Install tsup to design-systme workspace

⚙️ Set up nestjs api workspace to monorepo

📌 Issue

• Set up nestjs api workspace

☑️ To-do

• Install Nestjs to api workspace

Develop and Document New Design System Components

📌 Issue

• The design system needs to be expanded with new components to enhance its functionality and usability. These components need to be implemented and documented in the Storybook.

☑️ To-do

• Develop the following new components for the design system.
• Document each component in the Storybook with usage examples and properties.

New Components:

• Accordion
• Tooltip
• Tag
• Button Group
• Progress

Set up Framer-motion

📌 Issue

• Set up Framer motion

☑️ To-do

• Install Framer motion to web workspace

Develop and Document New Design System Components

📌 Issue

• The design system needs to be expanded with new components to enhance its functionality and usability. These components need to be implemented and documented in the Storybook.

☑️ To-do

• Develop the following new components for the design system.
• Document each component in the Storybook with usage examples and properties.

New Components:

• Accordion
• Tooltip
• Tag
• Button Group
• Progress
• Tabs

Organize monorepo folder structure

📌 Issue

• Apply an absolute path for another workspaces

☑️ To-do

• Apply an absolute path for design-system workspaces
• Organaize packages folder

⚙️ Set up admin workspace with vite

📌 Issue

• Set up admin workspace with vite

☑️ To-do

• Create admin workspace with vite

Implement design system UI Storybook

📌 Issue

• The design system currently lacks a comprehensive Storybook to showcase the available components and their usage. This makes it difficult for developers to discover and utilize the components effectively.

☑️ To-do

Implement all existing design system components to the Storybook

Foundation

• Color

Components

• Button
• Badge
• Select
• Input
• Textarea
• Card
• Checkbox
• Typography
  • Heading
  • Text
• Tag
• Accordion
• Tabs
• Tooltip
• Toast
• Progress

⚙️ Set up storybook to workshop workspace

📌 Issue

• Set up storybook to workshop workspace

☑️ To-do

• Install Storybook

Set up Testing Libraries

📌 Issue

• Set up Testing lIbraries.

☑️ To-do

• Set up React Testing Library
• Set up Jest
• Set up PlayWright
• Set up Vitest

Set up zustand

📌 Issue

• ⚙️ Set up zustand

☑️ To-do

• Install zustand to admin, web workspace

⚙️ Set up turborepo with monorepo

📌 Issue

• Set up turborepo with monorepo

☑️ To-do

• Install turborepo with monorepo
• Install with pnpm workspace

Set up husky & lint-staged

📌 Issue

• Set up husky & lint-staged

☑️ To-do

• Install husky & lint-staged apply with biome

Set up i18N

📌 Issue

• Set up i18N

☑️ To-do

• Set up i18N to web workspace

🎨 Configuring Vanilla Extract and Setting Tokens in Workshop workspace

📌 Issue

Setting up vanilla extract tokens for design system

☑️ To-do

• Set up sprinkles
• Set up global Styles
• Set up global font
• Set up theme

Set up Tanstack Query

📌 Issue

• Set up Tanstack Query

☑️ To-do

• Install Tanstack Query to web, admin workspace

Refactor Design System

📌 Issue

• Refactoring Design system components

☑️ To-do

• Simplify the Box component and improve the type
• Refactor all design system components type
• Refactor Typography Component with compound pattern
• Refactor Card Component and modify UI
• Improve accessibility for components

Set up Vanilla-Extract

📌 Issue

• Set up Vanilla-Extract

☑️ To-do

• Install Vanilla-Extract
• Check if works in other workspaces. Workshop and Web and Admin

Creating Design System Components

📌 Issue

• Creating Design System Components at design system workspace

☑️ To-do

Layout

• Divider
• Flex
• Grid
• Stack
• Container

Components

• Box
• Button
• Badge
• List
• Select
• Input
• Textarea
• Card
• Checkbox
• Typography
  • Heading
  • Text

Later

• Calendar
• Skeleton
• Toast
• Modal
• Accordion
• Form
• Tabs
• Avatar

Set up biome

📌 Issue

• Set up biome

☑️ To-do

• Install Biome and apply to monorepo