Skip to content

DCSLab Upgrade Steps

Jump to bottom Edit New page
GitzJoey edited this page May 4, 2024 · 92 revisions

Steps when major changes (either Laravel or Vue) happen.

Root (DCSLab) folder

  • Create README.md and update the contents
  • Create CHANGELOG.md and update the contents
  • Create .gitignore 
    node_modules
/.vscode
  • Clone Laravel 
    composer create-project laravel/laravel api
  • Create Vue with Vite 
    npm create vite@latest

√ Project name: ... web
√ Select a framework: » vue
√ Select a variant: » TypeScript
  • Activating ESLint in the project 
    create .vscode/settings.json

{
   "eslint.workingDirectories": [
        "./web"
   ]
}

API (Laravel)

  • Composer install 
    composer require laravel/fortify santigarcor/laratrust tightenco/ziggy vinkla/hashids
  • Update composer.json 
    "name": "gitzjoey/dcslab",
"type": "project",
"description": "DCSLab - Laravel Always Updated ERP System",
"keywords": ["ERP", "framework", "laravel", "gitzjoey"],

...

   "psr-4": {
       "Tests\\": "tests/",
       "Tests\\Unit\\Actions\\": "tests/Unit/Actions/",
       "Tests\\Feature\\API\\": "tests/Feature/API/"
   }
  • Update README.md
  • Remove Unused FrontEnd Files 
    1. vite.config.js
2. views/welcome.blade.php
   create .gitkeep file
3. remove resources/css folder
4. remove resources/js folder
  • Install Vendor 
    1. Fortify
php artisan vendor:publish --provider="Laravel\Fortify\FortifyServiceProvider"

2. Laratrust
php artisan vendor:publish --tag="laratrust"
php artisan vendor:publish --tag="laratrust-seeder"

php artisan laratrust:setup 
php artisan laratrust:seeder 

3. Lang
php artisan lang:publish

4. CORS
php artisan config:publish cors

5. Install Laravel as API
php artisan install:api
  • Register Providers 
    1. Open bootstrap/providers.php
  • Copy Sources 
    1. database
   a. factories
   b. migrations
   c. seeders
