[WIP] Create docs page using docusaurus

.ignore

@@ -0,0 +1 @@
+website/node_modules/**/*

website/.gitignore

@@ -0,0 +1,20 @@
+# Dependencies
+/node_modules
+
+# Production
+/build
+
+# Generated files
+.docusaurus
+.cache-loader
+
+# Misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

website/README.md

@@ -0,0 +1,33 @@
+# Website
+
+This website is built using [Docusaurus 2](https://v2.docusaurus.io/), a modern static website generator.
+
+## Installation
+
+```console
+yarn install
+```
+
+## Local Development
+
+```console
+yarn start
+```
+
+This command starts a local development server and open up a browser window. Most changes are reflected live without having to restart the server.
+
+## Build
+
+```console
+yarn build
+```
+
+This command generates static content into the `build` directory and can be served using any static contents hosting service.
+
+## Deployment
+
+```console
+GIT_USER=<Your GitHub username> USE_SSH=true yarn deploy
+```
+
+If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.

website/babel.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  presets: [require.resolve('@docusaurus/core/lib/babel/preset')],
+};

website/docs/backends.md

@@ -0,0 +1,4 @@
+---
+id: backends
+title: Backends
+---

website/docs/column.md

@@ -0,0 +1,4 @@
+---
+id: column
+title: Column Backend
+---

website/docs/configuration.md

@@ -0,0 +1,4 @@
+---
+id: configuration
+title: Configuration
+---

website/docs/dirty_tracking.md

@@ -0,0 +1,4 @@
+---
+id: dirty_tracking
+title: Dirty Tracking
+---

website/docs/fallbacks.md

@@ -0,0 +1,4 @@
+---
+id: fallbacks
+title: Fallbacks
+---

website/docs/fallthrough_accessors.md

@@ -0,0 +1,4 @@
+---
+id: fallthrough_accessors
+title: Fallthrough Accessors
+---

website/docs/getting_started.md

@@ -0,0 +1,4 @@
+---
+id: getting_started
+title: Getting Started
+---

website/docs/installation.md

@@ -0,0 +1,4 @@
+---
+id: installation
+title: Installation
+---

website/docs/intro.md

