diff --git a/package.json b/package.json
index 428a3b7..6758112 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "githistory",
+  "name": "githistory-web",
   "version": "0.1.0",
   "private": true,
   "dependencies": {
diff --git a/public/manifest.json b/public/manifest.json
index a82f1bf..2e09354 100755
--- a/public/manifest.json
+++ b/public/manifest.json
@@ -10,6 +10,6 @@
   ],
   "start_url": ".",
   "display": "standalone",
-  "theme_color": "#000000",
-  "background_color": "#ffffff"
+  "theme_color": "#d6deeb",
+  "background_color": "#011627"
 }
diff --git a/src/app-helpers.js b/src/app-helpers.js
index b2f2dd2..7c9d21c 100644
--- a/src/app-helpers.js
+++ b/src/app-helpers.js
@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from "react";
 import { getLanguage, loadLanguage } from "./language-detector";
+import { auth, isLoggedIn, getCommits } from "./github";
 
 export function Center({ children }) {
   return (
@@ -28,6 +29,66 @@ export function Loading({ repo, path }) {
   );
 }
 
+export function Error({ error }) {
+  if (error.status === 403) {
+    return (
+      <Center>
+        <p>
+          GitHub API rate limit exceeded for your IP (60 requests per hour).
+        </p>
+        <p>Sign in with GitHub for more:</p>
+        <GitHubButton onClick={login} />
+      </Center>
+    );
+  }
+
+  if (error.status === 404) {
+    return (
+      <Center>
+        <p>File not found.</p>
+        {!isLoggedIn() && (
+          <React.Fragment>
+            <p>Is it from a private repo? Sign in with GitHub:</p>
+            <GitHubButton onClick={login} />
+          </React.Fragment>
+        )}
+      </Center>
+    );
+  }
+
+  console.error(error);
+  return (
+    <Center>
+      <p>Unexpected error. Check the console.</p>
+    </Center>
+  );
+}
+
+function GitHubButton({ onClick }) {
+  return (
+    <button
+      onClick={onClick}
+      style={{ fontWeight: 600, padding: "0.5em 0.7em", cursor: "pointer" }}
+    >
+      <div>
+        <svg
+          fill="currentColor"
+          preserveAspectRatio="xMidYMid meet"
+          height="1em"
+          width="1em"
+          viewBox="0 0 40 40"
+          style={{ verticalAlign: "middle", marginRight: "0.5rem" }}
+        >
+          <g>
+            <path d="m20 0c-11 0-20 9-20 20 0 8.8 5.7 16.3 13.7 19 1 0.2 1.3-0.5 1.3-1 0-0.5 0-2 0-3.7-5.5 1.2-6.7-2.4-6.7-2.4-0.9-2.3-2.2-2.9-2.2-2.9-1.9-1.2 0.1-1.2 0.1-1.2 2 0.1 3.1 2.1 3.1 2.1 1.7 3 4.6 2.1 5.8 1.6 0.2-1.3 0.7-2.2 1.3-2.7-4.5-0.5-9.2-2.2-9.2-9.8 0-2.2 0.8-4 2.1-5.4-0.2-0.5-0.9-2.6 0.2-5.3 0 0 1.7-0.5 5.5 2 1.6-0.4 3.3-0.6 5-0.6 1.7 0 3.4 0.2 5 0.7 3.8-2.6 5.5-2.1 5.5-2.1 1.1 2.8 0.4 4.8 0.2 5.3 1.3 1.4 2.1 3.2 2.1 5.4 0 7.6-4.7 9.3-9.2 9.8 0.7 0.6 1.4 1.9 1.4 3.7 0 2.7 0 4.9 0 5.5 0 0.6 0.3 1.2 1.3 1 8-2.7 13.7-10.2 13.7-19 0-11-9-20-20-20z" />
+          </g>
+        </svg>
+        Sign in with GitHub
+      </div>
+    </button>
+  );
+}
+
 export function useLanguageLoader(path) {
   const [loadedLang, setLang] = useState(false);
 
@@ -38,3 +99,61 @@ export function useLanguageLoader(path) {
 
   return loadedLang;
 }
+
+export function useCommitsFetcher({ repo, sha, path }) {
+  const [state, setState] = useState({
+    commits: null,
+    loading: true,
+    error: null
+  });
+
+  useEffect(() => {
+    getCommits(repo, sha, path)
+      .then(commits => {
+        setState({
+          commits,
+          loading: false,
+          error: false
+        });
+      })
+      .catch(error => {
+        setState({
+          loading: false,
+          error
+        });
+      });
+  }, [repo, sha, path]);
+
+  return state;
+}
+
+export function useDocumentTitle(title) {
+  useEffect(() => {
+    document.title = title;
+  }, [title]);
+}
+
+export function getUrlParams() {
+  const [
+    ,
+    owner,
+    reponame,
+    action,
+    sha,
+    ...paths
+  ] = window.location.pathname.split("/");
+
+  if (action !== "commits" && action !== "blob") {
+    return [];
+  }
+
+  return [owner + "/" + reponame, sha, "/" + paths.join("/")];
+}
+
+function login() {
+  auth()
+    .then(data => {
+      window.location.reload(false);
+    })
+    .catch(console.error);
+}
diff --git a/src/app.js b/src/app.js
old mode 100755
new mode 100644
index 18e1a50..a9bc15d
--- a/src/app.js
+++ b/src/app.js
@@ -1,89 +1,64 @@
-import React, { useState, useEffect } from "react";
+import React from "react";
 import History from "./history";
-import { getHistory, auth, isLoggedIn } from "./github";
-import demo from "./demo.gif";
+import Landing from "./landing";
+import {
+  getUrlParams,
+  useLanguageLoader,
+  useCommitsFetcher,
+  useDocumentTitle,
+  Loading,
+  Error
+} from "./app-helpers";
+
+const cli = window._CLI;
+
+export default function App() {
+  if (cli) {
+    return <CliApp data={cli} />;
+  }
 
-export default function AppWrapper(props) {
-  if (props.repo) {
-    return <App {...props} />;
-  } else {
+  const [repo, sha, path] = getUrlParams();
+
+  if (!repo) {
     return <Landing />;
+  } else {
+    return <GitHubApp repo={repo} sha={sha} path={path} />;
   }
 }
 
-function Center({ children }) {
-  return (
-    <div
-      style={{
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        justifyContent: "center",
-        height: "100%",
-        padding: "0 40px"
-      }}
-    >
-      {children}
-    </div>
-  );
-}
+function CliApp({ data }) {
+  let { commits, path } = data;
+
+  const fileName = path.split("/").pop();
+  useDocumentTitle(`Git History - ${fileName}`);
 
-function Landing() {
-  const url = `${window.location.protocol}//${
-    window.location.host
-  }/babel/babel/blob/master/packages/babel-core/test/browserify.js`;
-  return (
-    <Center>
-      <img src={demo} alt="demo" style={{ width: 900, maxWidth: "100%" }} />
-      <h1>Git History</h1>
-      <div>
-        <p>
-          Quickly browse the history of any GitHub file:
-          <ol>
-            <li>
-              Replace <strong>github.com</strong> with{" "}
-              <strong>github.githistory.xyz</strong> in any file url
-            </li>
-            <li>There's no step two</li>
-          </ol>
-          <a href={url}>Try it</a>
-        </p>
+  commits = commits.map(commit => ({ ...commit, date: new Date(commit.date) }));
+  const lang = useLanguageLoader(path);
 
-        <p>
-          You can also add an <strong>Open in Git History</strong> button to
-          GitHub with the{" "}
-          <a href="https://chrome.google.com/webstore/detail/github-history-browser-ex/laghnmifffncfonaoffcndocllegejnf">
-            Chrome
-          </a>{" "}
-          and{" "}
-          <a href="https://addons.mozilla.org/es/firefox/addon/github-history/">
-            Firefox
-          </a>{" "}
-          extensions.
-        </p>
-      </div>
-      <div style={{ height: "20%" }} />
-    </Center>
-  );
+  if (!lang) {
+    return <Loading path={path} />;
+  } else {
+    return <History commits={commits} language={lang} />;
+  }
 }
 
-function App({ repo, sha, path, lang }) {
+function GitHubApp({ repo, sha, path }) {
   const fileName = path.split("/").pop();
   useDocumentTitle(`Git History - ${fileName}`);
 
+  const lang = useLanguageLoader(path);
   const { commits, loading, error } = useCommitsFetcher({
     repo,
     sha,
-    path,
-    lang
+    path
   });
 
   if (error) {
     return <Error error={error} />;
   }
 
-  if (loading) {
-    return <Loading repo={repo} sha={sha} path={path} />;
+  if (!lang || loading) {
+    return <Loading repo={repo} path={path} />;
   }
 
   if (!commits.length) {
@@ -92,114 +67,3 @@ function App({ repo, sha, path, lang }) {
 
   return <History commits={commits} language={lang} />;
 }
-
-function Error({ error }) {
-  if (error.status === 403) {
-    return (
-      <Center>
-        <p>
-          GitHub API rate limit exceeded for your IP (60 requests per hour).
-        </p>
-        <p>Sign in with GitHub for more:</p>
-        <GitHubButton onClick={login} />
-      </Center>
-    );
-  }
-
-  if (error.status === 404) {
-    return (
-      <Center>
-        <p>File not found.</p>
-        {!isLoggedIn() && (
-          <React.Fragment>
-            <p>Is it from a private repo? Sign in with GitHub:</p>
-            <GitHubButton onClick={login} />
-          </React.Fragment>
-        )}
-      </Center>
-    );
-  }
-
-  console.error(error);
-  return (
-    <Center>
-      <p>Unexpected error. Check the console.</p>
-    </Center>
-  );
-}
-
-function Loading({ repo, sha, path }) {
-  return (
-    <Center>
-      <p>
-        Loading <strong>{repo}</strong> <strong>{path} history...</strong>
-      </p>
-    </Center>
-  );
-}
-
-function GitHubButton({ onClick }) {
-  return (
-    <button
-      onClick={onClick}
-      style={{ fontWeight: 600, padding: "0.5em 0.7em", cursor: "pointer" }}
-    >
-      <div>
-        <svg
-          fill="currentColor"
-          preserveAspectRatio="xMidYMid meet"
-          height="1em"
-          width="1em"
-          viewBox="0 0 40 40"
-          style={{ verticalAlign: "middle", marginRight: "0.5rem" }}
-        >
-          <g>
-            <path d="m20 0c-11 0-20 9-20 20 0 8.8 5.7 16.3 13.7 19 1 0.2 1.3-0.5 1.3-1 0-0.5 0-2 0-3.7-5.5 1.2-6.7-2.4-6.7-2.4-0.9-2.3-2.2-2.9-2.2-2.9-1.9-1.2 0.1-1.2 0.1-1.2 2 0.1 3.1 2.1 3.1 2.1 1.7 3 4.6 2.1 5.8 1.6 0.2-1.3 0.7-2.2 1.3-2.7-4.5-0.5-9.2-2.2-9.2-9.8 0-2.2 0.8-4 2.1-5.4-0.2-0.5-0.9-2.6 0.2-5.3 0 0 1.7-0.5 5.5 2 1.6-0.4 3.3-0.6 5-0.6 1.7 0 3.4 0.2 5 0.7 3.8-2.6 5.5-2.1 5.5-2.1 1.1 2.8 0.4 4.8 0.2 5.3 1.3 1.4 2.1 3.2 2.1 5.4 0 7.6-4.7 9.3-9.2 9.8 0.7 0.6 1.4 1.9 1.4 3.7 0 2.7 0 4.9 0 5.5 0 0.6 0.3 1.2 1.3 1 8-2.7 13.7-10.2 13.7-19 0-11-9-20-20-20z" />
-          </g>
-        </svg>
-        Sign in with GitHub
-      </div>
-    </button>
-  );
-}
-
-function login() {
-  auth()
-    .then(data => {
-      window.location.reload(false);
-    })
-    .catch(console.error);
-}
-
-function useCommitsFetcher({ repo, sha, path, lang }) {
-  const [state, setState] = useState({
-    commits: null,
-    loading: true,
-    error: null
-  });
-
-  useEffect(() => {
-    getHistory(repo, sha, path, lang)
-      .then(commits => {
-        setState({
-          commits,
-          loading: false,
-          error: false
-        });
-      })
-      .catch(error => {
-        setState({
-          loading: false,
-          error
-        });
-      });
-  }, [repo, sha, path, lang]);
-
-  return state;
-}
-
-function useDocumentTitle(title) {
-  useEffect(() => {
-    document.title = title;
-  }, [title]);
-}
diff --git a/src/github.js b/src/github.js
index cefee36..ba4f486 100644
--- a/src/github.js
+++ b/src/github.js
@@ -1,6 +1,5 @@
 import netlify from "netlify-auth-providers";
 import { Base64 } from "js-base64";
-import { getLanguageDependencies } from "./language-detector";
 const TOKEN_KEY = "github-token";
 
 function getHeaders() {
@@ -26,7 +25,7 @@ async function getContent(repo, sha, path) {
   return { content, url: contentJson.html_url };
 }
 
-async function getCommits(repo, sha, path, top = 10) {
+export async function getCommits(repo, sha, path, top = 10) {
   const commitsResponse = await fetch(
     `https://api.github.com/repos/${repo}/commits?sha=${sha}&path=${path}`,
     { headers: getHeaders() }
@@ -65,12 +64,6 @@ async function getCommits(repo, sha, path, top = 10) {
   return commits;
 }
 
-export function getHistory(repo, sha, path, lang) {
-  return Promise.all([getCommits(repo, sha, path), loadLanguage(lang)]).then(
-    ([commits]) => commits
-  );
-}
-
 export function auth() {
   return new Promise((resolve, reject) => {
     var authenticator = new netlify({
@@ -88,21 +81,3 @@ export function auth() {
     });
   });
 }
-
-function loadLanguage(lang) {
-  if (["js", "css", "html"].includes(lang)) {
-    return Promise.resolve();
-  }
-
-  const deps = getLanguageDependencies(lang);
-
-  let depPromise = import("prismjs");
-
-  if (deps) {
-    depPromise = depPromise.then(() =>
-      Promise.all(deps.map(dep => import(`prismjs/components/prism-${dep}`)))
-    );
-  }
-
-  return depPromise.then(() => import(`prismjs/components/prism-${lang}`));
-}
diff --git a/src/index.js b/src/index.js
index 07cdd49..438acc4 100755
--- a/src/index.js
+++ b/src/index.js
@@ -1,29 +1,6 @@
-import { getLanguage } from "./language-detector";
-import App from "./napp";
+import App from "./app";
 import React from "react";
 import ReactDOM from "react-dom";
 
 const root = document.getElementById("root");
 ReactDOM.render(<App />, root);
-
-// const [repo, sha, path] = getParams();
-// const lang = getLanguage(path);
-
-// ReactDOM.render(<App repo={repo} sha={sha} path={path} lang={lang} />, root);
-
-// function getParams() {
-//   const [
-//     ,
-//     owner,
-//     reponame,
-//     action,
-//     sha,
-//     ...paths
-//   ] = window.location.pathname.split("/");
-
-//   if (action !== "commits" && action !== "blob") {
-//     return [];
-//   }
-
-//   return [owner + "/" + reponame, sha, "/" + paths.join("/")];
-// }
diff --git a/src/landing.js b/src/landing.js
new file mode 100644
index 0000000..cd64d1b
--- /dev/null
+++ b/src/landing.js
@@ -0,0 +1,49 @@
+import React from "react";
+import demo from "./demo.gif";
+
+export default function Landing() {
+  const url = `${window.location.protocol}//${
+    window.location.host
+  }/babel/babel/blob/master/packages/babel-core/test/browserify.js`;
+  return (
+    <div
+      style={{
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        height: "100%",
+        padding: "10px 20px 0",
+        boxSizing: "border-box"
+      }}
+    >
+      <img src={demo} alt="demo" style={{ width: 900, maxWidth: "100%" }} />
+      <h1>Git History</h1>
+      <div>
+        <div>
+          Quickly browse the history of any GitHub file:
+          <ol>
+            <li>
+              Replace <strong>github.com</strong> with{" "}
+              <strong>github.githistory.xyz</strong> in any file url
+            </li>
+            <li>There's no step two</li>
+          </ol>
+          <a href={url}>Try it</a>
+        </div>
+
+        <p>
+          You can also add an <strong>Open in Git History</strong> button to
+          GitHub with the{" "}
+          <a href="https://chrome.google.com/webstore/detail/github-history-browser-ex/laghnmifffncfonaoffcndocllegejnf">
+            Chrome
+          </a>{" "}
+          and{" "}
+          <a href="https://addons.mozilla.org/es/firefox/addon/github-history/">
+            Firefox
+          </a>{" "}
+          extensions.
+        </p>
+      </div>
+    </div>
+  );
+}
diff --git a/src/napp.js b/src/napp.js
deleted file mode 100644
index 43ed88b..0000000
--- a/src/napp.js
+++ /dev/null
@@ -1,25 +0,0 @@
-import React from "react";
-import History from "./history";
-import { Loading, useLanguageLoader } from "./app-helpers";
-
-const cli = window._CLI;
-
-export default function App() {
-  if (cli) {
-    return <CliApp data={cli} />;
-  } else {
-    return null;
-    // return <GitHubApp />;
-  }
-}
-
-function CliApp({ data }) {
-  let { commits, path } = data;
-  commits = commits.map(commit => ({ ...commit, date: new Date(commit.date) }));
-  const lang = useLanguageLoader(path);
-  if (!lang) {
-    return <Loading path={path} />;
-  } else {
-    return <History commits={commits} language={lang} />;
-  }
-}