diff --git a/components/About.js b/components/About.js
index 81e6a20e..69d8007d 100644
--- a/components/About.js
+++ b/components/About.js
@@ -30,10 +30,10 @@ class About extends React.Component {
                                               tel (+31)-20-598 7731/7718
                                                     </div>
                                                     <div className="item">
-                                                        <a className="ui label animated zoomIn" href="mailto:frank.van.harmelen@vu.nl"><i className="mail icon"></i> Prof. &nbsp; Frank van Harmelen &nbsp; &nbsp; &nbsp; &nbsp;</a>
+                                                        <a className="ui label animate__animated animate__zoomIn" href="mailto:frank.van.harmelen@vu.nl"><i className="mail icon"></i> Prof. &nbsp; Frank van Harmelen &nbsp; &nbsp; &nbsp; &nbsp;</a>
                                                     </div>
                                                     <div className="item">
-                                                        <a className="ui label animated zoomIn" href="mailto:a.khalili@vu.nl@vu.nl"><i className="mail icon"></i> Dr. &nbsp; Ali Khalili &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</a>
+                                                        <a className="ui label animate__animated animate__zoomIn" href="mailto:a.khalili@vu.nl@vu.nl"><i className="mail icon"></i> Dr. &nbsp; Ali Khalili &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</a>
                                                     </div>
                                                 </div>
                                             </div>
diff --git a/components/Home.js b/components/Home.js
index 0cbf4e58..a533fbc6 100644
--- a/components/Home.js
+++ b/components/Home.js
@@ -10,7 +10,7 @@ class Home extends React.Component {
                             <div className="ui segment content">
                                 <h2 className="ui header">Linked Data Reactor (LD-R)</h2>
                                 <p>
-                                    <img className="ui left floated image animated zoomIn" src="/assets/img/ld-reactor.gif" alt="ld-reactor" />
+                                    <img className="ui left floated image animate__animated animate__zoomIn" src="/assets/img/ld-reactor.gif" alt="ld-reactor" />
                                     Linked Data Reactor (LD-Reactor or LD-R) is a framework to develop <b>reactive</b> and <b>reusable</b> User Interface components for <b>Linked Data applications</b>. LD-Reactor utilizes Facebook's <a href="https://facebook.github.io/react/">ReactJS</a> components, <a href="https://facebook.github.io/flux">Flux</a> architecture and Yahoo!'s <a href="http://fluxible.io/">Fluxible</a> framework for isomorphic Web applications.
                                     It also exploits <a href="http://semantic-ui.com/"> Semantic-UI </a> framework for flexible UI themes.
                                     LD-Reactor aims to apply the idea of component-based application development into <a href="http://www.w3.org/RDF/">RDF</a> data model hence enhancing current user interfaces to view, browse and edit <a href="http://linkeddata.org/">Linked Data</a>.<br/> More information is available at <a href="http://ld-r.org">ld-r.org</a>.<br/><br/>
diff --git a/components/admin/UsersList.js b/components/admin/UsersList.js
index 76a0a441..0dcf1ea8 100644
--- a/components/admin/UsersList.js
+++ b/components/admin/UsersList.js
@@ -92,7 +92,7 @@ class UsersList extends React.Component {
                 if (node.v !== user.id && !parseInt(node.isSuperUser)) {
                     i++;
                     return (
-                        <div className="item animated fadeIn" key={index}>
+                        <div className="item animate__animated animate__fadeIn" key={index}>
                             <div className="ui horizontal list">
                                 <NavLink className="item" routeName="resource" href={'/dataset/' + encodeURIComponent(currentComponent.props.UserStore.datasetURI) + '/resource/' + encodeURIComponent(node.v)}>
                                     <div className="content">
@@ -132,7 +132,7 @@ class UsersList extends React.Component {
                                     : ''}
                             </div>
                             {this.props.UserStore.msgSent ?
-                                <div className="ui message info animated pulse">Your message was successfully sent to all users...</div>
+                                <div className="ui message info animate__animated animate__pulse">Your message was successfully sent to all users...</div>
                                 : parseInt(user.isSuperUser) ?
                                     <div className="ui segment inverted blue">
                                         <Form>
diff --git a/components/dataset/DatasetPager.js b/components/dataset/DatasetPager.js
index b9ce221f..9e850e4a 100644
--- a/components/dataset/DatasetPager.js
+++ b/components/dataset/DatasetPager.js
@@ -271,7 +271,7 @@ class DatasetPager extends React.Component {
                     </div>
                 }
                 {!this.state.saveMode ? '' :
-                    <div className="ui secondary segment bottom attached animated slideInDown">
+                    <div className="ui secondary segment bottom attached animate__animated animate__slideInDown">
                         <div className="ui icon input fluid">
                             <input ref="saveInput" type="text" placeholder="Write a description for your query and press enter to save..." value={this.state.saveText} onChange={this.handleSaveTextChange.bind(this)} onKeyDown={this.handleSaveKeyDown.bind(this)}/>
                             <i className="save icon"></i>
@@ -279,7 +279,7 @@ class DatasetPager extends React.Component {
                     </div>
                 }
                 {!this.state.searchMode ? '' :
-                    <div className="ui secondary segment bottom attached animated slideInDown">
+                    <div className="ui secondary segment bottom attached animate__animated animate__slideInDown">
                         <div className="ui icon input fluid">
                             <input ref="searchInput" type="text" placeholder="Type your search keywords and press enter to search..." value={this.state.searchTerm} onChange={this.handleSearchChange.bind(this)} onKeyDown={this.handleSearchKeyDown.bind(this)}/>
                             <i className="search icon"></i>
diff --git a/components/dataset/Facet.js b/components/dataset/Facet.js
index b63412ca..c872fe63 100644
--- a/components/dataset/Facet.js
+++ b/components/dataset/Facet.js
@@ -429,15 +429,15 @@ class Facet extends React.Component {
             position: 'relative',
             overflow: 'auto'
         };
-        let animatedClass= '';
+        let animate__animatedClass= '';
         if(this.props.spec.property){
-            animatedClass = 'animated fadeIn'
+            animate__animatedClass = 'animate__animated animate__fadeIn'
         }
         if(this.state.config && this.state.config.pivotDataset){
-            animatedClass = 'animated zoomIn'
+            animate__animatedClass = 'animate__animated animate__zoomIn'
         }
         return (
-            <div ref="facet" className={animatedClass} style={{'wordBreak': 'break-all', 'wordWrap': 'break-word'}}>
+            <div ref="facet" className={animate__animatedClass} style={{'wordBreak': 'break-all', 'wordWrap': 'break-word'}}>
 
                 <div className={cardClasses}>
                     {this.state.verticalResized ?
diff --git a/components/dataset/viewer/BasicResourceList.js b/components/dataset/viewer/BasicResourceList.js
index b1c1495d..aae1343e 100644
--- a/components/dataset/viewer/BasicResourceList.js
+++ b/components/dataset/viewer/BasicResourceList.js
@@ -198,8 +198,8 @@ class BasicResourceList extends React.Component {
                 geo = node.geo ? node.geo : '';
                 itemClass = classNames({
                     'ui': true,
-                    'item fadeIn': true,
-                    'animated': !cloneable
+                    'item animate__fadeIn': true,
+                    'animate__animated': !cloneable
                 });
                 if (!self.props.enableAuthentication) {
                     dbClass = 'black cube icon';
diff --git a/components/object/AggregateObject.js b/components/object/AggregateObject.js
index 7ef49afc..9fce6dd5 100644
--- a/components/object/AggregateObject.js
+++ b/components/object/AggregateObject.js
@@ -131,7 +131,7 @@ class AggregateObjectReactor extends React.Component {
                             <div className="twelve wide column field">
                                 {dataEditType}
                             </div>
-                            <div className="four wide column field animated fadeInLeft">
+                            <div className="four wide column field animate__animated animate__fadeInLeft">
                                 {saveDIV}
                                 {(this.state.showDelete ? deleteDIV : '')}
                                 {undoDIV}
@@ -148,7 +148,7 @@ class AggregateObjectReactor extends React.Component {
                             <div className="twelve wide column field">
                                 {dataViewType}
                             </div>
-                            <div className="four wide column field animated fadeInLeft">
+                            <div className="four wide column field animate__animated animate__fadeInLeft">
                                 {editDIV}
                             </div>
                         </div>
diff --git a/components/object/IndividualObject.js b/components/object/IndividualObject.js
index 207307ed..0597065c 100644
--- a/components/object/IndividualObject.js
+++ b/components/object/IndividualObject.js
@@ -250,7 +250,7 @@ class IndividualObject extends React.Component {
                                 {this.props.spec.lang ? <span className='ui mini label ribbon left attached'>{this.getLanguage(this.props.spec.lang)}</span>: null}
                                 {this.props.spec.dataType ? <span className='ui mini label ribbon left attached'><PrefixBasedView spec={{value: this.props.spec.dataType}} /></span>: null}
                             </div>
-                            <div className="four wide column field animated pulse">
+                            <div className="four wide column field animate__animated animate__pulse">
                                 {detailDIV}
                                 {editDIV}
                                 {deleteDIV}
diff --git a/package.json b/package.json
index e541d4bf..2318792d 100644
--- a/package.json
+++ b/package.json
@@ -29,10 +29,10 @@
   },
   "license": "Apache-2.0",
   "dependencies": {
-    "animate.css": "^3.7.0",
+    "animate.css": "^4.1.1",
     "async": "^3.1.0",
     "body-parser": "^1.18.3",
-    "camelcase": "^5.0.0",
+    "camelcase": "^6.0.0",
     "chroma-js": "^2.0.2",
     "classnames": "^2.2.6",
     "codemirror": "^5.40.2",
@@ -47,7 +47,7 @@
     "express": "^4.16.3",
     "express-fileupload": "^1.1.6",
     "express-state": "^2.0.0",
-    "fast-csv": "^3.4.0",
+    "fast-csv": "^4.3.2",
     "flashtext.js": "^1.0.5",
     "fluxible": "^1.4.0",
     "fluxible-addons-react": "^0.2.15",
@@ -56,7 +56,7 @@
     "hogan-express": "^0.5.2",
     "jqcloud2": "^2.0.3",
     "jquery": "^3.4.1",
-    "json2csv": "^4.2.1",
+    "json2csv": "^5.0.1",
     "json3": "^3.3.2",
     "leaflet": "^1.3.4",
     "log4js": "^6.1.0",
@@ -72,7 +72,7 @@
     "rc-calendar": "^9.7.9",
     "react": "^16.5.2",
     "react-dom": "^16.5.2",
-    "react-dropzone": "^10.1.0",
+    "react-dropzone": "^11.1.0",
     "react-leaflet": "^2.0.1",
     "react-loadable": "^5.5.0",
     "react-markdown": "^4.0.4",
@@ -85,7 +85,7 @@
     "serialize-javascript": "^4.0.0",
     "serve-favicon": "^2.5.0",
     "simplify-js": "^1.2.3",
-    "superagent": "^5.0.2",
+    "superagent": "^6.1.0",
     "valid-url": "^1.0.9",
     "wicket": "^1.3.3",
     "yasgui-yasqe": "^2.11.22"
@@ -108,23 +108,25 @@
     "bundle-loader": "^0.5.6",
     "clean-webpack-plugin": "^3.0.0",
     "coveralls": "^3.0.9",
-    "css-loader": "^3.2.1",
+    "css-loader": "^4.3.0",
     "es6-promise": "^4.2.8",
-    "eslint": "^6.7.2",
+    "eslint": "^7.8.1",
     "eslint-plugin-babel": "^5.3.0",
     "eslint-plugin-react": "^7.17.0",
-    "extract-text-webpack-plugin": "^4.0.0-beta.0",
-    "husky": "^3.1.0",
+    "extract-css-chunks-webpack-plugin": "^4.7.5",
+    "extract-loader": "^5.1.0",
+    "file-loader": "^6.1.0",
+    "husky": "^4.3.0",
     "json-loader": "^0.5.7",
     "nodemon": "^2.0.1",
-    "postcss-loader": "^3.0.0",
-    "react-hot-loader": "^4.12.18",
+    "postcss-loader": "^4.0.1",
+    "react-hot-loader": "^4.12.21",
     "shelljs": "^0.8.3",
     "sloc": "^0.2.1",
-    "style-loader": "^1.0.1",
-    "webpack": "^4.41.2",
-    "webpack-cli": "^3.3.10",
-    "webpack-dev-server": "^3.9.0",
+    "style-loader": "^1.2.1",
+    "webpack": "^4.44.1",
+    "webpack-cli": "^3.3.12",
+    "webpack-dev-server": "^3.11.0",
     "webpack-stats-plugin": "^0.3.0",
     "webpack-vendor-chunk-plugin": "^1.0.0",
     "webpack-visualizer-plugin": "^0.1.11"
diff --git a/services/import.js b/services/import.js
index 8bd11e14..08c43264 100644
--- a/services/import.js
+++ b/services/import.js
@@ -7,7 +7,7 @@ import ImportQuery from './sparql/ImportQuery';
 import ImportUtil from './utils/ImportUtil';
 import rp from 'request-promise';
 //CSV parsing
-import csv from 'fast-csv';
+import * as csv from 'fast-csv';
 import fs from 'fs';
 import path from 'path';
 import camelCase from 'camelcase';
@@ -76,6 +76,7 @@ export default {
             let rows = [];
             let csvStream = csv.parse(options)
                 .on('data', function(data){
+                    //console.log(data);
                     counter++;
                     //to limi the number of rows returned
                     if(counter > 10){
diff --git a/webpack/prod.config.js b/webpack/prod.config.js
index 39d9c3f4..ce89a74a 100644
--- a/webpack/prod.config.js
+++ b/webpack/prod.config.js
@@ -1,7 +1,7 @@
 let webpack = require('webpack');
 let path = require('path');
 //plugins
-const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const ExtractCssChunks = require('extract-css-chunks-webpack-plugin');
 const StatsWriterPlugin = require('webpack-stats-plugin').StatsWriterPlugin;
 const Visualizer = require('webpack-visualizer-plugin');
 
@@ -51,11 +51,15 @@ let webpackConfig = {
             },
             {
                 test: /\.css$/,
-                loader: ExtractTextPlugin.extract({
-                    fallback: 'style-loader',
-                    use: 'css-loader',
-                    publicPath: '/public/css/'
-                })
+                use: [
+                    {
+                        loader: ExtractCssChunks.loader,
+                        options: {
+                            publicPath: '/public/css/'
+                        },
+                    },
+                    'css-loader',
+                ],
             }
         ]
     },
@@ -64,10 +68,9 @@ let webpackConfig = {
     },
     plugins: [
         // css files from the extract-text-plugin loader
-        new ExtractTextPlugin({
-            filename: '../css/vendor.bundle.css',
-            disable: false,
-            allChunks: true
+        new ExtractCssChunks({
+            filename: '../css/[name].css',
+            chunkFilename: '../css/vendor.bundle.css',
         }),
         new webpack.DefinePlugin({
             'process.env': {