diff --git a/src/app/app.js b/src/app/app.js
index ee5d45bdd..58f461c10 100644
--- a/src/app/app.js
+++ b/src/app/app.js
@@ -1,13 +1,9 @@
 import React, { Component } from 'react';
 import { BrowserRouter, Switch, Route, Redirect } from 'react-router-dom';
+import { Board, Discover, Library, Calendar } from 'stremio-routes';
 import NavBar from './NavBar';
 import styles from './styles';
 
-const Board = () => <div style={{ color: 'pink', paddingTop: 40 }}>You're on the Board Tab</div>;
-const Discover = () => <div style={{ color: 'pink', paddingTop: 40 }}>You're on the Discover Tab</div>;
-const Library = () => <div style={{ color: 'pink', paddingTop: 40 }}>You're on the Library Tab</div>;
-const Calendar = () => <div style={{ color: 'pink', paddingTop: 40 }}>You're on the Calendar Tab</div>;
-
 class App extends Component {
     render() {
         return (
diff --git a/src/routes/Board/Board.js b/src/routes/Board/Board.js
new file mode 100644
index 000000000..8c5105854
--- /dev/null
+++ b/src/routes/Board/Board.js
@@ -0,0 +1,11 @@
+import React, { Component } from 'react';
+
+class Board extends Component {
+    render() {
+        return (
+            <div style={{ color: 'pink', paddingTop: 40 }}>You're on the Board Tab</div>
+        );
+    }
+}
+
+export default Board;
diff --git a/src/routes/Board/index.js b/src/routes/Board/index.js
new file mode 100644
index 000000000..354b05808
--- /dev/null
+++ b/src/routes/Board/index.js
@@ -0,0 +1,3 @@
+import Board from './Board';
+
+export default Board;
diff --git a/src/routes/Calendar/Calendar.js b/src/routes/Calendar/Calendar.js
new file mode 100644
index 000000000..fb4ac7dc3
--- /dev/null
+++ b/src/routes/Calendar/Calendar.js
@@ -0,0 +1,11 @@
+import React, { Component } from 'react';
+
+class Calendar extends Component {
+    render() {
+        return (
+            <div style={{ color: 'pink', paddingTop: 40 }}>You're on the Calendar Tab</div>
+        );
+    }
+}
+
+export default Calendar;
diff --git a/src/routes/Calendar/index.js b/src/routes/Calendar/index.js
new file mode 100644
index 000000000..abd4428bf
--- /dev/null
+++ b/src/routes/Calendar/index.js
@@ -0,0 +1,3 @@
+import Calendar from './Calendar';
+
+export default Calendar;
diff --git a/src/routes/Discover/Discover.js b/src/routes/Discover/Discover.js
new file mode 100644
index 000000000..fa9d105fd
--- /dev/null
+++ b/src/routes/Discover/Discover.js
@@ -0,0 +1,11 @@
+import React, { Component } from 'react';
+
+class Discover extends Component {
+    render() {
+        return (
+            <div style={{ color: 'pink', paddingTop: 40 }}>You're on the Discover Tab</div>
+        );
+    }
+}
+
+export default Discover;
diff --git a/src/routes/Discover/index.js b/src/routes/Discover/index.js
new file mode 100644
index 000000000..08add4be0
--- /dev/null
+++ b/src/routes/Discover/index.js
@@ -0,0 +1,3 @@
+import Discover from './Discover';
+
+export default Discover;
diff --git a/src/routes/Library/Library.js b/src/routes/Library/Library.js
new file mode 100644
index 000000000..9c41faf0b
--- /dev/null
+++ b/src/routes/Library/Library.js
@@ -0,0 +1,11 @@
+import React, { Component } from 'react';
+
+class Library extends Component {
+    render() {
+        return (
+            <div style={{ color: 'pink', paddingTop: 40 }}>You're on the Library Tab</div>
+        );
+    }
+}
+
+export default Library;
diff --git a/src/routes/Library/index.js b/src/routes/Library/index.js
new file mode 100644
index 000000000..d7a827977
--- /dev/null
+++ b/src/routes/Library/index.js
@@ -0,0 +1,3 @@
+import Library from './Library';
+
+export default Library;
diff --git a/src/routes/index.js b/src/routes/index.js
new file mode 100644
index 000000000..a6581c81e
--- /dev/null
+++ b/src/routes/index.js
@@ -0,0 +1,11 @@
+import Board from './Board';
+import Discover from './Discover';
+import Library from './Library';
+import Calendar from './Calendar';
+
+export {
+    Board,
+    Discover,
+    Library,
+    Calendar
+};