Celadon

Student Portal base dashboard

Installation

1. Create a new vue cli project

vue create myproject

2. Install and initialize vuetify Material Design Framework

vue add vuetify

3. Install cardinal base dashboard to your project

npm i @kinetics254/cardinal-base

4. Register plugin in your mani.js

import Vue from "vue";
import App from "./App.vue";
import cardinal from "@kinetics254/sirius-base";

const options = {
 store,
 router,
};

Vue.use(cardinal, options ); //options to auto add register store and routes

new Vue({
 router,
 store,
 vuetify,
 render: (h) => h(App),
}).$mount("#app");

5. Set Environment Variables

VUE_APP_NAME='CARDINAL'
VUE_APP_VERSION='v0.0.1'
VUE_APP_URL='http://localhost:8080'
VUE_APP_API_BASE_URL='http://localhost:8000/api/v1/'
VUE_APP_SOCKET_URL='http://localhost:6001'

6. Enable Babel Optional chaining feature

// vue.config.js
module.exports = {
    chainWebpack: config => {
        config.module
            .rule('vue')
            .use('vue-loader')
            .tap(options => {
                options.compiler = require('vue-template-babel-compiler')
                return options
            })
    }
}

7. Start your server

npm run serve

Modules

1. Landing module on root (http://domain:port)
2. Auth module for 
    - Login (http://domain:port/auth)
    - password reset (http://domain:port/auth/forgot-password)
3. Dashboard module on (http://domain:port/dashboard)

Services

1. http (axios);
2. sockets (echo with socket io)

Plugins

1. Confirmation Modal
2. Loader

Utilities

1. Filters (Date, Currency, Number, String)
2. Helper (helper functions)

mixins

1. File mixin (base64 file handling)
2. Date mixin (formating dates)
3. Router mixin (scrumble route params)

Dependencies

"dependencies": {
    "epic-spinners": "^1.1.0",
    "file-type": "^16.5.3",
    "moment": "^2.29.1",
    "vue": "^2.6.11",
    "vue-router": "^3.2.0",
    "vuetify": "^2.4.0",
    "vuex": "^3.4.0",
    "axios": "^0.24.0",
    "lodash": "^4.17.21",
    "laravel-echo": "^1.11.3",
    "socket.io-client": "^2.4.0",
    "vue-template-babel-compiler": "^1.0.7",
    "vue-pdf": "^4.2.0"
  }

Authors

Michael - [email protected]

ヽ(•‿•)ノ Happy Coding!