https://github.com/dlodeprojuicer/ionic-vue-mobile-template-07
Drip - The template is based on @TheMadute's mobile app design concept for Drip Footwear.
https://github.com/dlodeprojuicer/ionic-vue-mobile-template-07
ionic ionic-framework ionic-vue vue3 xcode
Last synced: 3 months ago
JSON representation
Drip - The template is based on @TheMadute's mobile app design concept for Drip Footwear.
- Host: GitHub
- URL: https://github.com/dlodeprojuicer/ionic-vue-mobile-template-07
- Owner: dlodeprojuicer
- Created: 2021-02-12T17:29:36.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2021-05-24T15:26:15.000Z (about 4 years ago)
- Last Synced: 2025-04-10T05:58:26.166Z (3 months ago)
- Topics: ionic, ionic-framework, ionic-vue, vue3, xcode
- Language: Vue
- Homepage: https://ionic-vue-mobile-template-07.netlify.app/
- Size: 5.14 MB
- Stars: 15
- Watchers: 1
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Drip Footwear mobile app concept
[](https://app.netlify.com/sites/ionic-vue-mobile-template-07/deploys)
The template is based on [@TheMadute's](https://twitter.com/TheMadute/status/1357581896868364289) mobile app design concept for Drip Footwear.
[Demo](https://ionic-vue-mobile-template-07.netlify.app)
## Project setup
```
npm install
```
### Run on the browser - development
```
npm run serve
```
### Linter
```
npm run lint
```
## Design
## Native
Using [Capacitor](https://capacitorjs.com/docs/getting-started) for native builds
## Prepare native builds
### iOS testing and distribution
1. Download the latest Xcode
2. `npm run build`
3. `npx cap add ios`
3. `npx cap copy`
4. `npx cap open ios` Xcode takes a few seconds to index the files; keep an eye at the top of Xcode's window for progress.
[Not compulsory] For sanity check click on the play button in the top left. This will prepare and run the app in a simulator, if all goes well you should be able to run the app and click around. If not, create an issue 🤷 and I will have a look.
### Android testing and distribution
1. Download the latest Android Studio
2. `npm run build`
3. `npx cap add android`
3. `npx cap copy`
4. `npx cap open android` Android Studio takes a few seconds to index the files, keep an eye at the bottom of Android Studio for progress.
5. Testing - When indexing is complete, look for a green play button. Click the play button and it will launch the app in an emulator ([See here to setup Emulator](https://developer.android.com/studio/run/managing-avds)) or on the phone, if a phone is connected via USB.
## Official Docs
- [Getting started](https://ionicframework.com/vue)
## Resources
- [Newsletter](https://mailchi.mp/b9133e120ccf/sqan8ggx22) - Signup to my Ionic Vue newsletter to get templates and other Ionic Vue updates in your inbox!
- [YouTube Channel](https://www.youtube.com/channel/UC5jZ6srZuLwt3O3ZtuM1Dsg) - Subscribe to my YouTube channel.
- [Ionic Vue Tempalates](https://tinyurl.com/y2gl39dk) - Free Ionic Vue Templates.
- [Ionic Vue VSCode Snippets](https://marketplace.visualstudio.com/items?itemName=dlodeprojuicer.ionicvuesnippets) - This extension adds ionic-vue snippets. Quickly add ionic-vue component code by simply typing iv. The iv prefix will show a range of snippets to choose from.
## Affiliates
I want to keep doing these templates for free for as long as possible. I have joined a few affiliate programs to help take care of the costs.
- [Pixeltrue](https://www.pixeltrue.com/?via=simo) - High-quality illustrations that will help you build breath-taking websites.
- [Getrewardful](https://www.getrewardful.com/?via=simo) - Create your own affiliate program.
Alternatively, you can buy me a coffee 
## Credits
- [@TheMadute](https://twitter.com/TheMadute/status/1357581896868364289) - Design
## Contact
- [@dlodeprojuicer](https://twitter.com/dlodeprojuicer) on Twitter