initial commit

lesnitsky · Dec 7, 2018 · 52b1cd4 · 52b1cd4
commit 52b1cd4
Show file tree

Hide file tree

Showing 10 changed files with 5,072 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,4 @@
+sandbox
+node_modules
+.DS_Store
+.next
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,6 @@
+{
+    "trailingComma": "es5",
+    "printWidth": 120,
+    "tabWidth": 4,
+    "singleQuote": true
+}
diff --git a/README.md b/README.md
diff --git a/components/Example.js b/components/Example.js
@@ -0,0 +1,19 @@
+export default ({ children, reactnative, flutter }) => (
+    <div className="example-container">
+        {reactnative ? <h2>React Native</h2> : null}
+        {flutter ? <h2>Flutter</h2> : null}
+
+        {children}
+        <style jsx>{`
+            .example-container {
+                flex-basis: 50%;
+                box-sizing: border-box;
+                padding: 10px;
+            }
+
+            h2 {
+                color: #6196cc;
+            }
+        `}</style>
+    </div>
+);
diff --git a/next.config.js b/next.config.js
@@ -0,0 +1,10 @@
+const rehypePrism = require('@mapbox/rehype-prism');
+const withMDX = require('@zeit/next-mdx')({
+    options: {
+        hastPlugins: [rehypePrism],
+    },
+    extension: /\.(md|mdx)$/,
+});
+const withCSS = require('@zeit/next-css');
+
+module.exports = withCSS(withMDX());
diff --git a/package.json b/package.json
@@ -0,0 +1,25 @@
+{
+  "name": "howtodothisinflutter",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "dev": "next",
+    "build": "next build",
+    "start": "next start"
+  },
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "next": "^7.0.2",
+    "react": "^16.6.3",
+    "react-dom": "^16.6.3"
+  },
+  "dependencies": {
+    "@mapbox/rehype-prism": "^0.3.0",
+    "@mdx-js/mdx": "^0.16.5",
+    "@zeit/next-css": "^1.0.1",
+    "@zeit/next-mdx": "^1.2.0",
+    "prismjs": "^1.15.0"
+  }
+}
diff --git a/pages/_document.js b/pages/_document.js
@@ -0,0 +1,19 @@
+import Document, { Head, Main, NextScript } from 'next/document';
+
+export default class MyDocument extends Document {
+    render() {
+        return (
+            <html>
+                <Head>
+                    <title>How to do this in Flutter</title>
+                    <meta name="viewport" content="initial-scale=1.0, width=device-width" />
+                    <style>{`body { margin: 0; background: #212121; color: white; font-family: sans-serif; }`}</style>
+                </Head>
+                <body>
+                    <Main />
+                    <NextScript />
+                </body>
+            </html>
+        );
+    }
+}
diff --git a/pages/index.js b/pages/index.js
@@ -0,0 +1,29 @@
+import 'prismjs/themes/prism-tomorrow.css';
+
+import Fetch from '../recipes/fetch.md';
+
+export default () => (
+    <div className="app">
+        <Fetch />
+
+        <style jsx global>{`
+            h1 {
+                width: 100%;
+            }
+
+            .app {
+                width: 70%;
+                margin: 0 auto;
+            }
+
+            .app > div {
+                display: flex;
+                flex-wrap: wrap;
+            }
+
+            h1 {
+                color: #cc99cd;
+            }
+        `}</style>
+    </div>
+);
diff --git a/recipes/fetch.md b/recipes/fetch.md
@@ -0,0 +1,32 @@
+import Example from '../components/Example';
+
+# Fetching data
+
+<Example reactnative>
+
+```js
+fetch('https://somedomain.com/api')
+    .then(res => res.json())
+    .then(console.log);
+```
+
+</Example>
+
+<Example flutter>
+
+```yaml
+dependencies:
+    http: ^0.12.0
+```
+
+```dart
+import 'dart:convert'; // json
+import 'package:http/http.dart' as http;
+
+http.get('someurl').then((http.Response res) {
+    final data = json.decode(res.body);
+});
+
+```
+
+</Example>