@@ -0,0 +1,70 @@
+---
+id: intro
+title: Introduction
+slug: /
+---
+
+Mobility is a **framework** for **translating model data**. There are many
+other gems out there that can help you store translated data[^1], but Mobility is
+different. While other gems prescribe how to store your translations
+and what features to offer for retrieving those translations, Mobility leaves
+these choices up to you.
+
+Mobility can do this thanks to a separation
+between the **storage** of translation data ([backends](backends)) and the **use and manipulation** of
+that data ([plugins](plugins)). This separation makes code cleaner, more powerful, and
+easier to reuse.
+
+These docs will guide you to integrating Mobility into your application and
+provide some insights into the thinking behind its design. To get started right
+away with Mobility, jump directly to the [Installation](installation) section.
+For more background, read on.
+
+## Why the name?
+
+So first: why on _Earth_ is it called “Mobility”?
+
+Mobility is a gem for translating content. The word “translation”
+has multiple meanings:
+
+> **translation** (_noun_):
+> 1. a rendering from one language into another
+> 2. uniform motion of a body in a straight line
+
+Given that the term for these two meanings overlaps, it is perhaps not
+surprising that many imagine translation to be a simple mapping
+of words (along a straight line) from one language to another. In
+reality, as any translator will tell you, translation is an incredibly
+challenging and complex process.
+
+The same can be said of _storing translations_, which can be more complicated
+than one might think. Unfortunately, this only becomes apparent long after code
+has been written and deployed. This commonly results in complex, fragile legacy
+code coupled to a particular data format, with little room for change or
+improvement.
+
+> **mobility** (_noun_): the state of being movable or having the capacity to move
+
+Mobility's purpose is to break this stranglehold on translation data and
+give it the capacity to _move_. Similar to how Object Relational Mappers
+(ORMs) create a separation between objects and their data, Mobility creates
+a separation between the storage of translation data and the use of that data.
+
+By doing so, translation features that are common across different applications
+can be developed, shared and refined in isolation from the code used to store
+those translations. This makes code easier to understand, modify, and improve.
+
+## Minimalism
+
+> I just want to translate these columns on this one model. I don't need
+> a freaking framework for that!
+
+This is an understandable gut reaction, but it is a misunderstanding of what
+the word "framework" actually means.[^2] Mobility is built as a framework in
+order to ensure that _you only include the code you need for your use case_. It is
+a **minimalist framework**, and designed that way from the bottom up.
+
+[^1]: [Globalize](https://github.com/globalize/globalize) and
+[Traco](https://github.com/barsoom/traco) are two popular model translation
+gems, but there are many more.
+[^2]: See [this talk](https://www.youtube.com/watch?v=RZkemV_-__A) for more on this.

website/docs/json.md

@@ -0,0 +1,4 @@
+---
+id: json
+title: JSON/JSONB Backends
+---

website/docs/key_value.md

@@ -0,0 +1,4 @@
+---
+id: key_value
+title: KeyValue Backend
+---

website/docs/locale_accessors.md

@@ -0,0 +1,4 @@
+---
+id: locale_accessors
+title: Locale Accessors
+---

website/docs/mdx.md

@@ -0,0 +1,17 @@
+---
+id: mdx
+title: Powered by MDX
+---
+
+You can write JSX and use React components within your Markdown thanks to [MDX](https://mdxjs.com/).
+
+export const Highlight = ({children, color}) => ( <span style={{
+      backgroundColor: color,
+      borderRadius: '2px',
+      color: '#fff',
+      padding: '0.2rem',
+    }}>{children}</span> );
+
+<Highlight color="#25c2a0">Docusaurus green</Highlight> and <Highlight color="#1877F2">Facebook blue</Highlight> are my favorite colors.
+
+I can write **Markdown** alongside my _JSX_!

website/docs/plugins.md

@@ -0,0 +1,4 @@
+---
+id: plugins
+title: Plugins
+---

website/docs/table.md

@@ -0,0 +1,4 @@
+---
+id: table
+title: Table Backend
+---

website/docs/upgrading_to_version_1.md

@@ -0,0 +1,5 @@
+---
+id: upgrading_to_version_1
+title: Upgrading to 1.0
+slug: /upgrading-to-version-1
+---

website/docusaurus.config.js

@@ -0,0 +1,99 @@
+module.exports = {
+  title: 'Mobility',
+  tagline: 'A Pluggable Translation Framework for Ruby',
+  url: 'https://chrissalzberg.com/mobility',
+  baseUrl: '/',
+  onBrokenLinks: 'throw',
+  onBrokenMarkdownLinks: 'warn',
+  favicon: 'img/favicon.ico',
+  organizationName: 'shioyama', // Usually your GitHub org/user name.
+  projectName: 'mobility', // Usually your repo name.
+  themeConfig: {
+    navbar: {
+      title: 'Mobility',
+      items: [
+        {
+          to: 'docs/',
+          activeBasePath: 'docs',
+          label: 'Docs',
+          position: 'left',
+        },
+        {to: 'blog', label: 'Blog', position: 'left'},
+        {
+          href: 'https://github.com/shioyama/mobility',
+          label: 'GitHub',
+          position: 'right',
+        },
+      ],
+    },
+    footer: {
+      style: 'dark',
+      links: [
+        {
+          title: 'Docs',
+          items: [
+            {
+              label: 'Getting Started',
+              to: 'docs/getting-started',
+            },
+          ],
+        },
+        {
+          title: 'Community',
+          items: [
+            {
+              label: 'Stack Overflow',
+              href: 'https://stackoverflow.com/questions/tagged/mobility',
+            },
+            {
+              label: 'Gitter',
+              href: 'https://gitter.im/mobility-ruby/mobility',
+            },
+          ],
+        },
+        {
+          title: 'More',
+          items: [
+            {
+              label: 'Blog',
+              to: 'blog',
+            },
+            {
+              label: 'GitHub',
+              href: 'https://github.com/shioyama/mobility',
+            },
+          ],
+        },
+      ],
+      copyright: `Copyright © ${new Date().getFullYear()} Chris Salzberg, Inc. Built with Docusaurus.`,
+    },
+    metadatas: [
+      {
+        name: 'description',
+        content: 'A framework for managing translation data in Ruby',
+      },
+      {property: 'og:title', content: 'Mobility'},
+      {
+        property: 'og:description',
+        content: 'A framework for managing translation data in Ruby',
+      },
+      {property: 'og:url', content: 'https://shioyama.github.io/mobility'},
+    ],
+  },
+  presets: [
+    [
+      '@docusaurus/preset-classic',
+      {
+        docs: {
+          sidebarPath: require.resolve('./sidebars.json'),
+        },
+        blog: {
+          showReadingTime: true,
+        },
+        theme: {
+          customCss: require.resolve('./src/css/custom.css'),
+        },
+      },
+    ],
+  ],
+};

website/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "mobility",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "docusaurus": "docusaurus",
+    "start": "docusaurus start",
+    "build": "docusaurus build",
+    "swizzle": "docusaurus swizzle",
+    "deploy": "docusaurus deploy",
+    "serve": "docusaurus serve",
+    "clear": "docusaurus clear"
+  },
+  "dependencies": {
+    "@docusaurus/core": "2.0.0-alpha.68",
+    "@docusaurus/preset-classic": "2.0.0-alpha.68",
+    "@mdx-js/react": "^1.6.21",
+    "clsx": "^1.1.1",
+    "react": "^16.8.4",
+    "react-dom": "^16.8.4",
+    "remarkable": "^1.7.1",
+    "remarkable-react": "^1.4.3",
+    "highlight.js": "^9.16.2"
+  },
+  "browserslist": {
+    "production": [
+      ">0.5%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

website/sidebars.json

@@ -0,0 +1,8 @@
+{
+  "docs": {
+    "Getting Started": ["intro", "installation", "configuration", "upgrading_to_version_1"],
+    "Design": ["plugins", "backends"],
+    "Backends": ["key_value", "table", "column", "json"],
+    "Plugins": ["locale_accessors", "fallthrough_accessors", "dirty_tracking", "fallbacks"]
+  }
+}