[ 2023 ] How to setup Vue 3 + Vite + Tailwind + Pinia + Typescript in 6 easy steps
![[ 2023 ] How to setup Vue 3 + Vite + Tailwind + Pinia + Typescript in 6 easy steps](https://i.ytimg.com/vi/0jk3aleuwUM/maxresdefault.jpg)
Get started with web development in 6 easy steps in 2023 [Vue3, Vite, Typescript, Pinia, Tailwind]. Build a client side app with Vue, with page navigation, authentication…
#vuejs #vue #typescript #tailwind #webdevelopment #html #css
Source Code: https://github.com/rmsmech/Tutorials/tree/master/VUEJS/ViteVueSetup2023
Chapters:
00:00 Demo
00:17 Introduction
00:36 Step 1 : Install Vite, Vue 3, Typescript
01:52 Step 2 : Install Vue-Router
02:40 Setp 3 : Install Pinia
03:11 Step 4 : Install Tailwind css
04:07 Step 5: Initialize Packages
04:42 Step 5-A: Setup PostCSS
05:13 Step 5-B (OPTIONAL): Setup Prettier Plugin (Optional)
06:18 Step 5-C (OPTIONAL): Setup Path Aliases (Optional)
10:14 ===== DEMO: Clean up existing demo project
11:36 Step 5-D: Setup Tailwind CSS
14:11 ===== DEMO: Check if tailwind works
21:09 ===== TIPS: Install some useful VSkkkkkmCODE Extensions for VUE
21:50 ===== DEMO: Create some dummy components to test Router
23:16 Step 6-A: Create Router
30:29 ===== DEMO: Check if Router works
37:10 Step 6-B: Create Pinia Store
39:27 Step 6-C (OPTIONAL) : Install & setup auto-import plugin
44:15 ===== DEMO: Build the app to setup Authorization and test Stores.
Suggest:
☞ Vue js Tutorial Zero to Hero || Brief Overview about Vue.js || Learn VueJS 2023 || JS Framework
☞ Is Vue.js 3.0 Breaking Vue? Vue 3.0 Preview!
☞ Learn Vue.js from scratch 2018
☞ Vue.js Tutorial: Zero to Sixty