chore(website): formatting fixes #2

website/config.js

@@ -6,7 +6,7 @@ const config = {
   redirects: [],
   header: {
     logoLink: 'https://www.nexusjs.org', // replace with nexus site
-    title: 'GraphQL Nexus',
+    title: 'Nexus',
     // check all links
     // links: [
     //   { name: 'Docs', link: 'https://www.nexusjs.org/docs' },
@@ -28,20 +28,20 @@ const config = {
     },
   },
   siteMetadata: {
-    title: 'GraphQL Nexus - title',
-    description: 'GraphQL Nexus - desc',
+    title: 'Nexus - title',
+    description: 'Nexus - desc',
     keywords: 'Docs, nexus, 1.0',
     docsLocation: 'https://github.com/graphql-nexus/nexus/tree/master/website/content',
     twitter: {
-      site: '@nexus',
-      creator: '@nexus',
+      site: '@nexusgql',
+      creator: '@nexusgql',
       image: '/social/docs-social.png',
     },
     og: {
-      site_name: 'GraphQL Nexus',
+      site_name: 'Nexus',
       type: 'website',
       image: {
-        alt: 'GraphQL Nexus',
+        alt: 'Nexus',
         height: '630',
         type: 'image/png',
         url: '/social/docs-social.png', //replace social image
@@ -57,7 +57,7 @@ const config = {
   },
   footer: {
     logoLink: '/',
-    title: 'Prisma',
+    title: 'Nexus',
     products: [
       {
         name: 'Prisma Client',
@@ -69,12 +69,9 @@ const config = {
       // { name: 'Prisma Enterprise', link: '/' },
     ],
     community: [
-      { name: 'Meet the community', link: 'https://www.prisma.io/community' },
-      { name: 'Slack', link: 'https://slack.prisma.io/' },
-      { name: 'Github', link: 'https://github.com/prisma' },
-      { name: 'Discussions', link: 'https://github.com/prisma/prisma/discussions' },
+      { name: 'GitHub', link: 'https://github.com/graphql-nexus' },
+      { name: 'GitHub Discussions', link: 'https://github.com/graphql-nexus/nexus/discussions' },
       { name: 'GraphQL Meetup', link: 'https://www.meetup.com/graphql-berlin/' },
-      { name: 'TypeScript Meetup', link: 'https://www.meetup.com/TypeScript-Berlin/' },
     ],
     resources: [
       { name: 'Docs', link: '/' },
@@ -90,6 +87,7 @@ const config = {
       { name: 'How to GraphQL', link: 'https://www.howtographql.com/' },
       { name: 'PostgreSQL Tutorial', link: 'https://www.prisma.io/tutorials/?tag=postgresql' },
     ],
+    /* start NOT USED */
     company: [
       { name: 'About', link: 'https://www.prisma.io/about' },
       { name: 'Jobs', link: 'https://www.prisma.io/jobs' },
@@ -99,15 +97,16 @@ const config = {
         link: 'https://gist.github.com/nikolasburk/c0f34b0cc50d3403e2e0d40c0e6510aa',
       },
     ],
-    newsletter: {
-      text: 'Stay up to date with the latest features and changes to Prisma',
-    },
+    /* end NOT USED */
     findus: {
-      twitterLink: 'https://twitter.com/prisma',
-      youtubeLink: 'https://www.youtube.com/channel/UCptAHlN1gdwD89tFM3ENb6w',
-      fbLink: 'https://www.facebook.com/prisma.io',
-      slackLink: 'https://slack.prisma.io/',
-      gitLink: 'https://github.com/prisma',
+      twitterLink: 'https://twitter.com/nexusgql',
+      gitLink: 'https://github.com/graphql-nexus/',
+      slackLink: '',
+      fbLink: '',
+      youtubeLink: '',
+    },
+    newsletter: {
+      text: '',
     },
   },
 }

website/content/01-getting-started/03-tutorial/01-chapter-0-introduction.mdx

@@ -8,7 +8,7 @@ Welcome to _the_ Nexus tutorial! If you're new to Nexus and want a guided learni
 
 This tutorial is still under construction. Some chapters will continue to be refined and more added. If you're looking for our old tutorial content, it can still be found [here](/getting-started/tutorial).
 
-## Assumed Tools
+## Assumed tools
 
 Throughout this journey, we'll be making a few minor assumptions about your toolchain to keep the content flowing:
 
@@ -22,34 +22,34 @@ If you're using another set of tools, like Yarn on Windows with Sublime Text, th
 
 There's a few conventions used throughout this tutorial that you should know about.
 
-- **Annotated Code Blocks**
+### Annotated code blocks
 
-  Most Code Blocks are explained with annotations. Take the following for example. Immediately following the codeblock are numbered points. Each corresponds to a line annotated with that number in the code block.
+Most Code Blocks are explained with annotations. Take the following for example. Immediately following the codeblock are numbered points. Each corresponds to a line annotated with that number in the code block.
 
-  <!-- prettier-ignore -->
-  ```ts
-  const a = 1 as const // 1
+<!-- prettier-ignore -->
+```ts
+const a = 1 as const // 1
 
-  interface A {}       // 2
-  interface A {}       // 2
+interface A {}       // 2
+interface A {}       // 2
 
-  const b: any = 1     // 3
-  ```
+const b: any = 1     // 3
+```
 
-  1. Use `as const` to make TS take the narrowest inference. Here `1` vs `number`.
-  2. Same-named interfaces will merge into one.
-  3. Use `any` to effectively disable type-checking
+1. Use `as const` to make TS take the narrowest inference. Here `1` vs `number`.
+2. Same-named interfaces will merge into one.
+3. Use `any` to effectively disable type-checking
 
-- **Auxiliary Content**
+### Auxiliary content
 
-  Sometimes content that isn't core to the current flow but related to it will be mentioned. That looks like so:
+Sometimes content that isn't core to the current flow but related to it will be mentioned. That looks like so:
 
-  > Hello there, have a nice day!
+> Hello there, have a nice day!
 
-## Copy-Pasting
+### Copy-pasting
 
 As you progress you'll be writing code, of course. Often you'll have the chance to copy and paste our code, but we strongly suggest if you're just starting out to **write the code yourself**. This will expose you to _experience_ of writing a Nexus app. Things like autocompletion and letting static safety guide your implementations, e.g. inside a GraphQL resolver. Also if you're new to TypeScript getting used to encountering, understanding, and fixing static type errors is essential practice. That said at no time should you feel _frustrated_. If things just aren't working, copy-paste our work as needed. Then, once things _are_ working, taking a moment muck around, break things, fix them again, etc. is almost always time well spent.
 
-## Wrapping Up
+## Wrapping up
 
-Thanks for checking out Nexus, we hope you're as excited<br/>to learn about it as we are to show it to you! :rocket:
+Thanks for checking out Nexus, we hope you're as excited to learn about it as we are to show it to you! 🚀

website/content/01-getting-started/03-tutorial/02-chapter-1-setup-and-first-query.mdx

@@ -15,15 +15,15 @@ In this first chapter we're just going to get the bare minimum of a Nexus projec
 
 Start by creating your project directory, initializing your `package.json`, and adding the `nexus` dependency.
 
-```bash
+```bash-symbol
 mkdir nexus-tutorial && cd nexus-tutorial
 npm init -y
 npm add nexus
 ```
 
 Nexus comes out of the box with a CLI. You'll use it often while working on your app. While you can access the CLI of your local nexus via `yarn` or npm scripts or `npx` but there's an even easier way. Install `nexus` globally. Then you can access the CLI from anywhere. Nexus is smart enough to delegate all invocations to the _local_ nexus. This is the idiomatic way to work with Nexus, but you aren't forced to do this.
 
-```markdown
+```bash-symbol
 npm add --global nexus
 ```
 
@@ -43,37 +43,37 @@ Despite having the global Nexus CLI, using package scripts can be a handy way of
 }
 ```
 
-## Conventional Entrypoint
+## Conventional entrypoint
 
 We'll now create our first module at `api/app.ts`:
 
-```bash
+```bash-symbol
 mkdir api && touch api/app.ts
 ```
 
 The directory name `api` is arbitrary but the module name `app` has special meaning. Nexus will find `app.ts` wherever you put it within your project and treat it as your entrypoint. Furthermore, every module that imports `nexus` will be automatically included into the final build by Nexus. This makes growing and refactoring your project easy as you are freed from managing import/export tedium. You might be wondering how import order is managed. The answer is that Nexus' APIs are declarative and so designed to be order independent.
 
-## Contextual Feedback
+## Contextual feedback
 
 Ok, with our entrypoint setup, let's boot up dev mode and see what happens.
 
-```bash
+```bash-symbol
 nexus dev
 ```
 
 Woops? You should be seeing a warning from Nexus:
 
-```bash
+```bash-symbol
 ▲ nexus:schema Your GraphQL schema is empty. [...]
 ```
 
 All good, you indeed haven't added any types to your GraphQL schema yet so Nexus is right here. This is the first example of Nexus' rich development mode contextual feedback. One of the goals of Nexus is to never leave you in a confused disoriented state. If Nexus can give you in inline feedback it should. Add rich jsDoc and precise TypeScript types into the mix, and ideally you can largely avoid getting lost and _needing_ to consult the Nexus website, community, so on.
 
-## Try It Out
+## Try it out
 
 Aside from the warning, you should also see a message indicating that your server is running, and where.
 
-```bash
+```bash-symbol
 ● nexus:server listening  --  url: 'http://localhost:4000/'
 ```
 
@@ -85,10 +85,14 @@ This is a graphical user interface for interacting with GraphQL APIs. If you pre
 
 Take a look at the right-hand side SCHEMA tab. There you'll see a default schema that Nexus has provided for you. This, along with the warning you say before, will go away once you begin your own schema.
 
-## Wrapping Up
+## Wrapping up
 
 That's it! In the next chapter you'll begin working on your app's schema.
 
-<div class="NextIs NextChapter"></div>
-
-[➳](/tutorial/chapter-2-writing-your-first-schema)
+<ButtonLink
+  color="dark"
+  type="primary"
+  href="/getting-started/tutorial/chapter-writing-your-first-schema"
+>
+  Next &rarr;
+</ButtonLink>

website/content/01-getting-started/03-tutorial/03-chapter-2-writing-your-first-schema.mdx

@@ -11,20 +11,16 @@ In this chapter you're going to write your first schema. You'll learn about:
 - GraphQL SDL file generation
 - Enhanced type safety & autocompletion
 
-<div class="NextIs SectionDivider"></div>
-
-## What About That Server?
+## What about that server?
 
 In the last chapter you probably noticed the minimal setup required to get up and running. In fact, you might even be confused and wondering:
 
-"Hey, all I have is an empty `app.ts` file, how can my server even be running?"
+> "Hey, all I have is an empty `app.ts` file, how can my server even be running?"
 
 Well, Nexus comes with a server out of the box. There's no need for you to start or stop the server or otherwise think about it beyond your domain logic. Nexus wants you to focus on what makes your GraphQL API unique.
 
 If your lock-in fears are tingling, know that **you still have _full_ access** to the underlying server instance. So if you need to add custom middlewares, routes, and so on, you can. It happens that currently it is an `express` instance but this area of Nexus will evolve ([#295](https://github.com/graphql-nexus/nexus/issues/295)).
 
-<div class="NextIs SectionDivider"></div>
-
 ## Reflection?
 
 Before we get going we need a moment to introduce an important part of the Nexus development workflow. Nexus has an unconventional concept called "Reflection". It refers to the fact that, when `nexus dev` or `nexus build` is running, not only is your application code being run, but **information is being gathered and artifacts are being derived**. Some of Nexus' uses for reflection include:
@@ -39,19 +35,17 @@ Architecturally there's a lot more to say about reflection but for now, from a u
 
 > There are plans to run Nexus Reflection as a separate process integrated into your IDE. You can learn more about and track the feature here ([#949](https://github.com/graphql-nexus/nexus/issues/949))
 
-<div class="NextIs SectionDivider"></div>
-
-## Model The Domain
+## Model the domain
 
 Let's get started with our blog schema by modeling some key entities in the domain. We'll begin with the concept of a `Post`. A post will represent a page in your blog. When not published, we'll call it a _draft_.
 
 Your modeling work is going to start on the API layer as opposed to the database layer. This API-first approach can be a good way to collaborate with frontend teams, getting their input in shaping the data early.
 
-> A note about terminology. We will be talking about the Post Object not Post Model. The difference is that at the API layer we have objects but at the database layer we have models. The name difference helps us talk about these different layers without confusion. It is also how GraphQL (API layer) and Prisma (database layer, discussed later) respectively refer to these things.
+> A note about terminology. We will be talking about the _Post Object_, not the _Post Model_. The difference is that at the API layer we have objects but at the database layer we have models. The name difference helps us talk about these different layers without confusion. It is also how GraphQL (API layer) and Prisma (database layer, discussed later) respectively refer to these things.
 
 Create a new module for your Post object at `api/graphql/Post.ts`. We _could_ write our whole schema within say `api/app.ts` or `api/graphql.ts`, but modularizing your GraphQL type definitions can help scale your codebase. Neither approach is inherently wrong though, so do as you see you fit. For this tutorial we'll use the modular style.
 
-```bash
+```bash-symbol
 mkdir api/graphql && touch api/graphql/Post.ts
 ```
 
@@ -98,9 +92,7 @@ You are free to disable this file (settings discussed later) but its existence h
 
 For the remainder of this tutorial we'll be keeping SDL to the right of Nexus code blocks.
 
-<div class="NextIs SectionDivider"></div>
-
-## Your First Home Grown Query
+## Your first home-grown query
 
 Your `Post` object is in place now but there's still no way for clients to read that data. Let's change that. You'll use the special `Query` object to expose your Post object.
 
@@ -228,4 +220,6 @@ Congratulations! You've successfully got your first GraphQL schema up and runnin
 
 <div class="NextIs NextChapter"></div>
 
-[➳](/tutorial/chapter-3-adding-mutations-to-your-api)
+<ButtonLink color="dark" type="primary" href="/getting-started/tutorial/chapter-adding-mutations-to-your-api">
+  Next &rarr;
+</ButtonLink>