diff --git a/jszip-dev/src/components/export.jsx b/jszip-dev/src/components/export.jsx
new file mode 100644
index 0000000..ad04389
--- /dev/null
+++ b/jszip-dev/src/components/export.jsx
@@ -0,0 +1,29 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+import {createDloadLinkByUrl} from '../utils/download';
+
+/*destructure props object*/
+export default function Export({url,file,name}) {
+
+    const handleOnClick = () => {
+	console.log('Export:handleOnClick() started...');
+	//stops
+	//fare zones
+	//version
+    };
+
+    return (
+	<div>
+            <button onClick={handleOnClick}>
+		{name}
+            </button>
+	</div>
+    );
+};
+
+Export.propTypes = {
+    url: PropTypes.string,
+    file: PropTypes.string,
+    name: PropTypes.string
+};
diff --git a/jszip-dev/src/main.jsx b/jszip-dev/src/main.jsx
index 5eb1c62..ce7b7cf 100644
--- a/jszip-dev/src/main.jsx
+++ b/jszip-dev/src/main.jsx
@@ -3,6 +3,7 @@ import React from 'react';
 import Home from './pages/home';
 import Zipping from './pages/zipping';
 import BtnDLoad from './components/btn-dload';
+import Export from './components/export';
 import config from './config';
 
 export default function App() {
@@ -12,9 +13,12 @@ export default function App() {
 	<Zipping />
         <BtnDLoad
 	    url={`${config.API}csv-fare-zones`}
-		file={'fare-zones.csv'}
-		name={'fare-zones'}
-	    />
+	    file={'fare-zones.csv'}
+	    name={'fare-zones'}
+	/>
+	<Export
+	    name={'Export'}
+	/>
 	<Home />
     </div>
   )