diff --git a/app/components/QRCode.mdx b/app/components/QRCode.mdx
new file mode 100644
index 0000000..d424423
--- /dev/null
+++ b/app/components/QRCode.mdx
@@ -0,0 +1,23 @@
+---
+name: QRCode
+---
+
+import { Playground, PropsTable } from 'docz'
+
+import { QRCode } from './qrcode.js'
+
+# QRCode
+
+<PropsTable of={QRCode} />
+
+## Basic usage
+
+<Playground>
+  <QRCode value="https://astrocoders.com" />
+</Playground>
+
+## Custom size
+
+<Playground>
+  <QRCode value="https://astrocoders.com" size={500} />
+</Playground>
diff --git a/app/components/Layout.js b/app/components/layout.js
similarity index 100%
rename from app/components/Layout.js
rename to app/components/layout.js
diff --git a/app/components/qrcode.js b/app/components/qrcode.js
new file mode 100644
index 0000000..64dc250
--- /dev/null
+++ b/app/components/qrcode.js
@@ -0,0 +1,15 @@
+// @flow
+
+import React from 'react';
+import QR from 'qrcode.react';
+
+type Props = {
+  value: string,
+  size?: number,
+};
+
+export const QRCode = ({ value, size }: Props) => <QR value={value} size={size} />;
+
+QRCode.defaultProps = {
+  size: 128,
+};
diff --git a/app/components/Sidebar.js b/app/components/sidebar.js
similarity index 100%
rename from app/components/Sidebar.js
rename to app/components/sidebar.js
diff --git a/package.json b/package.json
index aaac900..5f580a2 100644
--- a/package.json
+++ b/package.json
@@ -87,6 +87,7 @@
     "autoprefixer": "^9.3.1",
     "connected-react-router": "^5.0.1",
     "history": "^4.7.2",
+    "qrcode.react": "^0.8.0",
     "react": "^16.6.0",
     "react-dom": "^16.6.0",
     "react-redux": "^5.0.7",
diff --git a/yarn.lock b/yarn.lock
index 697a075..3f9a839 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11121,6 +11121,19 @@ q@~0.9.6:
   resolved "https://registry.yarnpkg.com/q/-/q-0.9.7.tgz#4de2e6cb3b29088c9e4cbc03bf9d42fb96ce2f75"
   integrity sha1-TeLmyzspCIyeTLwDv51C+5bOL3U=
 
+qr.js@0.0.0:
+  version "0.0.0"
+  resolved "https://registry.yarnpkg.com/qr.js/-/qr.js-0.0.0.tgz#cace86386f59a0db8050fa90d9b6b0e88a1e364f"
+  integrity sha1-ys6GOG9ZoNuAUPqQ2baw6IoeNk8=
+
+qrcode.react@^0.8.0:
+  version "0.8.0"
+  resolved "https://registry.yarnpkg.com/qrcode.react/-/qrcode.react-0.8.0.tgz#413b31cc3b62910e39513f7bead945e01c4c34fb"
+  integrity sha512-16wKpuFvLwciIq2YAsfmPUCnSR8GrYPsXRK5KVdcIuX0+W/MKZbBkFhl44ttRx4TWZHqRjfztoWOxdPF0Hb9JA==
+  dependencies:
+    prop-types "^15.6.0"
+    qr.js "0.0.0"
+
 qs@6.5.2, qs@~6.5.2:
   version "6.5.2"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.5.2.tgz#cb3ae806e8740444584ef154ce8ee98d403f3e36"