CODAC Monorepo

What's inside?

This monorepo includes the following packages/apps:

Apps and Packages

Apps:

• codac-ts-next-tailwind: a Next.js app with Tailwind CSS dedicated to UI components develoment
• codac-ts-next-lms: a Next.js app with Tailwind CSS dedicated to making a standadole LMS interface
• codac-ts-next-mui: a Next.js app with MUI v5
• web: another Next.js app with Tailwind CSS Packages:
• codac-administration: a graphql types code generation app using codegen. It generates types and custom react hooks to query the CODAC administration backend
• codac-ui: a stub React component library with Tailwind CSS shared by both codac-ts-next-tailwind and storybook applications
• eslint-config-custom: eslint configurations (includes eslint-config-next and eslint-config-prettier)
• tailwind-config: Commonalized theme of Tailwind Tailwind CSS
• tsconfig: tsconfig.jsons used throughout the monorepo

Each package/app is 100% TypeScript.

Building Types packages/codac-administration

This page generates the types and custom Apollo GraphQl hooks from a Strapi backend Strapi Admin GraphQl Playground

Building packages/codac-ui

This example is setup to build packages/codac-ui and output the transpiled source and compiled styles to dist/. This was chosen to make sharing one tailwind.config.js as easy as possible, and to ensure only the CSS that is used by the current application and its dependencies is generated.

Another option is to consume packages/ui directly from source without building. If using this option, you will need to update your tailwind.config.js to be aware of your package locations, so it can find all usages of the tailwindcss class names.

For example, in tailwind.config.js:

  content: [
    // app content
    `src/**/*.{js,ts,jsx,tsx}`,
    // include packages if not transpiling
    "../../packages/**/*.{js,ts,jsx,tsx}",
  ],

Utilities

This Turborepo has some additional tools already setup for you:

• Tailwind CSS for styles
• TypeScript for static type checking
• ESLint for code linting
• Prettier for code formatting

Contributing

• Fork the project
• Create your feature branch (git checkout -b feature/AmazingFeature)
• Make your changes
• Commit your changes (git commit -m 'Add some AmazingFeature')
• Push to the branch (git push origin feature/AmazingFeature)
• Open a pull request