isystk/vue3-typescript-sample

vue3-typescript-sample

🌙 vue3-typescript-sample

📗 プロジェクトの概要

Vue3 の学習用サンプルアプリケーションです。

利用している技術

• Vue3
• Vuetify
• Typescript
• AWS Cognito
• Sass
• Tailwind Css
• jest
• ESLint & Prettier
• i18n
• husky
• StoryBook

🌐 Demo

https://vue3-typescript-sample.vercel.app

🔧 環境構築

# Node.js のバージョンを確認
$ node -v
v16.13.1
# yarnのインストール
$ npm install -g yarn
# モジュールのインストール
$ yarn

📦 ディレクトリ構造

.
├── LICENSE
├── README.md
├── dist
├── index.html
├── jest.config.js
├── src
│    ├── App.vue
│    ├── __tests__
│    ├── assets
│    ├── components
│    ├── constants
│    ├── env.d.ts
│    ├── layouts
│    ├── locales
│    ├── main.ts
│    ├── pages
│    ├── plugins
│    ├── router.ts
│    ├── services
│    ├── store
│    ├── stories
│    ├── styles
│    └── utilities
├── tailwind.config.js
├── tsconfig.jest.json
├── tsconfig.json
├── tsconfig.node.json
├── vite.config.ts
└── yarn.lock

🖊️ 起動方法

$ yarn dev

💬 使い方

# run test
$ yarn test

# run lintfix & prettier
$ yarn fix

# run storybook
$ yarn storybook

🎨 参考

プロジェクト	概要
Vuetify 3 Beta	Vuetify 3 Beta
Material Design Icons	Material Design Icons
Tailwind CSS	Tailwind CSS
vee-validate	vee-validate
husky v6 のインストール方法と使い方。lint-staged も導入して、品質を保とう	husky v6 のインストール方法と使い方。lint-staged も導入して、品質を保とう

🎫 Licence

MIT

👀 Author

isystk