Add initial Blitz Core and First Demo 🎉 (#11)

* wip

* chore: fix typings, tweak build config

* update prettier config

* set up husky to run prettier on commit

* add migrate script and update readme

* changes, still broken

* add yarn dev command

* more changes, still broken

* demo working again!

* fix: yarn why do you hate me so much?

* add to gitignore

* trying to get demo dev to work right

* refactor and cleanup

* more cleanup

* update deps

* tweak

* update readme

* fix

* update readme

Co-authored-by: Michael Edelman  <michael@edel.mn>

.gitignore

@@ -4,4 +4,5 @@
 lib
 node_modules
 reports
-*.log
+*.log
+**/.env*

.prettierignore

@@ -0,0 +1 @@
+**/migrations/**

CODE_OF_CONDUCT.md

@@ -17,7 +17,7 @@ If you are being harassed, notice that someone else is being harassed, or have a
 - We are aware that language shapes reality. Thus, we use inclusive, gender-neutral language in the documents we provide and when we talk to people. When referring to a group of people, we aim to use gender-neutral terms like “team”, “folks”, “everyone”. (For details, we recommend [this post](https://modelviewculture.com/pieces/gendered-language-feature-or-bug-in-software-documentation)).
 - We respect that people have differences of opinion and criticize constructively.
 
-## Don'ts 
+## Don'ts
 
 - Don’t discriminate against anyone.
 - Sexism and racism of any kind (including sexist and racist “jokes”), demeaning or insulting behaviour and harassment are seen as direct violations to this Code of Conduct. Harassment includes offensive verbal comments related to age, body size, culture, ethnicity, gender expression, gender identity, level of experience, nationality, personal ability or disability, physical appearance, physical or mental difference, race, religion, set of skills, sexual orientation, socio-economic status, and subculture. Harassment also includes sexual images in public spaces, deliberate intimidation, stalking, following, harassing photography or recording, inappropriate physical contact, and unwelcome sexual attention.
@@ -32,7 +32,7 @@ If you are being harassed, notice that someone else is being harassed, or have a
 
 ## Consequences for Violations to this Code of Conduct
 
-If a participant engages in any behavior  violating this Code of Conduct, the core members of this community will take any action they deem appropriate, including warning the offender or expulsion from the community, exclusion from any interaction and loss of all rights in this community.
+If a participant engages in any behavior violating this Code of Conduct, the core members of this community will take any action they deem appropriate, including warning the offender or expulsion from the community, exclusion from any interaction and loss of all rights in this community.
 
 ## Decisions About Consequences of Violations
 

README.md

@@ -1,19 +1,64 @@
 # Blitz ⚡️
 
+[![Build Status](https://img.shields.io/endpoint.svg?url=https%3A%2F%2Factions-badge.atrox.dev%2Fblitz-js%2Fblitz%2Fbadge%3Fref%3Dcanary&style=flat)](https://actions-badge.atrox.dev/blitz-js/blitz/goto?ref=canary)
+
 Framework for building monolithic, full-stack, serverless React apps with zero data-fetching and zero client-side state management
 
-[![Build Status](https://img.shields.io/endpoint.svg?url=https%3A%2F%2Factions-badge.atrox.dev%2Fblitz-js%2Fblitz%2Fbadge%3Fref%3Dcanary&style=flat)](https://actions-badge.atrox.dev/blitz-js/blitz/goto?ref=canary)
+### [👉View The Blitz Announcement Here👈](https://twitter.com/flybayer/status/1229425878481793024)
 
 ## Welcome to the Blitz Community 👋
 
 The Blitz community is warm, safe, diverse, inclusive, and fun! LGBTQ+, women, and minorities are especially welcome. Please read our [Code of Conduct](https://github.com/blitz-js/blitz/blob/canary/CODE_OF_CONDUCT.md).
 
-### [👉View The Blitz Announcement Here👈](https://twitter.com/flybayer/status/1229425878481793024)
-
-### Code & Demo coming soon!
+## Demo
 
-There’s a LOT of work left and I can’t do it alone.
+The initial Blitz demo app is at [examples/first-demo](https://github.com/blitz-js/blitz/blob/canary/examples/first-demo/README.md). NOTE: The API is very alpha, and will change.
 
-I invite you to join me — let’s build the future of web dev together. 🤝
+## I invite you to join me — let’s build the future of web dev together. 🤝
 
 If you’re interested in helping or just want to keep a pulse on the project, [drop your email here 👉 Blitzjs.com](https://blitzjs.com)
+
+### How to Get Started With Blitz Framework Development
+
+**1.** Clone the repo
+
+```
+git clone git@github.com:blitz-js/blitz.git
+cd blitz
+```
+
+**2.** Install dependencies
+
+```
+yarn
+```
+
+**3.** Start the package server. This must be running for any package development or example development
+
+```
+yarn dev
+```
+
+#### Develop a Blitz `package`
+
+**1.** Change to a package directory
+
+```
+cd packages/core
+```
+
+**2.** Start the test runner
+
+```
+yarn test:watch
+```
+
+#### Run a Blitz `example`
+
+**1.** Change to an example directory
+
+```
+cd examples/first-demo
+```
+
+**2.** Follow instructions in the example's README

examples/first-demo/.gitignore

@@ -0,0 +1,27 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+.env*
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+.now

examples/first-demo/README.md

@@ -0,0 +1,14 @@
+# First Blitz Demo
+
+## Setup
+
+- You must have postgres installed and running
+- You must set the `DATABASE_URL` env variable. Ex: `postgresql://b@localhost:5432/blitz-demo`
+
+1. yarn
+2. yarn migrate
+3. yarn start
+
+## Production Deployment
+
+WARNING: Production deployment works, but does not work correctly. There's a bug in the unreleased, canary feature Blitz uses. Will update once that's fixed.

examples/first-demo/controllers/comments.ts

@@ -0,0 +1,37 @@
+import {Controller} from '@blitzjs/core'
+
+export const CommentsController = Controller(({db}) => ({
+  name: 'CommentsController',
+
+  permit: ['content'],
+
+  async create(params, newData) {
+    const data = await db.comment.create({
+      data: {
+        ...newData,
+        post: {
+          connect: {id: parseInt(params.query.postId)},
+        },
+      },
+    })
+
+    return {
+      data,
+      redirect: {
+        href: '/posts/[id]',
+        as: `/posts/${params.query.postId}`,
+      },
+    }
+  },
+
+  async delete({id}) {
+    const data = await db.comment.delete({where: {id}, include: {post: true}})
+
+    return {
+      redirect: {
+        href: '/posts/[id]',
+        as: `/posts/${data.post.id}`,
+      },
+    }
+  },
+}))

examples/first-demo/controllers/posts.ts

@@ -0,0 +1,64 @@
+import {Controller} from '@blitzjs/core'
+
+export const PostsController = Controller(({db}) => ({
+  name: 'PostsController',
+
+  permit: ['title', 'content'],
+
+  async index() {
+    const posts = await db.post.findMany({orderBy: {id: 'asc'}})
+
+    return {
+      data: {posts},
+    }
+  },
+
+  async show({id}) {
+    const post = await db.post.findOne({where: {id}, include: {comments: true}})
+
+    return {
+      data: {post},
+    }
+  },
+
+  async create(params, newData) {
+    const data = await db.post.create({
+      data: newData,
+    })
+
+    return {
+      data,
+      redirect: {
+        href: '/posts/[id]',
+        as: `/posts/${data.id}`,
+      },
+    }
+  },
+
+  async update(params, newData) {
+    const data = await db.post.update({
+      where: {id: params.id},
+      data: newData,
+    })
+
+    return {
+      data,
+      redirect: {
+        href: `/posts/[id]`,
+        as: `/posts/${data.id}`,
+      },
+    }
+  },
+
+  async delete({id}) {
+    // Have to delete comments because cascade delete doesn't work yet
+    await db.comment.deleteMany({where: {post: {id}}})
+    await db.post.delete({where: {id}})
+
+    return {
+      redirect: {
+        href: '/posts',
+      },
+    }
+  },
+}))

examples/first-demo/next-env.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="next" />
+/// <reference types="next/types/global" />

examples/first-demo/next.config.js

@@ -0,0 +1,3 @@
+// NOTE: This is ONLY needed in this Blitz monorepo so that package hot reloading works properly
+const withTM = require('next-transpile-modules')(['@blitzjs/core'])
+module.exports = withTM({})

examples/first-demo/now.json

@@ -0,0 +1,11 @@
+{
+  "version": 2,
+  "env": {
+    "DATABASE_URL": "@blitz-demo-db"
+  },
+  "build": {
+    "env": {
+      "DATABASE_URL": "@blitz-demo-db"
+    }
+  }
+}

examples/first-demo/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "first-demo",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "start": "next dev",
+    "migrate": "prisma2 generate && prisma2 migrate up --experimental",
+    "build": "prisma2 generate && next build",
+    "now-start": "next start"
+  },
+  "dependencies": {
+    "@blitzjs/core": "*",
+    "@prisma/client": "2.0.0-preview022",
+    "next": "9.2.3-canary.13",
+    "next-transpile-modules": "3.0.2",
+    "react": "16.12.0",
+    "react-dom": "16.12.0",
+    "tailwindcss": "1.2.0"
+  },
+  "devDependencies": {
+    "@fullhuman/postcss-purgecss": "2.1.0",
+    "@types/react": "16.9.23",
+    "autoprefixer": "9.7.4",
+    "prisma2": "2.0.0-preview022",
+    "typescript": "3.8.2"
+  }
+}

examples/first-demo/pages/_app.js

@@ -0,0 +1,6 @@
+import '../styles.css'
+
+function App({Component, pageProps}) {
+  return <Component {...pageProps} />
+}
+export default App

examples/first-demo/pages/api/comments/[...id].js

@@ -0,0 +1,4 @@
+import {harnessController} from '@blitzjs/core'
+import {CommentsController} from '../../../controllers/comments'
+
+export default harnessController(CommentsController)

examples/first-demo/pages/api/comments/index.js

@@ -0,0 +1 @@
+export {default} from './[...id]'

examples/first-demo/pages/api/posts/[...id].js

@@ -0,0 +1,4 @@
+import {harnessController} from '@blitzjs/core'
+import {PostsController} from '../../../controllers/posts'
+
+export default harnessController(PostsController)

examples/first-demo/pages/api/posts/[postId]/comments/[...id].js

@@ -0,0 +1,4 @@
+import {harnessController} from '@blitzjs/core'
+import {CommentsController} from '../../../../../controllers/comments'
+
+export default harnessController(CommentsController)

examples/first-demo/pages/api/posts/[postId]/comments/index.js

@@ -0,0 +1 @@
+export {default} from './[...id]'

examples/first-demo/pages/api/posts/index.js

@@ -0,0 +1 @@
+export {default} from './[...id]'

examples/first-demo/pages/index.js

@@ -0,0 +1,24 @@
+import React from 'react'
+import Head from 'next/head'
+import Link from 'next/link'
+
+const Home = props => (
+  <div>
+    <Head>
+      <title>First Blitz Demo</title>
+      <link rel="icon" href="/favicon.ico" />
+    </Head>
+
+    <div className="container flex flex-col items-center py-20">
+      <h1 className="text-3xl">First Ever Blitz ⚡️ Demo!</h1>
+      <p className="italic mt-10">Notice the URL bar as you navigate</p>
+      <p className="mt-10">
+        <Link href="/posts">
+          <a className="underline text-purple-700 text-2xl">View Posts</a>
+        </Link>
+      </p>
+    </div>
+  </div>
+)
+
+export default Home