├── .editorconfig ├── .eslintignore ├── .eslintrc.js ├── .gitignore ├── .postcssrc.js ├── .stylintrc ├── README.md ├── babel.config.js ├── package.json ├── quasar.conf.js ├── src-electron ├── electron-flag.d.ts ├── icons │ ├── icon.icns │ ├── icon.ico │ └── linux-512x512.png └── main-process │ ├── electron-main.dev.js │ └── electron-main.js ├── src ├── App.vue ├── assets │ ├── quasar-logo-full.svg │ └── sad.svg ├── boot │ ├── .gitkeep │ └── axios.js ├── components │ ├── .gitkeep │ ├── CharacterDetails.vue │ └── CharactersList.vue ├── css │ ├── app.sass │ └── quasar.variables.sass ├── index.template.html ├── layouts │ └── MyLayout.vue ├── pages │ ├── Error404.vue │ └── Index.vue ├── router │ ├── index.js │ └── routes.js ├── services │ ├── MarvelAPI.js │ └── index.js ├── statics │ ├── app-logo-128x128.png │ └── icons │ │ ├── apple-icon-120x120.png │ │ ├── apple-icon-152x152.png │ │ ├── apple-icon-167x167.png │ │ ├── apple-icon-180x180.png │ │ ├── favicon-16x16.png │ │ ├── favicon-32x32.png │ │ ├── favicon-96x96.png │ │ ├── favicon.ico │ │ ├── icon-128x128.png │ │ ├── icon-192x192.png │ │ ├── icon-256x256.png │ │ ├── icon-384x384.png │ │ ├── icon-512x512.png │ │ ├── ms-icon-144x144.png │ │ └── safari-pinned-tab.svg └── store │ ├── index.js │ ├── module-example │ ├── actions.js │ ├── getters.js │ ├── index.js │ ├── mutations.js │ └── state.js │ └── store-flag.d.ts └── yarn.lock /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | charset = utf-8 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | /dist 2 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | 4 | parserOptions: { 5 | parser: 'babel-eslint', 6 | sourceType: 'module' 7 | }, 8 | 9 | env: { 10 | browser: true 11 | }, 12 | 13 | extends: [ 14 | // https://eslint.vuejs.org/rules/#priority-a-essential-error-prevention 15 | // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules. 16 | 'plugin:vue/essential', 17 | '@vue/standard' 18 | ], 19 | 20 | // required to lint *.vue files 21 | plugins: [ 22 | 'vue' 23 | ], 24 | 25 | globals: { 26 | 'ga': true, // Google Analytics 27 | 'cordova': true, 28 | '__statics': true, 29 | 'process': true, 30 | 'Capacitor': true, 31 | 'chrome': true 32 | }, 33 | 34 | // add your custom rules here 35 | rules: { 36 | // allow async-await 37 | 'generator-star-spacing': 'off', 38 | // allow paren-less arrow functions 39 | 'arrow-parens': 'off', 40 | 'one-var': 'off', 41 | 42 | 'import/first': 'off', 43 | 'import/named': 'error', 44 | 'import/namespace': 'error', 45 | 'import/default': 'error', 46 | 'import/export': 'error', 47 | 'import/extensions': 'off', 48 | 'import/no-unresolved': 'off', 49 | 'import/no-extraneous-dependencies': 'off', 50 | 'prefer-promise-reject-errors': 'off', 51 | 52 | // allow debugger during development only 53 | 'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off' 54 | } 55 | } 56 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | .thumbs.db 3 | node_modules 4 | 5 | # Quasar core related directories 6 | .quasar 7 | /dist 8 | 9 | # Cordova related directories and files 10 | /src-cordova/node_modules 11 | /src-cordova/platforms 12 | /src-cordova/plugins 13 | /src-cordova/www 14 | 15 | # Capacitor related directories and files 16 | /src-capacitor/www 17 | /src-capacitor/node_modules 18 | 19 | # BEX related directories and files 20 | /src-bex/www 21 | /src-bex/js/core 22 | 23 | # Log files 24 | npm-debug.log* 25 | yarn-debug.log* 26 | yarn-error.log* 27 | 28 | # Editor directories and files 29 | .idea 30 | .vscode 31 | *.suo 32 | *.ntvs* 33 | *.njsproj 34 | *.sln 35 | -------------------------------------------------------------------------------- /.postcssrc.js: -------------------------------------------------------------------------------- 1 | // https://github.com/michael-ciniawsky/postcss-load-config 2 | 3 | module.exports = { 4 | plugins: [ 5 | // to edit target browsers: use "browserslist" field in package.json 6 | require('autoprefixer') 7 | ] 8 | } 9 | -------------------------------------------------------------------------------- /.stylintrc: -------------------------------------------------------------------------------- 1 | { 2 | "blocks": "never", 3 | "brackets": "never", 4 | "colons": "never", 5 | "colors": "always", 6 | "commaSpace": "always", 7 | "commentSpace": "always", 8 | "cssLiteral": "never", 9 | "depthLimit": false, 10 | "duplicates": true, 11 | "efficient": "always", 12 | "extendPref": false, 13 | "globalDupe": true, 14 | "indentPref": 2, 15 | "leadingZero": "never", 16 | "maxErrors": false, 17 | "maxWarnings": false, 18 | "mixed": false, 19 | "namingConvention": false, 20 | "namingConventionStrict": false, 21 | "none": "never", 22 | "noImportant": false, 23 | "parenSpace": "never", 24 | "placeholder": false, 25 | "prefixVarsWithDollar": "always", 26 | "quotePref": "single", 27 | "semicolons": "never", 28 | "sortOrder": false, 29 | "stackedProperties": "never", 30 | "trailingWhitespace": "never", 31 | "universal": "never", 32 | "valid": true, 33 | "zeroUnits": "never", 34 | "zIndexNormalize": false 35 | } 36 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | Aplicação criada para o mini-curso de VueJS e Quasar Framework da VoxData Technology 4 | 5 | # Quasar App (workshop-quasar-vue) 6 | A Quasar Framework app 7 | 8 | ## Install the dependencies 9 | ```bash 10 | yarn 11 | ``` 12 | 13 | ### Start the app in development mode (hot-code reloading, error reporting, etc.) 14 | ```bash 15 | quasar dev 16 | ``` 17 | 18 | -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | '@quasar/babel-preset-app' 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "workshop-quasar-vue", 3 | "version": "0.0.1", 4 | "description": "A Quasar Framework app", 5 | "productName": "Quasar App", 6 | "cordovaId": "org.cordova.quasar.app", 7 | "capacitorId": "", 8 | "author": "biasilva ", 9 | "private": true, 10 | "scripts": { 11 | "lint": "eslint --ext .js,.vue src", 12 | "test": "echo \"No test specified\" && exit 0" 13 | }, 14 | "dependencies": { 15 | "@quasar/extras": "^1.6.0", 16 | "axios": "^0.21.1", 17 | "quasar": "^1.9.11" 18 | }, 19 | "devDependencies": { 20 | "@quasar/app": "^1.6.0", 21 | "@vue/eslint-config-standard": "^4.0.0", 22 | "babel-eslint": "^10.0.1", 23 | "devtron": "^1.4.0", 24 | "electron": "^9.4.0", 25 | "electron-builder": "^21.0.0", 26 | "electron-debug": "^3.0.1", 27 | "electron-devtools-installer": "^2.2.4", 28 | "electron-packager": "^14.1.1", 29 | "eslint": "^5.10.0", 30 | "eslint-loader": "^2.1.1", 31 | "eslint-plugin-vue": "^5.0.0" 32 | }, 33 | "engines": { 34 | "node": ">= 8.9.0", 35 | "npm": ">= 5.6.0", 36 | "yarn": ">= 1.6.0" 37 | }, 38 | "browserslist": [ 39 | "last 1 version, not dead, ie >= 11" 40 | ] 41 | } 42 | -------------------------------------------------------------------------------- /quasar.conf.js: -------------------------------------------------------------------------------- 1 | // Configuration for your app 2 | // https://quasar.dev/quasar-cli/quasar-conf-js 3 | 4 | module.exports = function (ctx) { 5 | return { 6 | // app boot file (/src/boot) 7 | // --> boot files are part of "main.js" 8 | // https://quasar.dev/quasar-cli/cli-documentation/boot-files 9 | boot: [ 10 | 'axios' 11 | ], 12 | 13 | // https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css 14 | css: [ 15 | 'app.sass' 16 | ], 17 | 18 | // https://github.com/quasarframework/quasar/tree/dev/extras 19 | extras: [ 20 | // 'ionicons-v4', 21 | // 'mdi-v4', 22 | // 'fontawesome-v5', 23 | // 'eva-icons', 24 | // 'themify', 25 | // 'roboto-font-latin-ext', // this or either 'roboto-font', NEVER both! 26 | 27 | 'roboto-font', // optional, you are not bound to it 28 | 'material-icons' // optional, you are not bound to it 29 | ], 30 | 31 | // https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-framework 32 | framework: { 33 | // iconSet: 'ionicons-v4', // Quasar icon set 34 | // lang: 'de', // Quasar language pack 35 | 36 | // Possible values for "all": 37 | // * 'auto' - Auto-import needed Quasar components & directives 38 | // (slightly higher compile time; next to minimum bundle size; most convenient) 39 | // * false - Manually specify what to import 40 | // (fastest compile time; minimum bundle size; most tedious) 41 | // * true - Import everything from Quasar 42 | // (not treeshaking Quasar; biggest bundle size; convenient) 43 | all: 'auto', 44 | 45 | components: [], 46 | directives: [], 47 | 48 | // Quasar plugins 49 | plugins: ['Notify', 'Loading'] 50 | }, 51 | 52 | // https://quasar.dev/quasar-cli/cli-documentation/supporting-ie 53 | supportIE: false, 54 | 55 | // https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-build 56 | build: { 57 | scopeHoisting: true, 58 | // vueRouterMode: 'history', 59 | // showProgress: false, 60 | // gzip: true, 61 | // analyze: true, 62 | // preloadChunks: false, 63 | // extractCSS: false, 64 | 65 | // https://quasar.dev/quasar-cli/cli-documentation/handling-webpack 66 | extendWebpack (cfg) { 67 | cfg.module.rules.push({ 68 | enforce: 'pre', 69 | test: /\.(js|vue)$/, 70 | loader: 'eslint-loader', 71 | exclude: /node_modules/, 72 | options: { 73 | formatter: require('eslint').CLIEngine.getFormatter('stylish') 74 | } 75 | }) 76 | } 77 | }, 78 | 79 | // https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-devServer 80 | devServer: { 81 | // https: true, 82 | // port: 8080, 83 | open: true // opens browser window automatically 84 | }, 85 | 86 | // animations: 'all', // --- includes all animations 87 | // https://quasar.dev/options/animations 88 | animations: [], 89 | 90 | // https://quasar.dev/quasar-cli/developing-ssr/configuring-ssr 91 | ssr: { 92 | pwa: false 93 | }, 94 | 95 | // https://quasar.dev/quasar-cli/developing-pwa/configuring-pwa 96 | pwa: { 97 | // workboxPluginMode: 'InjectManifest', 98 | // workboxOptions: {}, // only for NON InjectManifest 99 | manifest: { 100 | // name: 'Quasar App', 101 | // short_name: 'Quasar App', 102 | // description: 'A Quasar Framework app', 103 | display: 'standalone', 104 | orientation: 'portrait', 105 | background_color: '#ffffff', 106 | theme_color: '#027be3', 107 | icons: [ 108 | { 109 | 'src': 'statics/icons/icon-128x128.png', 110 | 'sizes': '128x128', 111 | 'type': 'image/png' 112 | }, 113 | { 114 | 'src': 'statics/icons/icon-192x192.png', 115 | 'sizes': '192x192', 116 | 'type': 'image/png' 117 | }, 118 | { 119 | 'src': 'statics/icons/icon-256x256.png', 120 | 'sizes': '256x256', 121 | 'type': 'image/png' 122 | }, 123 | { 124 | 'src': 'statics/icons/icon-384x384.png', 125 | 'sizes': '384x384', 126 | 'type': 'image/png' 127 | }, 128 | { 129 | 'src': 'statics/icons/icon-512x512.png', 130 | 'sizes': '512x512', 131 | 'type': 'image/png' 132 | } 133 | ] 134 | } 135 | }, 136 | 137 | // https://quasar.dev/quasar-cli/developing-cordova-apps/configuring-cordova 138 | cordova: { 139 | // id: 'org.cordova.quasar.app', 140 | // noIosLegacyBuildFlag: true, // uncomment only if you know what you are doing 141 | }, 142 | 143 | 144 | // https://quasar.dev/quasar-cli/developing-capacitor-apps/configuring-capacitor 145 | capacitor: { 146 | // hideSplashscreen: false 147 | }, 148 | 149 | // https://quasar.dev/quasar-cli/developing-electron-apps/configuring-electron 150 | electron: { 151 | bundler: 'builder', // or 'packager' 152 | 153 | packager: { 154 | // https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options 155 | 156 | // OS X / Mac App Store 157 | // appBundleId: '', 158 | // appCategoryType: '', 159 | // osxSign: '', 160 | // protocol: 'myapp://path', 161 | 162 | // Windows only 163 | // win32metadata: { ... } 164 | }, 165 | 166 | builder: { 167 | // https://www.electron.build/configuration/configuration 168 | 169 | // appId: 'workshop-quasar-vue' 170 | }, 171 | 172 | // keep in sync with /src-electron/main-process/electron-main 173 | // > BrowserWindow > webPreferences > nodeIntegration 174 | // More info: https://quasar.dev/quasar-cli/developing-electron-apps/node-integration 175 | nodeIntegration: true, 176 | 177 | extendWebpack (cfg) { 178 | // do something with Electron main process Webpack cfg 179 | // chainWebpack also available besides this extendWebpack 180 | } 181 | } 182 | } 183 | } 184 | -------------------------------------------------------------------------------- /src-electron/electron-flag.d.ts: -------------------------------------------------------------------------------- 1 | // THIS FEATURE-FLAG FILE IS AUTOGENERATED, 2 | // REMOVAL OR CHANGES WILL CAUSE RELATED TYPES TO STOP WORKING 3 | import "quasar/dist/types/feature-flag"; 4 | 5 | declare module "quasar/dist/types/feature-flag" { 6 | interface QuasarFeatureFlags { 7 | electron: true; 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /src-electron/icons/icon.icns: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src-electron/icons/icon.icns -------------------------------------------------------------------------------- /src-electron/icons/icon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src-electron/icons/icon.ico -------------------------------------------------------------------------------- /src-electron/icons/linux-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src-electron/icons/linux-512x512.png -------------------------------------------------------------------------------- /src-electron/main-process/electron-main.dev.js: -------------------------------------------------------------------------------- 1 | /** 2 | * This file is used specifically and only for development. It installs 3 | * `electron-debug` & `vue-devtools`. There shouldn't be any need to 4 | * modify this file, but it can be used to extend your development 5 | * environment. 6 | */ 7 | 8 | // Install `electron-debug` with `devtron` 9 | require('electron-debug')({ showDevTools: true }) 10 | 11 | // Install `vue-devtools` 12 | require('electron').app.on('ready', () => { 13 | let installExtension = require('electron-devtools-installer') 14 | installExtension.default(installExtension.VUEJS_DEVTOOLS) 15 | .then(() => {}) 16 | .catch(err => { 17 | console.log('Unable to install `vue-devtools`: \n', err) 18 | }) 19 | }) 20 | 21 | // Require `main` process to boot app 22 | require('./electron-main') 23 | -------------------------------------------------------------------------------- /src-electron/main-process/electron-main.js: -------------------------------------------------------------------------------- 1 | import { app, BrowserWindow, nativeTheme } from 'electron' 2 | 3 | try { 4 | if (process.platform === 'win32' && nativeTheme.shouldUseDarkColors === true) { 5 | require('fs').unlinkSync(require('path').join(app.getPath('userData'), 'DevTools Extensions')) 6 | } 7 | } catch (_) { } 8 | 9 | /** 10 | * Set `__statics` path to static files in production; 11 | * The reason we are setting it here is that the path needs to be evaluated at runtime 12 | */ 13 | if (process.env.PROD) { 14 | global.__statics = require('path').join(__dirname, 'statics').replace(/\\/g, '\\\\') 15 | } 16 | 17 | let mainWindow 18 | 19 | function createWindow () { 20 | /** 21 | * Initial window options 22 | */ 23 | mainWindow = new BrowserWindow({ 24 | width: 1000, 25 | height: 600, 26 | useContentSize: true, 27 | webPreferences: { 28 | // Change from /quasar.conf.js > electron > nodeIntegration; 29 | // More info: https://quasar.dev/quasar-cli/developing-electron-apps/node-integration 30 | nodeIntegration: QUASAR_NODE_INTEGRATION, 31 | 32 | // More info: /quasar-cli/developing-electron-apps/electron-preload-script 33 | // preload: path.resolve(__dirname, 'electron-preload.js') 34 | } 35 | }) 36 | 37 | mainWindow.loadURL(process.env.APP_URL) 38 | 39 | mainWindow.on('closed', () => { 40 | mainWindow = null 41 | }) 42 | } 43 | 44 | app.on('ready', createWindow) 45 | 46 | app.on('window-all-closed', () => { 47 | if (process.platform !== 'darwin') { 48 | app.quit() 49 | } 50 | }) 51 | 52 | app.on('activate', () => { 53 | if (mainWindow === null) { 54 | createWindow() 55 | } 56 | }) 57 | -------------------------------------------------------------------------------- /src/App.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 12 | -------------------------------------------------------------------------------- /src/assets/quasar-logo-full.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 19 | 21 | 43 | 45 | 46 | 48 | image/svg+xml 49 | 51 | 52 | 53 | 54 | 55 | 60 | 63 | 66 | 69 | 75 | 79 | 83 | 87 | 91 | 95 | 99 | 103 | 104 | 105 | 106 | 107 | 113 | 118 | 126 | 133 | 142 | 151 | 160 | 169 | 178 | 187 | 188 | 189 | 190 | 191 | 192 | -------------------------------------------------------------------------------- /src/assets/sad.svg: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /src/boot/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/boot/.gitkeep -------------------------------------------------------------------------------- /src/boot/axios.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import axios from 'axios' 3 | 4 | Vue.prototype.$axios = axios 5 | -------------------------------------------------------------------------------- /src/components/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/components/.gitkeep -------------------------------------------------------------------------------- /src/components/CharacterDetails.vue: -------------------------------------------------------------------------------- 1 | 21 | 52 | -------------------------------------------------------------------------------- /src/components/CharactersList.vue: -------------------------------------------------------------------------------- 1 | 50 | 88 | -------------------------------------------------------------------------------- /src/css/app.sass: -------------------------------------------------------------------------------- 1 | // app global css in Sass form 2 | -------------------------------------------------------------------------------- /src/css/quasar.variables.sass: -------------------------------------------------------------------------------- 1 | // Quasar Sass (& SCSS) Variables 2 | // -------------------------------------------------- 3 | // To customize the look and feel of this app, you can override 4 | // the Sass/SCSS variables found in Quasar's source Sass/SCSS files. 5 | 6 | // Check documentation for full list of Quasar variables 7 | 8 | // Your own variables (that are declared here) and Quasar's own 9 | // ones will be available out of the box in your .vue/.scss/.sass files 10 | 11 | // It's highly recommended to change the default colors 12 | // to match your app's branding. 13 | // Tip: Use the "Theme Builder" on Quasar's documentation website. 14 | 15 | $primary : #027BE3 16 | $secondary : #26A69A 17 | $accent : #9C27B0 18 | 19 | $dark : #1D1D1D 20 | 21 | $positive : #21BA45 22 | $negative : #C10015 23 | $info : #31CCEC 24 | $warning : #F2C037 25 | -------------------------------------------------------------------------------- /src/index.template.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | <%= htmlWebpackPlugin.options.productName %> 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /src/layouts/MyLayout.vue: -------------------------------------------------------------------------------- 1 | 26 | 27 | 38 | -------------------------------------------------------------------------------- /src/pages/Error404.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | 24 | -------------------------------------------------------------------------------- /src/pages/Index.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 36 | -------------------------------------------------------------------------------- /src/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import VueRouter from 'vue-router' 3 | 4 | import routes from './routes' 5 | 6 | Vue.use(VueRouter) 7 | 8 | /* 9 | * If not building with SSR mode, you can 10 | * directly export the Router instantiation 11 | */ 12 | 13 | export default function (/* { store, ssrContext } */) { 14 | const Router = new VueRouter({ 15 | scrollBehavior: () => ({ x: 0, y: 0 }), 16 | routes, 17 | 18 | // Leave these as they are and change in quasar.conf.js instead! 19 | // quasar.conf.js -> build -> vueRouterMode 20 | // quasar.conf.js -> build -> publicPath 21 | mode: process.env.VUE_ROUTER_MODE, 22 | base: process.env.VUE_ROUTER_BASE 23 | }) 24 | 25 | return Router 26 | } 27 | -------------------------------------------------------------------------------- /src/router/routes.js: -------------------------------------------------------------------------------- 1 | 2 | const routes = [ 3 | { 4 | path: '/', 5 | component: () => import('layouts/MyLayout.vue'), 6 | children: [ 7 | { path: '', component: () => import('pages/Index.vue') } 8 | ] 9 | } 10 | ] 11 | 12 | // Always leave this as last one 13 | if (process.env.MODE !== 'ssr') { 14 | routes.push({ 15 | path: '*', 16 | component: () => import('pages/Error404.vue') 17 | }) 18 | } 19 | 20 | export default routes 21 | -------------------------------------------------------------------------------- /src/services/MarvelAPI.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios' 2 | 3 | const API_KEY = 'PUBLIC_API_HERE' 4 | const TS = 'timestamp' 5 | const HASH = 'gerar um md5(Timestamp+privateKey+publicKey)' 6 | 7 | export default class MarvelAPI { 8 | constructor () { 9 | this.api = 'https://gateway.marvel.com:443/v1/public/' 10 | this.http = axios 11 | } 12 | list = async (limit) => { 13 | try { 14 | const response = await this.http.get(`${this.api}characters?ts=${TS}&apikey=${API_KEY}&hash=${HASH}&limit=${limit}`) 15 | return response.data 16 | } catch (error) { 17 | throw new Error(error) 18 | } 19 | } 20 | show = async (characterID) => { 21 | try { 22 | const response = await this.http.get(`${this.api}characters/${characterID}?apikey=${API_KEY}&ts=${TS}&hash=${HASH}`) 23 | return response.data 24 | } catch (error) { 25 | throw new Error(error) 26 | } 27 | } 28 | search = async (name) => { 29 | try { 30 | const response = await this.http.get(`${this.api}characters?ts=${TS}&apikey=${API_KEY}&hash=${HASH}&name=${name}`) 31 | return response.data 32 | } catch (error) { 33 | throw new Error(error) 34 | } 35 | } 36 | } 37 | 38 | -------------------------------------------------------------------------------- /src/services/index.js: -------------------------------------------------------------------------------- 1 | import MarvelAPI from './MarvelAPI' 2 | 3 | export { MarvelAPI } -------------------------------------------------------------------------------- /src/statics/app-logo-128x128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/app-logo-128x128.png -------------------------------------------------------------------------------- /src/statics/icons/apple-icon-120x120.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/apple-icon-120x120.png -------------------------------------------------------------------------------- /src/statics/icons/apple-icon-152x152.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/apple-icon-152x152.png -------------------------------------------------------------------------------- /src/statics/icons/apple-icon-167x167.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/apple-icon-167x167.png -------------------------------------------------------------------------------- /src/statics/icons/apple-icon-180x180.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/apple-icon-180x180.png -------------------------------------------------------------------------------- /src/statics/icons/favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/favicon-16x16.png -------------------------------------------------------------------------------- /src/statics/icons/favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/favicon-32x32.png -------------------------------------------------------------------------------- /src/statics/icons/favicon-96x96.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/favicon-96x96.png -------------------------------------------------------------------------------- /src/statics/icons/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/favicon.ico -------------------------------------------------------------------------------- /src/statics/icons/icon-128x128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/icon-128x128.png -------------------------------------------------------------------------------- /src/statics/icons/icon-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/icon-192x192.png -------------------------------------------------------------------------------- /src/statics/icons/icon-256x256.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/icon-256x256.png -------------------------------------------------------------------------------- /src/statics/icons/icon-384x384.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/icon-384x384.png -------------------------------------------------------------------------------- /src/statics/icons/icon-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/icon-512x512.png -------------------------------------------------------------------------------- /src/statics/icons/ms-icon-144x144.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/biancassilva/vue-quasar-marvelAPI-demo/a9df35a4880c073daeaffab6c9f11bc9d2b13499/src/statics/icons/ms-icon-144x144.png -------------------------------------------------------------------------------- /src/statics/icons/safari-pinned-tab.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/store/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Vuex from 'vuex' 3 | 4 | // import example from './module-example' 5 | 6 | Vue.use(Vuex) 7 | 8 | /* 9 | * If not building with SSR mode, you can 10 | * directly export the Store instantiation 11 | */ 12 | 13 | export default function (/* { ssrContext } */) { 14 | const Store = new Vuex.Store({ 15 | modules: { 16 | // example 17 | }, 18 | 19 | // enable strict mode (adds overhead!) 20 | // for dev mode only 21 | strict: process.env.DEV 22 | }) 23 | 24 | return Store 25 | } 26 | -------------------------------------------------------------------------------- /src/store/module-example/actions.js: -------------------------------------------------------------------------------- 1 | export function someAction (/* context */) { 2 | } 3 | -------------------------------------------------------------------------------- /src/store/module-example/getters.js: -------------------------------------------------------------------------------- 1 | export function someGetter (/* state */) { 2 | } 3 | -------------------------------------------------------------------------------- /src/store/module-example/index.js: -------------------------------------------------------------------------------- 1 | import state from './state' 2 | import * as getters from './getters' 3 | import * as mutations from './mutations' 4 | import * as actions from './actions' 5 | 6 | export default { 7 | namespaced: true, 8 | getters, 9 | mutations, 10 | actions, 11 | state 12 | } 13 | -------------------------------------------------------------------------------- /src/store/module-example/mutations.js: -------------------------------------------------------------------------------- 1 | export function someMutation (/* state */) { 2 | } 3 | -------------------------------------------------------------------------------- /src/store/module-example/state.js: -------------------------------------------------------------------------------- 1 | export default { 2 | // 3 | } 4 | -------------------------------------------------------------------------------- /src/store/store-flag.d.ts: -------------------------------------------------------------------------------- 1 | // THIS FEATURE-FLAG FILE IS AUTOGENERATED, 2 | // REMOVAL OR CHANGES WILL CAUSE RELATED TYPES TO STOP WORKING 3 | import "quasar/dist/types/feature-flag"; 4 | 5 | declare module "quasar/dist/types/feature-flag" { 6 | interface QuasarFeatureFlags { 7 | store: true; 8 | } 9 | } 10 | --------------------------------------------------------------------------------