@phongpham2140051/design-system v0.1.0

Holicay UI

🚀 Starter for Next JS 15+, Tailwind CSS 3 and TypeScript ⚡️, Made with developer experience first: Next.js (app routing), ESLint, Prettier, Husky, Lint-Staged, Jest, PostCSS, Storybook, Vercel actions ⚡️

Getting Started

To make it easy for you to get started with GitHub, here's a list of recommended next steps.

First, run the development server:

npm run storybook
# or
yarn storybook
# or
pnpm storybook
# or
bun storybook

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

:rocket: Features

Developer experience first:

• Next.js for Static Site Generator
• Type checking TypeScript
• Integrate with Tailwind CSS
• Storybook for components documentation
• Strict Mode for TypeScript and React 18
• Linter with ESLint
• Code Formatter with Prettier
• Husky for Git Hooks
• Lint-staged for running linters on Git staged files
• Testing with Jest and react-testing-library
• Absolute Imports using @ prefix
• Nextjs custom layouts
• T3 env Manage your environment variables with ease
• Message convention for git
• Maximize lighthouse score
• GH actions
• Components generation with Plop and atomic design convention

System Requirements

• Node.js: >= 18.18 || current 18.20.4 || later
• macOS, Windows (including WSL), and Linux are supported.

🚀 Deploy to production

Install command on Vercel:

corepack use pnpm@`pnpm -v` && pnpm i

You can see the results locally in production mode with:

pnpm build

pnpm start

:gear: Generating components

pnpm generate Button

Result (if you chose an atom component):

└── components
      └── atoms
        └── Button
          ├── index.ts
          ├── Button.stories.tsx
          ├── Button.test.tsx
          └── Button.tsx

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

🤝 Contributing

1. Fork this repository;
2. Create your branch: git checkout -b my-awesome-contribution;
3. Commit your changes: git commit -m 'feat: Add some awesome contribution';
4. Push to the branch: git push origin my-awesome-contribution.

License

Licensed under the MIT License, Copyright © 2024

See LICENSE for more information.