- Quasar: strong tool for build web app & mobile app
- Pinia: store & state management Plugin
- Firebase and Firestore: realtime database using no-sql
- Electron for Quasar: preview for desktop application
- Cordova for Quasar: preview for mobile apllication
- PWA: download preview to local like browser
Twitter-meta requires Node >=14
This template should help get you started developing with Vue 3 in Quasar.
Create a quasar repo from this template on GitHub.
- See Configuring quasar.conf.js.
- Prefix size of electron browser.
- Format the time using date formatter.
- Get component style animation.
- Style config editorconfig.
- Download virtualbox.
you should follow step-by-step order clearly
# star this repo and open the terminal
git clone https//github.com/vue-core/twitter-meta.git
npm install
# you need globaly install through npm install -g @quasar/cli
quasar dev
quasar build
npm install firebase
- Go to Netlify and select your clone,
OK
along the way, and your App will be live in a minute. - not PWA
- output: /dist/spa
- script: quasar build
- PWA
- output: /dist/pwa
- script: quasar build -m pwa
quasar new boot firebase
------------------------
quasar.conf.js -> boot:['firebase']
- In this scenerio, I resume that I buiding on main-opartion is MacOS & building on sub-operation by virtual machine
View in main-operation -> quasar dev -m electron
-> src-electron/electron-main.js
mainWindow = new BrowserWindow({
width: 1024,
minWidth: 1024,
height: 600,
})
-------------------------------------------------
View in sub-operation -> quasar build -m electron
-> quasar.conf.js
electron: {
packager: {
platform: 'win32'
},
}
open the path /dist/electron/Twitter.exe on virtual machine
npm install -g cordova
-----------------------
For iOS
require: xcodebuild
local build: quasar dev -m cordova -T ios
switching to iOS WkWebView (cd src-cordova):
# add ScrollEnabled-Preference to Config.xml
<platform name="ios">
<preference name="ScrollEnabled" value="true" />
</platform>
# install Ionic-Webview-plugin
cordova plugin add cordova-plugin-ionic-webview
# check type_list
cordova run ios --list
cd ..
quasar dev -m cordova -T ios -e <type_list>
--------------------------------------------
For Android
require: android studio
config: AVD manager
connect: pixel 2, ect... (that available)
local build: quasar dev -m cordova -T android
- Relax with bee-music sound
- Learning front-end web full course at Front-end course.
- Learn Snake Game tutorial at Snake-Game-OOP
- Learn Java for new beginner at Java training
- Make flip card game at flip-card
- Learn computer architecture at architecture
- Pratice UI/UX at league-fo-legend
β€οΈ Support me
We are looking for sponsors to join us to have better community reach and impact.
π° License
-
This project is distributed under the MIT License.
-
Copyright of @thuongtruong1009, 2022.