diff --git a/app/gulpfile.js b/app/gulpfile.js
index 98911857e7f403cfec1aa7e897ea733a5672a812..2d9c6aaa2e91b0e7baf7f72405fa6aac9892228a 100644
--- a/app/gulpfile.js
+++ b/app/gulpfile.js
@@ -1,16 +1,21 @@
-const path = require('path')
-const fs = require('fs')
-const gulp = require('gulp')
-// const readlineSync = require('readline-sync')
-const fsExtra = require('fs-extra')
+import path from 'path'
+import { readFileSync, writeFileSync, accessSync, R_OK, W_OK, readdirSync, statSync } from 'fs'
+import gulp from 'gulp'
+import { ensureDirSync, ensureFileSync } from 'fs-extra/esm'
+import { fileURLToPath } from 'url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const { join, basename, extname } = path
+const { task } = gulp
 
 let objToWrite = {}
 let paths = {
-  langFolder: path.join(__dirname, 'src/lang/'),
-  srcFolder: path.join(__dirname, 'src/')
+  langFolder: join(__dirname, 'src/lang/'),
+  srcFolder: join(__dirname, 'src/')
 }
 
-gulp.task('geni18n', function (done) {
+task('geni18n', function (done) {
   // let projPath = readlineSync.question("Please enter project path (path of 'src' folder)  ")
   // projPath = projPath + '/'
   let projPath = paths.srcFolder
@@ -30,13 +35,13 @@ function backUpI18nFile (projPath) {
   let backUpFolderPath = paths.langFolder + 'backup'
   let backUpFilePath = backUpFolderPath + '/en_' + dformat + '.json'
   try {
-    fsExtra.ensureDirSync(backUpFolderPath)
+    ensureDirSync(backUpFolderPath)
   } catch (error) {
     console.log('Cannot create backup folder...')
   }
   let enFilePath = paths.langFolder + 'en.json'
-  let content = fs.readFileSync(enFilePath, 'utf8')
-  fs.writeFileSync(backUpFilePath, JSON.parse(JSON.stringify(content)))
+  let content = readFileSync(enFilePath, 'utf8')
+  writeFileSync(backUpFilePath, JSON.parse(JSON.stringify(content)))
 }
 
 function paddingZero (number) {
@@ -59,18 +64,18 @@ function createDvJson (projPath, objToWrite) {
     }
   }
   let dvFilePath = paths.langFolder + 'dv.json'
-  fs.writeFileSync(dvFilePath, JSON.stringify(objToWrite))
+  writeFileSync(dvFilePath, JSON.stringify(objToWrite))
 }
 
 function readPrevi18n () {
   let enFilePath = paths.langFolder + 'en.json'
   try {
-    fs.accessSync(enFilePath, fs.R_OK | fs.W_OK)
-    let content = fs.readFileSync(enFilePath, 'utf8')
+    accessSync(enFilePath, R_OK | W_OK)
+    let content = readFileSync(enFilePath, 'utf8')
     objToWrite = JSON.parse(content)
   } catch (e) {
     console.log('en.json file is missing...')
-    fsExtra.ensureFileSync(enFilePath)
+    ensureFileSync(enFilePath)
     console.log('Created en.json file...')
     objToWrite = {}
   }
@@ -93,8 +98,8 @@ function i18nGenerator (projPath, langArray, defaultLanguage) {
         if (fileList !== null && fileList !== undefined && fileList.length > 0) {
           for (i = 0; i < len; i++) {
             let file = fileList[i]
-            let keyPrefix = path.basename(file).split('.')[0]
-            let content = fs.readFileSync(file, 'utf8')
+            let keyPrefix = basename(file).split('.')[0]
+            let content = readFileSync(file, 'utf8')
             let i18nContentsToBeReplaced = content.match(regex)
             let translatedAdded = content
             if (i18nContentsToBeReplaced != null && i18nContentsToBeReplaced !== '' && i18nContentsToBeReplaced !== undefined && i18nContentsToBeReplaced.length > 0) {
@@ -108,14 +113,14 @@ function i18nGenerator (projPath, langArray, defaultLanguage) {
                 translatedAdded = translatedAdded.replace(extractKeyFrom, replacement)
                 prepareI18nObject(keyPrefix, key, value)
               }
-              fs.writeFileSync(file, translatedAdded)
+              writeFileSync(file, translatedAdded)
             }
             if (i === (len - 1)) {
               console.log('\n\n')
               console.log('Internationalization successfully done on ' + (i + 1) + ' files')
               console.log('\n\n')
               let enFilePath = paths.langFolder + 'en.json'
-              fs.writeFileSync(enFilePath, JSON.stringify(objToWrite))
+              writeFileSync(enFilePath, JSON.stringify(objToWrite))
               createDvJson(projPath, objToWrite)
             }
           }
@@ -126,13 +131,13 @@ function i18nGenerator (projPath, langArray, defaultLanguage) {
 }
 
 let walkSync = function (dir, filelist) {
-  let files = fs.readdirSync(dir)
+  let files = readdirSync(dir)
   filelist = filelist || []
   files.forEach(function (file) {
-    if (fs.statSync(dir + file).isDirectory()) {
+    if (statSync(dir + file).isDirectory()) {
       filelist = walkSync(dir + file + '/', filelist)
     } else {
-      if (path.extname(file) === '.vue') {
+      if (extname(file) === '.vue') {
         filelist.push(dir + file)
       }
     }
diff --git a/app/package.json b/app/package.json
index 3adeaabe6f034da913bbdcd7b7eca11393a9944f..057d20262212bc03e6ba24dcd2775fad54d4a8ba 100644
--- a/app/package.json
+++ b/app/package.json
@@ -18,7 +18,7 @@
     "core-js": "^3.24.1",
     "crypto-js": "^3.1.9-1",
     "daisyui": "^2.51.6",
-    "fs-extra": "^8.1.0",
+    "fs-extra": "^11.1.1",
     "material-design-icons": "^3.0.1",
     "pinia": "^2.1.3",
     "pinia-plugin-persistedstate": "^3.1.0",
diff --git a/app/src/views/I18Demo.vue b/app/src/views/I18Demo.vue
index 38b145a32b320a0c645fa88af094877136f031d5..66be585410cb43361452e94561f164f57095a892 100644
--- a/app/src/views/I18Demo.vue
+++ b/app/src/views/I18Demo.vue
@@ -20,6 +20,7 @@
 								v-model="lang"
 							/>
 						</div>
+						<h2><strong> *** {{ $t("home.homeTitle") }} *** </strong> </h2>
 						<div class="data alt">
 							<component1 class="my-3" />
 							<component2 />