2. lang
3. stubs
4. app
   a. Actions
   b. Console/Commands
   c. Enums
   d. Events
   e. Http [Controllers, Requests, Resources]
   f. Listeners
   g. Models
   h. Policies
   i. Rules
   j. Services
   k. Traits
  • Config
    1. app.php
    2. cors.php 
      'paths' => ['api/*',
            'sanctum/csrf-cookie',
            'register',
            'login',
            'logout',
            'forgot-password',
            'user/confirmed-password-status',
            'user/confirm-password',
            'user/two-factor-authentication',
            'user/confirmed-two-factor-authentication',
            'user/two-factor-qr-code',
            'user/two-factor-recovery-codes',
            'user/two-factor-secret-key',
            'two-factor-challenge',
           ],       ```


'exposed_headers' => ['precognition', 'precognition-success'],

'supports_credentials' => true,
    3. laratrust_seeder.php 
      Copy over.
    4. logging.php 
       'cachehits' => [
     'driver' => 'single',
     'path' => storage_path('logs/cachehits.log'),
     'level' => 'info',
 ],

 'perfs' => [
     'driver' => 'single',
     'path' => storage_path('logs/performances.log'),
     'level' => 'info',
 ],
    5. dcslab.php 
      Copy over.
  • Update after copy sources 
    1. bootstrap/app.php
   $middleware->statefulApi();
   $middleware->alias([
       'guest' => RedirectIfAuthenticatedJson::class,
       'precognitive' => HandlePrecognitiveRequests::class,
       'validate.user' => ValidateUser::class,
   ]);
       
2. Providers/AppServiceProvider.php
   Event::listen(
       LoginEventListener::class,
       LogoutEventListener::class,
   );

Web (Vue)

  • Copy from Starter folder
  • Update package.json 
    1. Change Name
"name": "web",

2. Remove unused dependencies packages
"@ckeditor/ckeditor5-build-classic"
"@ckeditor/ckeditor5-build-decoupled-document"
"@ckeditor/ckeditor5-build-inline"
"@fullcalendar/daygrid"
"@fullcalendar/interaction"
"@fullcalendar/list"
"@fullcalendar/timegrid"
"@fullcalendar/vue3"
"@googlemaps/js-api-loader"
"@googlemaps/markerclusterer"

"@vuelidate/core"
"@vuelidate/validators"
"chart.js"

"dropzone"

"highlight.js"
"js-beautify"
"leaflet"
"leaflet.markercluster"

"xlsx"
"zoom-vanilla.js"

3. Remove unused devDependencies packages
"@types/dropzone"

"@types/google.maps"
"@types/js-beautify"
"@types/leaflet"
"@types/leaflet.markercluster"
  • NPM Install 
    npm install --save-dev @types/node

npm install --save-dev eslint vue-eslint-parser @typescript-eslint/parser eslint-plugin-vue@next @typescript-eslint/eslint-plugin eslint-config-prettier

npm install vue-i18n ziggy-js axios laravel-precognition-vue
  • Remove unused folder 
    src\assets\images
src\assets\json

src\base-components\Calendar
src\base-components\Chart
src\base-components\Ckeditor
src\base-components\Dropzone
src\base-components\FileIcon
src\base-components\GoogleMapLoader
src\base-components\ImageZoom
src\base-components\LeafletMapLoader
src\base-components\Preview
src\base-components\Progress
src\base-components\TinySlider

src\layouts\SimpleMenu\Divider.vue
src\layouts\SimpleMenu\SimpleMenu.vue
src\layouts\TopMenu

src\stores\simple-menu.ts
src\stores\top-menu.ts

src\types\ckeditor.d.ts
  • Add/Copy New Folder/Files 
    src\assets\css\customs

src\base-components\AlertPlaceholder
src\base-components\DataList
src\base-components\Form\FormLayout
src\base-components\LoadingOverlay
src\base-components\UserLocation

src\axios
src\lang
src\services
src\validation

src\types\enums
src\types\resources
src\types\systems
  • Require To Update
    1. app.css 
      @import "simplebar/src/simplebar.css";
/* @import "dropzone/dist/dropzone.css"; */
@import "tabulator-tables/dist/css/tabulator.css";
@import "tom-select/dist/css/tom-select.css";
/* @import "zoom-vanilla.js/dist/zoom.css"; */
@import "toastify-js/src/toastify.css";
/* @import "highlight.js/styles/github.css"; */
@import "tippy.js/dist/tippy.css";
@import "tippy.js/themes/light.css";
@import "tippy.js/dist/svg-arrow.css";
@import "tippy.js/animations/shift-away.css";
/* @import "tiny-slider/dist/tiny-slider.css"; */
/* @import "leaflet/dist/leaflet.css"; */
/* @import "leaflet.markercluster/dist/MarkerCluster.css"; */


@import "./components/_global.css";
@import "./components/_intro.css";
/* @import "./components/_zoom-in.css"; */
@import "./components/_image-fit.css";
@import "./components/_typing-dots.css";
@import "./components/_scrollbar-hidden.css";
@import "./components/_box.css";
/* @import "./components/_tiny-slider.css"; */
@import "./components/_tippy.css";
@import "./components/_toastify.css";
/* @import "./components/_zoom-vanilla.css"; */
@import "./components/_tom-select.css";
/* @import "./components/_ckeditor.css"; */
@import "./components/_litepicker.css";
/* @import "./components/_full-calendar.css"; */
@import "./components/_tabulator.css";


@import "./customs/_loading-overlay.css";
    2. Update src/utils/faker.ts
    3. Update README.md
    4. Update index.html
  • Create env file 
    .env.example & .env.production

VITE_APP_NAME=DCSLab
VITE_BACKEND_URL=http://localhost:8000
  • Add entry to .gitignore 
    /.vscode
.env
Add a custom sidebar
Clone this wiki locally