V3

CHANGELOG.md

@@ -0,0 +1,15 @@
+# App Framework - Changelog
+
+## App Framework v3
+
+### App Framework v3.0.0-alpha.52
+
+Current development version. Please check the [milestone](https://github.com/scriptPilot/app-framework/milestone/8) for details.
+
+## App Framework v2
+
+App Framework v2 was never released.
+
+## App Framework v1
+
+Please see the [changelog for v1](https://github.com/scriptPilot/app-framework/blob/v1/CHANGELOG.md).

DOCUMENTATION.md

@@ -0,0 +1,75 @@
+# App Framework Documentation
+
+### Setup the Development Environment
+
+- [GitHub Desktop](https://desktop.github.com/) to manage GitHub repositories
+- [Atom](https://atom.io/) as a code editor
+  - Package `language-vue-component` for [Vue single file component](https://vuejs.org/v2/guide/single-file-components.html)
+  - Package `editorconfig` to have same file formatting settings
+- [Node.js](https://nodejs.org) as a local development server
+- [Google Chrome](https://www.google.de/chrome) as a web browser with integrated [development tools](https://developers.google.com/web/tools/chrome-devtools/)
+  - Extension [Vue.js devtools](https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd) to debug the Vue components
+
+
+
+# App Framework 3
+
+App Framework 3 is under development. **For production usage please use [App Framework 1](https://github.com/scriptPilot/app-framework)**. The status of the development can be seen in [this milestone](https://github.com/scriptPilot/app-framework/milestone/8). You are invited to open any V3 related [question, bug or feature request](https://github.com/scriptPilot/app-framework/issues).
+
+## Get Started
+
+1. Run `mkdir <app_name>` to create a new folder for the application
+2. Run `cd <app_name>` to open the newly created folder
+3. Run `echo {} > package.json` to create an empty package file
+4. Run `npm install --save app-framework@latest` to install latest development release
+5. Run `npx app dev` to open application on development server
+
+## CLI Commands
+
+- `npx app test` to run all configured tests
+  - `npx app test eslint` to run ESLint test
+  - `npx app test jest` to run Jest tests
+- `npx app dev` to open application on development server
+- `npx app build` to build application according configuration
+- `npx app deploy ftp` to deploy the PWA to any FTP server
+- `npx app deploy firebase` to deploy the PWA to any FTP server
+
+## Update
+
+Run `npm update` to update to latest development version.
+
+## Contribution
+
+### Setup the Development Environment
+
+- [GitHub Desktop](https://desktop.github.com/) to manage GitHub repositories
+- [Atom](https://atom.io/) as a code editor
+  - Package `language-vue-component` for [Vue single file component](https://vuejs.org/v2/guide/single-file-components.html)
+  - Package `editorconfig` to have same file formatting settings
+- [Node.js](https://nodejs.org) as a local development server
+- [Google Chrome](https://www.google.de/chrome) as a web browser with integrated [development tools](https://developers.google.com/web/tools/chrome-devtools/)
+  - Extension [Vue.js devtools](https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd) to debug the Vue components
+
+### Setup the Repository
+
+1. Run `clone https://github.com/scriptPilot/app-framework` to clone this repository
+2. Run `cd app-framework` to open the repository folder
+3. Run `npm install` to install all dependencies
+4. Run `sudo npm link` to make CLI available in development mode
+
+### Development Workflow
+
+1. Create an [issue](https://github.com/scriptPilot/app-framework/issues) in GitHub
+2. Create a branch with name `issue-<number>`
+3. Develop and test your solution, update the documentation
+4. Commit your changes on the issue branch
+5. Create a pull request with note `closes issue <number>`
+
+Please follow the [Airbnb JavaScript Style Guide](https://github.com/airbnb/javascript).
+
+### Release Workflow
+
+1. Commit all changes
+2. Update the changelog file for the next version
+3. Run `npm publish` to start the publishing process
+  -

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2018
+Copyright (c) 2016-2019
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -0,0 +1,89 @@
+# App Framework v3
+
+> App Framework v3 was never completed. The latest stable version is [App Framework v1](https://github.com/scriptPilot/app-framework/tree/master).
+
+**iOS and Android Apps with HTML & JavaScript. App Framework combines great pieces of open source code to support your whole workflow with useful scripts and your App with powerful plugins. With App Framework, you can spend your time for your next amazing App and not for the tricky stuff around - free and open source!**
+
+![](media/process.png)
+
+## Features
+
+### Core
+
+- [x] **Beautiful User Interface** with native iOS and Material Design elements and transitions, based on [Framework7](https://framework7.io/)
+- [x] **Flexible Routing** for pages, tabs, modals and panels with dynamic routing support, realized with [Framework7-Vue](https://framework7.io/vue/navigation-router.html)
+- [ ] **Multi-language Support** with language files and automatic completeness check according the default language
+- [x] **Offline Capability** to use the app even without any network connection
+- [x] **One Code Base** for all devices with HTML, CSS and JavaScript, realized with [Capacitor](https://capacitor.ionicframework.com/), supporting [ES2015](https://babeljs.io/learn-es2015/)
+- [x] **Single File Components** for powerful but easy to maintain apps, made with [Vue.js](https://vuejs.org/) and [Framework7-Vue](http://framework7.io/vue/)
+- [x] **Project Folder Creation**, lightweight and well-organized, ready to publish on [GitHub](https://github.com/about)
+
+### Scripts
+
+- [x] **Live Development Server** with hot module replacement, powered by [Parcel](https://parceljs.org/)
+- [x] **Test on your own Device** or in any iOS or Android emulator, supported by [Capacitor](https://capacitor.ionicframework.com/), [Xcode](https://developer.apple.com/xcode/) and [Android Studio](https://developer.android.com/studio)
+- [x] **Test Framework** for code correctness and standard conformity with [ESLint](http://eslint.org/) and for unit tests with [Jest](https://facebook.github.io/jest/)
+- [x] **Optimized Build Process** for good scores at [Google Lighthouse](https://developers.google.com/web/tools/lighthouse/), realized with [Parcel](https://parceljs.org/)
+- [ ] **Icon Generation** for favicon, touch icons and splash screens, out of a single image file with [Jimp](https://github.com/oliver-moran/jimp)
+- [x] **Easy Deployment** without downtime to [Apple App Store](https://developer.apple.com/xcode/), [Google Play Store](https://developer.android.com/studio), [Firebase Hosting](https://firebase.google.com/products/hosting/) or any FTP server
+
+### Plugins
+
+- [x] **Native Hardware API Plugins** for iOS and Android devices, realized with [Capacitor](https://capacitor.ionicframework.com/)
+- [ ] **Comprehensive Icon Fonts** like [FontAwesome](http://fontawesome.io/), [Framework7 Icons](http://framework7.io/icons/), [Ion](http://ionicons.com/) and [Material Design Icons](https://material.io/icons/) out of the box
+- [ ] **Phone Frame** around your application on big screens, so you can offer desktop access with charm
+- [ ] **State Restoration** for the history per view, tabs, scroll positions, focus, panels, modals and form inputs
+- [ ] **Global Data Object** to save user data across several application restarts easily
+- [ ] **Vuex Integration** to use the official Vue.js [state management library](https://vuex.vuejs.org/en/intro.html)
+- [ ] **Preloading** for images, fonts and JavaScript files
+- [ ] **Firebase Integration** for several services like [Authentication](https://firebase.google.com/products/auth/), [Realtime Database](https://firebase.google.com/products/realtime-database/), [Firestore](https://firebase.google.com/products/firestore/) and [Cloud Storage](https://firebase.google.com/products/storage/)
+
+## Demo App
+
+The Apple App Store app may be outdated because Apple blocks demo apps from their store now.
+
+[![Download on the App Store Play](media/download-icon-app-store.png)](https://itunes.apple.com/us/app/app-framework-demo/id1203927581?mt=8')
+   
+[![Get it on Google Play](media/download-icon-play-store.png)](https://play.google.com/store/apps/details?id=de.scriptpilot.appframework)
+   
+[![Open as Web App](media/download-icon-firebase.png)](https://demo.app-framework.com)
+
+![Screenshots](media/demo-app-screenshots.png)
+
+## Documentation
+
+### Quick Start
+
+1. Run `mkdir my-app` to create a new project folder
+2. Run `cd my-app` to open the project folder
+3. Run `echo {} > package.json` to create an empty json file
+4. Run `npm install app-framework` for installation
+5. Run `npx app dev` to start the local development server
+
+### Workflow
+
+- Setup your development environment
+- Start and configure your app project
+- Develop your application
+  - Modify the app component
+  - Modify page components and the routing
+  - Use CSS style sheets
+  - [Use image files](./docs/development-images.md)
+  - Use Node packages
+  - Use hardware APIs
+- Test your application
+- Deploy your application
+  - to any FTP server
+  - to Firebase Hosting
+  - to the Apple App Store
+  - to the Android Play Store
+
+### CLI Reference
+
+- Run `npx app test` to run all configured tests
+- Run `npx app test eslint` to run the ESLint test
+- Run `npx app test jest` to run the Jest tests
+- Run `npx app dev` to open the application on the development server
+- Run `npx app build` to build the application according the configuration
+- Run `npx app deploy ftp` to deploy the PWA to any FTP server
+- Run `npx app deploy firebase` to deploy the PWA to Firebase Hosting

cli/app.js

@@ -0,0 +1,74 @@
+#!/usr/bin/env node
+
+// Import modules
+const program = require('commander');
+const fs = require('fs-extra');
+const { execSync } = require('child_process');
+const log = require('../scripts/helper/logger');
+const path = require('../scripts/helper/path');
+const run = require('../scripts/helper/run');
+const { version } = require('../package.json');
+
+// Check if App Framework was cloned and no .enableDevelopmentMode file exists
+if (path.project() === path.framework() && !fs.pathExistsSync(path.project('.enableDevelopmentMode'))) {
+  log.error(`
+    App Framework should be installed as a Node package - not beeing cloned.
+    To contribute to App Frameworkwork itself, please activate the development mode.
+    Please read the documentation for details.
+  `);
+}
+
+// Define default programs
+program
+  .version(version, '-v --version');
+program
+  .command('test [name]')
+  .description('run tests according configuration')
+  .action((name) => {
+    if (name === undefined) {
+      run.script('test');
+    } else if (name === 'eslint') {
+      run.script('test-eslint');
+    } else if (name === 'jest') {
+      run.script('test-jest');
+    } else {
+      log.error('Allowed names are "eslint" and "jest" only.');
+    }
+  });
+program
+  .command('dev')
+  .description('open app on development server with hot-reload')
+  .action(() => {
+    run.script('dev');
+  });
+program
+  .command('build')
+  .description('build application according configuration')
+  .action(() => {
+    run.script('build');
+  });
+program
+  .command('deploy <target>')
+  .description('deploy application to the target (ftp or firebase)')
+  .action((target) => {
+    if (target === 'ftp') {
+      execSync('node ./deploy-ftp.js', { cwd: path.scripts(), stdio: 'inherit' });
+    } else if (target === 'firebase') {
+      execSync('node ./deploy-firebase.js', { cwd: path.scripts(), stdio: 'inherit' });
+    } else {
+      log.error('Allowed targets are "ftp" and "firebase" only.');
+    }
+  });
+
+// Define development programs
+if (path.framework() === path.project()) {
+  program
+    .command('update-f7')
+    .description('update Framework7 demo files')
+    .action(() => {
+      run.script('update-framework7-demo-files');
+    });
+}
+
+// Parse program
+program.parse(process.argv);