diff --git a/docs/docs/add-a-service-worker.md b/docs/docs/add-a-service-worker.md deleted file mode 100644 index 217ea1a1089f3..0000000000000 --- a/docs/docs/add-a-service-worker.md +++ /dev/null @@ -1,30 +0,0 @@ ---- -title: Adding a Service Worker ---- - -## What is a service worker? - -A service worker is a script that your browser runs in the background, separate from a web page, opening the door to features that don't need a web page or user interaction. They increase your site availability in spotty connections and are essential to making a nice user experience. - -It supports features like push notifications and background sync. - -## Using service workers in Gatsby with `gatsby-plugin-offline` - -Gatsby provides an awesome plugin interface to create and load a service worker into your site: [gatsby-plugin-offline](https://www.npmjs.com/package/gatsby-plugin-offline). - -You can use this plugin together with the [manifest plugin](https://www.npmjs.com/package/gatsby-plugin-manifest). (Don’t forget to list the offline plugin after the manifest plugin so that the manifest file can be included in the service worker). - -## Installing `gatsby-plugin-offline` - -`npm install gatsby-plugin-offline` - -Add this plugin to your `gatsby-config.js` - -```javascript:title=gatsby-config.js -plugins: [`gatsby-plugin-offline`] -``` - -## References - -- [Service Workers: an Introduction](https://developers.google.com/web/fundamentals/primers/service-workers/) -- [Service Worker API](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API) diff --git a/docs/docs/conceptual/choosing-analytics-systems.md b/docs/docs/conceptual/choosing-analytics-systems.md deleted file mode 100644 index 12c3fe5d901b7..0000000000000 --- a/docs/docs/conceptual/choosing-analytics-systems.md +++ /dev/null @@ -1,29 +0,0 @@ ---- -title: Choosing Analytics Systems ---- - -Website teams looking to collect insights on user behavior have a wide variety of options. - -**Basic Analytics**, which includes [Google Analytics](/plugins/gatsby-plugin-google-analytics/?=google%20analytics), focus on metrics like page views, sessions, bounce rate, entrances and exits, measured on a per-URL basis and tracked over time. They include UTM parameter tracking, in order to tie visitors to specific paid advertising or email campaigns. - -Basic analytics tools are often used alongside **Tag Managers** ([Google Tag Manager](/plugins/gatsby-plugin-google-tagmanager/?=google%20tag%20manager)), which can let marketers configure which pages load tracking scripts, or define events when certain elements are clicked. - -Google Analytics and Google Tag Manager are the most popular services used on Gatsby sites. But over the last few years, many specialized analytics services have emerged to give deeper insight into visitor behavior. - -Gatsby teams have primarily reached for three categories of tools: - -**Customer Data Platforms** ([Segment](/plugins/gatsby-plugin-segment-js/?=segment), [Rudderstack](/plugins/gatsby-plugin-rudderstack/?=rudderstack)) are tools that help teams manage and orchestrate multiple analytics systems. This includes centralizing data on visitors. - -From an ananlytics perspective, using a CDP allows website teams to replace multiple pixels and trackers with a single tracker, which can significantly improve page performance. (The CDP will ping each service from their systems, rather than the user's browser). CDP includes event replay, so teams can switch marketing tools while preserving historical data. - -- Blog post: [How WaveDirect Used Gatsby, Rudderstack, and Sanity to 4X Leads and Dominate Search Results](/blog/how-wavedirect-used-gatsby-rudderstack-and-sanity-to-4x-leads-and-dominate-search-results/) - -**Product analytics tools** ([Heap](/plugins/gatsby-plugin-heap/?=gatsby-plugin-heap), [Amplitude](/plugins/gatsby-plugin-amplitude-analytics/?=gatsby-plugin-amplitude), [Mixpanel](/plugins/gatsby-plugin-mixpanel/?=gatsby-plugin-mixpanel)) are aimed at giving more granular ways to segment users, measure the rate at which they performed specific actions, and compare groups of users to each other. They can also include advanced analyses, like cohort retention charts. Some (Heap) will auto-track all events, while others (Mixpanel, Amplitude) require users to define and trigger relevant events in code. - -Product analytics tools produce quantitative data -- charts, graphs, and tables -- and are primarily used by demand generation teams to optimize user purchase and conversion rates. - -- Blog post: [Jaxxon: Gatsby + Shopify = Faster Growth](/blog/jaxxon-gatsby-shopify-faster-growth) - -**Session recording tools** ([FullStory](/plugins/gatsby-plugin-hotjar/?=fulls), [Hotjar](/plugins/gatsby-plugin-hotjar/?=gatsby-plugin-hot)) include heatmaps visualizing where users tended to click, and scrollmaps showing engagement drop-offs on landing pages. They overlay users' actions on page screenshots, and let teams track individual visitors' journey through your website. - -Session recording tools collect individualized, qualitative data and tend to be used by designers and UX researchers iterating on page design, layout and copy. In addition, session recordings are often cross-referenced by support teams from their ticketing and chat systems while they are communicating with customers. diff --git a/docs/docs/glamor.md b/docs/docs/glamor.md deleted file mode 100644 index 215f80b865e64..0000000000000 --- a/docs/docs/glamor.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -title: Glamor ---- - -CSS-in-JS library [Glamor](https://github.com/threepointone/glamor) is not actively maintained. The maintainer recommends using [Emotion](/docs/how-to/styling/emotion/). diff --git a/docs/docs/how-to/sourcing-data/headless-cms.md b/docs/docs/how-to/sourcing-data/headless-cms.md index aada4b1e7817b..91999466774bc 100644 --- a/docs/docs/how-to/sourcing-data/headless-cms.md +++ b/docs/docs/how-to/sourcing-data/headless-cms.md @@ -50,7 +50,6 @@ The following CMSs have high popularity among Gatsby users and support key funct | [Prepr CMS](https://prepr.io/) | [guide](https://docs.prepr.io/docs/frontend-integrations/v1/gatsby) | | | | [Forestry](https://forestry.io/) | [guide](/docs/sourcing-from-forestry/) | | | | [Gentics Mesh](https://getmesh.io) | [guide](/docs/sourcing-from-gentics-mesh) | | | -| [Seams-CMS](https://seams-cms.com/) | [guide](/docs/sourcing-from-seams-cms) | | | | [Builder.io](https://www.builder.io/) | [guide](/docs/sourcing-from-builder-io/) | [docs](/plugins/@builder.io/gatsby/) | | | [Flotiq](https://flotiq.com/) | [guide](/docs/sourcing-from-flotiq/) | [docs](/plugins/gatsby-source-flotiq) | | diff --git a/docs/docs/partnering-with-gatsby.md b/docs/docs/partnering-with-gatsby.md deleted file mode 100644 index 09531c058222c..0000000000000 --- a/docs/docs/partnering-with-gatsby.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -title: Partnering with Gatsby ---- - -If you're an organization in the website space -- whether a vendor or an agency -- we'd love to work together with you. - - diff --git a/docs/docs/preparing-for-site-launch.md b/docs/docs/preparing-for-site-launch.md deleted file mode 100644 index b11e4c1db0459..0000000000000 --- a/docs/docs/preparing-for-site-launch.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -title: Preparing Your Site for Launch ---- - -So your Gatsby site is done, and you're ready to share it with the world, **congratulations**! 🎉 - -Before you hit that deploy button though, there are a few things you can do to make sure your site is configured properly to be searchable, shareable, and properly navigable. - -In this section you learn how to add a 404 page for when your users land somewhere unexpected, add search and categorization to your content, and a few other nifty things to ensure your site is crawl-able and index-able to all those fancy bots out there. 🤖 - - diff --git a/docs/docs/recipes/gitlab-continuous-integration.md b/docs/docs/recipes/gitlab-continuous-integration.md deleted file mode 100644 index b059257b81371..0000000000000 --- a/docs/docs/recipes/gitlab-continuous-integration.md +++ /dev/null @@ -1,60 +0,0 @@ ---- -title: "Recipes: Continuous Integration on GitLab" -tableOfContentsDepth: 1 ---- - -Continuous Integration works by pushing small code chunks to your application’s code base hosted in a Git repository, and, to every push, run a pipeline of scripts to build, test, and validate the code changes before merging them into the main branch. -This recipe helps you set up CI/CD on GitLab and automate your production build!. - -## Prerequisites - -- Make sure you have the [Gatsby CLI](/docs/reference/gatsby-cli) installed -- A [GitLab](https://gitlab.com/) account - -## Directions - -1. Create a gatsby site - -```shell -gatsby new {your-project-name} -``` - -2. Change directory and start a development server - -```shell -cd {your-project-name} -gatsby develop -``` - -3. Stop your development server (`Ctrl + C` on your command line in most cases) - -4. Create a `.gitlab-ci.yml` with the following content: - -```yaml -image: node:latest - -stages: - - build - -cache: - paths: - - node_modules/ - -install_dependencies: - stage: build - script: - - npm install - artifacts: - paths: - - node_modules/ -``` - -3. `git push ` -4. Check out your pipeline under the CI/CD option. - -## Additional resources - -- See how you can develop this file into something more real world [GitLab CI/CD Docs](https://docs.gitlab.com/ee/ci/README.html) -- Check this especially to learn how to make your newly build available for a next job - [GitLab Job Artifacts Docs](https://docs.gitlab.com/ee/ci/pipelines/job_artifacts.html) - -- [Getting started with GitLab CI/CD](https://gitlab.com/help/ci/quick_start/README) diff --git a/docs/docs/sourcing-from-seams-cms.md b/docs/docs/sourcing-from-seams-cms.md deleted file mode 100644 index ea1c72c6918dd..0000000000000 --- a/docs/docs/sourcing-from-seams-cms.md +++ /dev/null @@ -1,189 +0,0 @@ ---- -title: Sourcing from Seams-CMS ---- - -[Seams-CMS](https://seams-cms.com) is a [headless CMS](/docs/glossary/headless-cms/) system in which you can manage everything from blog posts to complex data structures like products and translations. After defining your data types, you can add content based on your specific structures. Seams-CMS allows you to localize your content and has an advanced security and workflow model. Your content can be retrieved through different JSON APIs and GraphQL endpoints, which allows you to use your content as you see fit. - -Seams-CMS makes it possible use your content in different scenarios: on your website, in your blogs, and in your apps while managing your content in a single location. - -Creating a Seams-CMS account is free for hobby or small sites. The code samples in this guide assume you're using the demo workspace that is automatically generated when you create a new account. Make sure you add an API key to this workspace in the API key settings. You will need your workspace ID and the (read-only) API key shortly. - -## Setup - -Create a new Gatsby site with the [default starter](https://github.com/gatsbyjs/gatsby-starter-default) and install the source plugin. - -Run this in your terminal: - -```shell -gatsby new seamscms-site -cd seamscms-site -npm install seams-cms-gatsby-source -``` - -### Configuring the source plugin - -Once you have installed the plugin, it's time to configure it. Add the following code to the `gatsby-config.js` file found in the root of your project. - -```javascript:title=gatsby-config.js -module.exports = { - ... - plugins: [ - ... - { - resolve: 'seams-cms-gatsby-source', - options: { - workspace: , - apiKey: , - contentTypes: ['blogpost'], - }, - } - ... - ], - ... -} -``` - -Change `` and `` into the ID of the workspace from your own Seams-CMS account and the newly generated API key inside that workspace. Within the `contentTypes` array, you can list all the IDs of the content types you'd like to import from Seams-CMS into your Gatsby site. For this tutorial, you'll only want to import the `blogpost` content. - -## Checking your connection - -Run `gatsby develop` to fetch your blog posts from Seams-CMS: - -```shell -gatsby develop -``` - -To check if it worked, you can check the GraphQL playground at `http://localhost:8000/___graphql` and look for an `allSeamsCmsBlogpost` section. If found, it means that your blog posts are correctly fetched and stored in the GraphQL layer of Gatsby, ready to be consumed. - -To see what kind of data it holds, try running the following query: - -```graphql -query MyQuery { - allSeamsCmsBlogpost { - edges { - node { - content { - title { - value - } - content { - value - } - author { - value { - content { - name { - value - } - } - } - } - categories { - value { - content { - name { - value - } - } - } - } - } - } - } - } -} -``` - -This will return the title, content, author name, and categories for each blog post. - -## Generating a blog post page - -You can create a site with a single page holding all blog posts. You can do this by creating a template blog index file at `src/templates/blog-index.js` with the following content: - -```javascript:title=src/templates/blog-index.js -import React from "react" - -import Layout from "../components/layout" - -const BlogIndex = ({ pageContext: { blogPosts } }) => ( - - {blogPosts.map(blogPost => ( - <> -

Title: {blogPost.node.content.title.value}

-

- Author: {blogPost.node.content.author.value[0].content.name.value} -

-

{blogPost.node.content.content.value}

-
- - ))} -
-) - -export default BlogIndex -``` - -This template fetches your blog posts from the `pageContext` (passing your data along with this variable), and iterates over all the posts. For each post, it prints the title, the author's name, the content, and whatever you'd like to add that is present in the GraphQL data. For instance, you might also fetch things like tags, categories, snippets, image headers, etc. - -Once you have created your template, connect your data to it! Check out the `gatsby-node.js` file found in your root directory. Note that you will need a GraphQL query that you can generate automatically through the web interface. Select all the fields you want to use in your template and copy/paste this query into the new file: - -```javascript:title=gatsby-node.js -const blogQuery = ` - query MyQuery { - allSeamsCmsBlogpost { - edges { - node { - content { - title { - value - } - content { - value - } - author { - value { - content { - name { - value - } - } - } - } - categories { - value { - content { - name { - value - } - } - } - } - } - } - } - } - } -` -``` - -You're almost there! Next, create and export a `createPages` function in the same `gatsby-node.js` file that will create your page: - -```javascript:title=gatsby-node.js -exports.createPages = async ({ graphql, actions: { createPage } }) => { - const query = await graphql(blogQuery) - - createPage({ - path: `/blogs`, - component: require.resolve("./src/templates/blog-index.js"), - context: { - blogPosts: query.data.allSeamsCmsBlogpost.edges, - }, - }) -} -``` - -Finally, when you run `gatsby develop` again, it should generate a `/blogs` page with your content. You can visit this at `http://localhost:8000/blogs`. - -## Other resources - -For more detailed information about setting up Seams-CMS with Gatsby, see the [Seams-CMS blog](https://blog.seams-cms.com/entry/using-seams-cms-with-gatsbyjs/). diff --git a/docs/docs/using-gatsby-professionally/answering-it-security.md b/docs/docs/using-gatsby-professionally/answering-it-security.md deleted file mode 100644 index a6a26433d1935..0000000000000 --- a/docs/docs/using-gatsby-professionally/answering-it-security.md +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: Answering IT & Security Questions ---- - -At larger companies, such as the Fortune 500, there are Security teams that audit new technologies being used inside the company. - -If security engineers are interested in your project, some talking points that can help answer their questions include: - -- Because Gatsby compiles your site to flat files, rather than having running app servers and databases users are targeting, it reduces the attack surface of the site to outsiders. -- Gatsby adds a layer of indirection which obscures your CMS -- so even if your CMS _is_ vulnerable, bad actors have no idea where to find it. This is in contrast to systems where bad actors can easily locate the admin dashboard at, e.g., `/wp-admin` and attempt to hack in. -- Gatsby lets you serve your site from a global CDN, likely whatever CDN your company is using (e.g. Akamai, Cloudflare, Fastly...), which effectively eliminates the risk of DDoS attacks. - -It's helpful to emphasize to security personnel that these benefits were a factor in why Gatsby was selected for the project. You chose Gatsby, in part, because it is _more_ secure. - -Read about security in Gatsby: [https://www.gatsbyjs.com/blog/2019-04-06-security-for-modern-web-frameworks/](/blog/2019-04-06-security-for-modern-web-frameworks/) - ---- - -**Note:** do you have additional ideas on how to answer IT and security questions for Gatsby projects? We welcome contributions to the Gatsby docs. Find out [how to contribute](/contributing/docs-contributions/). diff --git a/docs/docs/using-gatsby-professionally/best-practices-for-orgs.md b/docs/docs/using-gatsby-professionally/best-practices-for-orgs.md deleted file mode 100644 index 16de8256e132a..0000000000000 --- a/docs/docs/using-gatsby-professionally/best-practices-for-orgs.md +++ /dev/null @@ -1,14 +0,0 @@ ---- -title: Best Practices for Organizations -issue: https://github.com/gatsbyjs/gatsby/issues/14042 ---- - -When you have multiple teams building Gatsby sites, there are some best practices to ensure you're working well at scale. These docs explain those practices. - - - --- - -This is a stub. Help our community expand it. - -Please use the [Gatsby Style Guide](/contributing/gatsby-style-guide/) to ensure your pull request gets accepted. diff --git a/docs/docs/using-gatsby-professionally/component-libraries.md b/docs/docs/using-gatsby-professionally/component-libraries.md deleted file mode 100644 index cf72c5d6185ba..0000000000000 --- a/docs/docs/using-gatsby-professionally/component-libraries.md +++ /dev/null @@ -1,34 +0,0 @@ ---- -title: Creating Component Libraries ---- - -Component libraries are often used in component-based UI systems like React and Vue. They are typically versioned repositories of components. - -IBM's [Carbon Design System](https://www.carbondesignsystem.com/) and Palantir's [Blueprint](https://blueprintjs.com/) are both good examples. - -## Why component libraries - -There are several rationales for creating component libraries. - -- **Create unified design**. In large web properties and web apps, the look and feel can diverge across different sections maintained by different teams. Component libraries are often used to implement a [design system](https://www.designsystems.com/). -- **Avoid reinventing the wheel**. Component libraries include common elements like carousels or dropdowns to avoid the need for individual teams to reimplement these components. - -## Tooling & team setups - -Component libraries are typically maintained by one individual or a design team that acts as a curator; when a website team or feature team needs a component, it is typically available ready for them to use, so they can move faster. - -Component libraries are typically stored in a separate repository. Individual apps or websites then specify in their dependencies (in `package.json`) which version of each component they are using. - -One drawback of using component libraries is the additional complexity of cross-repository dependencies. - -For example, if a feature developer need to change a library component, that developer's workflow typically involves two pull requests; one to the component repository repo to make the changes, and one to the website repository to bump the component version. - -## Different versioning approaches - -There are two different approaches for versioning component libraries. - -The first is to version on globally across the component library. At any given commit, the library has one version number (e.g. `30.3.1`). Any commit updating a component will then bump the version number accordingly. Both Carbon Design System and Blueprint take this approach. - -The second approach is to version each component in the component library. This was used, for example, [by Walmart.com](https://medium.com/walmartlabs/how-to-achieve-reusability-with-react-components-81edeb7fb0e0) -- they built their component library as React components, and created every component as a separate, versioned npm package. - -This approach allows more granularity -- _what if you want an older version of one component, but a newer version of another one?_ -- but requires additional tooling to make developer workflows pleasant. diff --git a/docs/docs/using-gatsby-professionally/convincing-others.md b/docs/docs/using-gatsby-professionally/convincing-others.md deleted file mode 100644 index c299890ac9659..0000000000000 --- a/docs/docs/using-gatsby-professionally/convincing-others.md +++ /dev/null @@ -1,15 +0,0 @@ ---- -title: Convincing Others ---- - -This section of the documentation has a slightly different tenor than the rest of the docs. - -The purpose of the rest of the docs is to help you understand Gatsby. The purpose of this section is to help you explain Gatsby to others. - -Explaining Gatsby well to others, and helping convince them to use it (or to let you use it) is a different kind of problem than becoming a talented Gatsby developer. - -It requires understanding what things those around you value, and helping them understand how Gatsby meets _their_ needs, rather than simply how Gatsby meets yours. - -Gatsby is a transformative technology, and teams using Gatsby have the chance to radically improve the way they design, develop, and deploy websites. As you help others around you understand how Gatsby meets their needs, you facilitate their growth. - -https://twitter.com/ryanflorence/status/1104060348363988992 diff --git a/docs/docs/using-gatsby-professionally/different-organization-types.md b/docs/docs/using-gatsby-professionally/different-organization-types.md deleted file mode 100644 index f5ed501b85227..0000000000000 --- a/docs/docs/using-gatsby-professionally/different-organization-types.md +++ /dev/null @@ -1,13 +0,0 @@ ---- -title: Different Organization Types ---- - -Using Gatsby more is a different kind of problem depending on the type of organization you work in. - -As a freelancer, the most important thing is [helping clients understand](/docs/using-gatsby-professionally/winning-over-clients/) the benefits of Gatsby. - -As an agency, you'll want to show others [how Gatsby helps your agency](/docs/using-gatsby-professionally/using-gatsby-professionally/gatsby-for-agencies/) ship higher quality sites faster and under budget -- and see how Gatsby can contribute to the agency's growth strategy. - -If you're at a company, there are [different strategies for adopting Gatsby](/docs/using-gatsby-professionally/using-gatsby-professionally/gatsby-for-companies/) depending on the type and size of company. - - diff --git a/docs/docs/using-gatsby-professionally/faster-recruiting.md b/docs/docs/using-gatsby-professionally/faster-recruiting.md deleted file mode 100644 index 7fb203f6571b4..0000000000000 --- a/docs/docs/using-gatsby-professionally/faster-recruiting.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -title: Faster Recruiting ---- - -With the rise of React, it's become easier to find talented developers who are skilled in React, than developers who are skilled in various flavors of CMS UI development frameworks. - -Jesus Olivas, the Head of Engineering at WeKnow, a 40-person agency based in San Diego, CA, [explains](https://www.youtube.com/watch?v=tWu1xfF18FI&feature=youtu.be&t=2392): - -> On the agency side of things, it's easier to get a developer that knows React, than finding another developer that knows Drupal theming [and] Twig... diff --git a/docs/docs/using-gatsby-professionally/first-professional-project.md b/docs/docs/using-gatsby-professionally/first-professional-project.md deleted file mode 100644 index 9267cfd113f91..0000000000000 --- a/docs/docs/using-gatsby-professionally/first-professional-project.md +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: First Professional Project ---- - -The most important professional Gatsby project you or your organization will ever ship is your first project. - -Why is that? - -## Shipping Gatsby websites changes the conversation - -- **Shipped means more real.** It's common to talk about exciting new technologies, but much less common to actually see them used in production. Shipping a Gatsby website will make others see Gatsby as an actual choice to consider. -- **Seeing is believing.** Gatsby sites shock people by how fast they are. When someone ships a Gatsby site, other people start asking how they can get sites that fast. - -https://twitter.com/Netlify/status/1011344285529182211 - -- **Discover allies.** Once you ship a Gatsby website, other Gatsby enthusiasts may come out of the woodwork. It's common to want change, but believe it's impossible. When the first Gatsby site ships, others may join you in trying to push for increased Gatsby usage. - -- **Creating a case study.** Once business metrics, such as decreased page load times, increased conversion rates, or decreased bounce rates, are available from the new project launch, you can use these metrics as evidence that Gatsby is worth considering. - -## How to ship your first website - -Gatsby adoption within organizations tends to follow a "bottoms-up" rather than "top-down" approach. - -What that means is that the first usage is typically not driven by executive mandate for a high-profile project. Instead, typically, initial websites are often smaller or have fewer stakeholders. - -This could be one-off campaigns, landing pages, brochure sites, as well as documentation pages or other internal resources. diff --git a/docs/docs/using-gatsby-professionally/gatsby-for-agencies.md b/docs/docs/using-gatsby-professionally/gatsby-for-agencies.md deleted file mode 100644 index ab3f7715aaab3..0000000000000 --- a/docs/docs/using-gatsby-professionally/gatsby-for-agencies.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -title: Using Gatsby Inside Agencies ---- - -There are several aspects of Gatsby that create interesting potential playbooks for agencies using Gatsby, as well as unique benefits to agencies using Gatsby. - - - -The Gatsby blog has a [section on agencies](/blog/tags/agencies/) with additional stories and tips. diff --git a/docs/docs/using-gatsby-professionally/gatsby-for-companies.md b/docs/docs/using-gatsby-professionally/gatsby-for-companies.md deleted file mode 100644 index 20b726f258868..0000000000000 --- a/docs/docs/using-gatsby-professionally/gatsby-for-companies.md +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: Spreading Gatsby in Companies ---- - -Broadly speaking, in terms of overall Gatsby usage, there are two types of organizations which have high receptivity to using Gatsby across the organization. - -First, **software companies** -- more broadly, organizations who primarily build, and generally sell, software. - -Second, **Internet-adjacent organizations** -- non-software organizations whose activities have been significantly affected by the Internet. This includes businesses in areas like travel, retail, consumer finance, media, and so on. - -## Software companies - -Software companies -- whether small startups or large, Fortune 500 companies -- tend to have lots of software developers. - -Moreover, in software companies, technology decisions are often made bottoms-up by developers rather than top-down by executives. - -In these environments, if one developer is excited about Gatsby, they can build company projects in Gatsby. If several developers become excited by Gatsby, they may get a team or a group of teams using Gatsby. - -If you work in this organization, and want your organization to use Gatsby more, you can go a long way simply by [getting other developers excited by Gatsby](/docs/using-gatsby-professionally/winning-over-developers/). - -After that, you'll find winning over [engineering leaders](/docs/using-gatsby-professionally/winning-over-engineering-leaders/), [marketers](/docs/using-gatsby-professionally/winning-over-marketers/) and [executives](/docs/using-gatsby-professionally/winning-over-executives/). is significantly easier. - -## Internet-adjacent organizations - -Internet-adjacent organizations whose activities have been significantly affected by the web, including areas like travel, retail, consumer finance, media, and so on. - -[Digital presence is increasingly important](/blog/2018-10-10-unbundling-of-the-cms) for these businesses, but they often don't often see themselves as software companies. - -Because developers are often not the decision-makers around technologies in these businesses, bottoms-up adoption can be challenging. - -If you're in an organization like this, it's important to: - -- strongly emphasize Gatsby's benefits in language familiar to [marketers](/docs/using-gatsby-professionally/winning-over-marketers/) and [executives](/docs/using-gatsby-professionally/winning-over-executives/). - -- position Gatsby as part of "digital transformation" initiatives your company undertakes. Faced with new competitors taking market share (e.g. Amazon in retail, Expedia and Airbnb in travel, PayPal in consumer finance), these businesses typically emphasize a priority as a company to be more Internet-native. This can provide an opening to pitch Gatsby as a way to do this. diff --git a/docs/docs/using-gatsby-professionally/gatsby-for-freelancers.md b/docs/docs/using-gatsby-professionally/gatsby-for-freelancers.md deleted file mode 100644 index 645ddbd6abe4b..0000000000000 --- a/docs/docs/using-gatsby-professionally/gatsby-for-freelancers.md +++ /dev/null @@ -1,13 +0,0 @@ ---- -title: Gatsby for Freelancers -issue: https://github.com/gatsbyjs/gatsby/issues/21069 ---- - -As a freelancer, the most important thing is [helping clients understand](/docs/using-gatsby-professionally/winning-over-clients/) the benefits of Gatsby. - --- - -This is a stub. Help our community expand it. - -Please use the [Gatsby Style Guide](/contributing/gatsby-style-guide/) to ensure your -pull request gets accepted. diff --git a/docs/docs/using-gatsby-professionally/gatsby-in-the-enterprise.md b/docs/docs/using-gatsby-professionally/gatsby-in-the-enterprise.md deleted file mode 100644 index fe6c0d1cfdfea..0000000000000 --- a/docs/docs/using-gatsby-professionally/gatsby-in-the-enterprise.md +++ /dev/null @@ -1,77 +0,0 @@ ---- -title: Building with Gatsby in the Enterprise ---- - -Some Gatsby advocates may be working inside “enterprise” software development organizations. Others may work at agencies which work closely with such organizations. - -If this describes you, you have unique challenges, but also opportunities, building with Gatsby at your company. - -This guide is designed to help you navigate the terrain in order to effectively advocate for Gatsby within your organization. - -## Common characteristics of enterprises - -People mean different things when they say “enterprise”. Some mean 500-person companies. Other people mean 20,000-person companies. - -When we say “enterprise” we mean large companies with established infrastructural setups -- in-house layers of code, frameworks, processes, and preferred vendors to handle concerns such as hosting, deployments, CDN, etc. - -Other common characteristics include specified procurement processes, standardization on particular technology stacks, changeover at e.g. 5-year intervals, and frequent security audits. Often, enterprises are heavily invested in maintaining and improving existing web properties (“brownfield”) as opposed to creating new ones (“greenfield”). - -## Key benefits of Gatsby for enterprises - -One of the key challenges that enterprises face is keeping their tech stack up to date in order to enjoy productivity and performance benefits, while preventing their tooling setups from degrading into “legacy” code. - -A related challenge is how to continue to attract and retain top engineering talent. - -Surveys at enterprises adopting Gatsby have found that developers there highlight benefits such as: - -**1. The ability to build with modern tools such as React, webpack, and GraphQL.** Adopting more common frameworks, rather than custom in-house tooling, tends to increase developer satisfaction, developer productivity, and the ability to recruit developers. - -**2. The ability to be productive from the start.** Reduced time on dev and build tooling setup / configuration helps developers get going right away. The burden of maintaining high-quality tooling setups is offloaded from internal tooling teams (and managers) to the Gatsby maintainer team. - -### Overcoming obstacles to adoption - -Introducing Gatsby in the enterprise has unique challenges. After watching different sizes and types of enterprises adopt Gatsby, we’ve learned some lessons about how to overcome them. - -Depending on your type of your organization, not all of these challenges may apply to you! - -**Challenge 1: Requirements to integrate with in-house tooling.** Some enterprises require integration with concerns such as those listed above. - -A somewhat complete list of potential areas that may have in-house, standard solutions: authentication, SSO, error logging, deployments, staging, hosting, security, CDN, middleware (data fetching), analytics, and internationalization/localization. - -These requirements tend to be in place to enable marketing, security, analytics, and operations teams to function effectively. - -**Solution 1: Dedicate a few days or weeks to build integrations.** If your company has these requirements, building integrations is quite feasible with Gatsby’s plugin system (and even well-documented, with many examples for each category of integration). - -**Challenge 2: Need for buy-in from executives.** Sometimes new technology adoption in the enterprise requires buy-in from executives who aren’t end users of Gatsby. - -**Solution 2: Potential strategies to get buy-in include building consensus among developers, executing a simple proof of concept, and using the language of execs and managers.** - -Depending on what your enterprise looks like, there can be different strategies for generating buy-in. These strategies can be used separately or together. - -**Build consensus among developers.** If developers in your organization are influential, it can be helpful to build consensus among developers and engineering managers around Gatsby. If other developers aren’t familiar with Gatsby, holding “brown bag lunches” and workshops (going through the Tutorial tends to work well) can build excitement. - -**Execute a simple proof of concept.** Actually having built something with Gatsby often changes the conversation — it becomes less of an abstract concept to others, and more of a concrete possible choice. Choosing a small project and building it with Gatsby can go a long way towards socializing Gatsby in your organization. - -**Use the language of executives and managers.** Executives have different goals and objectives than developers. Read about the [Executive persona](/docs/using-gatsby-professionally/winning-over-executives/) to see how to explain Gatsby in a way that executives find attractive. - -One key strategy can be to align yourself to organization-wide “digital transformation” initiatives, especially if your company is in an industry that is being changed by the Internet (such as retail, travel, consumer goods, content, or hospitality). - -**Challenge 3: Required coordination with third-party agencies.** Some enterprises contract with third-party agencies for a moderate or significant part of their website development. Desires by an enterprise for technology shifts and upgrades often require tight coordination with agency partners. If an enterprise and its agency partners don’t have a strong relationship, coordinating on a switch to Gatsby becomes difficult. - -**Solution 3: Work closely with agency partners to ensure adopting Gatsby helps them, too.** It’s often a benefit to agencies to be familiar with cutting-edge technologies such as Gatsby (and the whole Gatsby stack: React, GraphQL, webpack, etc). It allows them to share their expertise with other client organizations. In addition, it helps them distinguish themselves from their competitors (other agencies). - -Often, there are key individuals at agencies that are excited for personal and professional reasons to spearhead these kinds of projects. Identifying these individuals and working closely with them can unlock key doors and generate momentum to move your Gatsby project forward. - -One key to successfully completing a Gatsby project is having a pre-existing relationship of trust between the enterprise and its agency partners. When this isn’t true — perhaps because of past behavior on the part of one or both parties — any sort of change becomes difficult. - -## Conclusion - -Adopting Gatsby in an enterprise can be more difficult than in small companies. However, there are lasting benefits for the company as well as the individuals guiding the change. - -Because technology choices are more sticky in the enterprise, driving adoption of Gatsby may mean that you drive value for your company in a way that lasts for 5-10 years. - -The benefits your company will derive, such as performance and the ability to rapidly iterate on its consumer-facing web presence and digital footprint, will provide significant benefits in the marketplace. Your company will be more likely to thrive _because of the work you did_. - -Typically, individuals who guide and lead a shift to Gatsby are seen as forward-thinking and as agents of change, which can be [very beneficial for their careers within the company](/docs/using-gatsby-professionally/using-gatsby-professionally/how-gatsby-boosts-career/). In addition, as the Gatsby rollout gains steam and proceeds through the company, they are prime candidates to spearhead the effort. - -For more, see [blog posts on Gatsby in the enterprise](/blog/tags/enterprise). diff --git a/docs/docs/using-gatsby-professionally/going-gatsby-only.md b/docs/docs/using-gatsby-professionally/going-gatsby-only.md deleted file mode 100644 index 6c83513b9931c..0000000000000 --- a/docs/docs/using-gatsby-professionally/going-gatsby-only.md +++ /dev/null @@ -1,24 +0,0 @@ ---- -title: Going Gatsby-Only ---- - -Some agencies and freelancers have decided that in order to unify their business, they will _only_ build sites on Gatsby and turn down clients or projects where it's not possible to use Gatsby. - -Some of the benefits such agencies list include: - -- reduced knowledge silos -- a unified technology stack -- consistent fast development -- no time ever spent on performance optimization -- ability to build projects across CMS-es -- a more cohesive team. - -One example of this is [Narative.co](https://www.narative.co/), based in Montreal. Narative [wrote a blog post](/blog/2018-06-18-why-narative-loves-gatsby/) laying out some of these benefits: - -> Gatsby allows our team to use the powerful React API when creating page based websites with almost no drawbacks. All the principles and techniques we’ve learned from using React for the last few years can be leveraged with Gatsby. This has enabled us to create a team that is extremely dynamic and cohesive without the worry of creating silos or losing knowledge across teams. Our team is able to learn once, write everywhere. With an engineering team that’s familiar with React and Gatsby we’re able to tackle more problems faster, which is highly beneficial to our partners and the services we offer. - -> Gatsby does not only allow us to deliver fast websites, it has also sped up our development time. The developer experience is another focus of the team behind Gatsby - and it shows. Features such as live reload are ready to go at when you start a new project. There’s no need to set up a custom webpack configuration as the basics are completed for you. Building your website and deploying is also carefully thought out by Gatsby and often requires running a single command and using one of the many integrations for hosting. Furthermore, the documentation is comprehensive and has plenty of content from introductory guides to complex use cases. This has been amazing for training and onboarding new members of our team, especially if they’re already familiar with React. - -> Many popular CMS tools are tightly coupled to their source of data. Gatsby offers a clear separation between the data and view layer building on top of the Headless CMS principles. The advantage for Narative is that we can develop without CMS lock-in such as WordPress. If our team decides to go with a new view layer the migration would be less painful than migrating all the data as well. Often times flexibility in software means more complexity to manage but in this case the flexibility is in the right spots where it reduces complexity. - -> We pass this flexibility on to our partners. They are able to manage their data while our team is able to deliver an excellent product on top of their existing infrastructure. This has made our solutions to revamping legacy projects even stronger than before. diff --git a/docs/docs/using-gatsby-professionally/how-gatsby-boosts-career.md b/docs/docs/using-gatsby-professionally/how-gatsby-boosts-career.md deleted file mode 100644 index 0574b63015cd5..0000000000000 --- a/docs/docs/using-gatsby-professionally/how-gatsby-boosts-career.md +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: How Gatsby Can Boost Your Career ---- - -If you're a developer, and you've come to this section looking for tips about spreading Gatsby in your organization, your main motive is probably the ability to work more with a tool you love. - -One, unintended, side effect: this is also good for your career. - -As you ship Gatsby sites and get [other developers](/docs/using-gatsby-professionally/winning-over-developers/), [engineering leaders](/docs/using-gatsby-professionally/winning-over-engineering-leaders/), [marketers](/docs/using-gatsby-professionally/winning-over-marketers/) and [executives](/docs/using-gatsby-professionally/winning-over-executives/), and [clients](/docs/using-gatsby-professionally/winning-over-clients/) excited about Gatsby, you'll notice that you gain visibility, a reputation for driving results and business value. - -> Some insight on driving results forward from prominent React developer, Ryan Florence: https://twitter.com/ryanflorence/status/1104060348363988992 - -In general, great engineering career opportunities often lie in developing expertise in new, rapidly emerging systems and technologies -- there are fewer established domain experts in these fields, room to carve out a personal brand as an expert, and an ever-growing demand for expertise. - -For an inspiring story on how Gatsby has already transformed someone's career, read our [interview with Ahmed Alahmady](/blog/2019-05-03-how-gatsby-helped-jump-start-my-engineering-career/) on the Gatsby blog. - ---- - -**Note:** do you have more ideas on how Gatsby can boost your career? We welcome contributions to this page. Find out [how to contribute](/contributing/docs-contributions/). diff --git a/docs/docs/using-gatsby-professionally/lower-bids-more-profit.md b/docs/docs/using-gatsby-professionally/lower-bids-more-profit.md deleted file mode 100644 index 17ec7ce902f37..0000000000000 --- a/docs/docs/using-gatsby-professionally/lower-bids-more-profit.md +++ /dev/null @@ -1,15 +0,0 @@ ---- -title: Lower Bids, More Profit ---- - -Many agencies use a different pricing model for bidding Gatsby websites that enables them to make more money and expand their business. - -After identifying projects that are a good fit for Gatsby, they will bid _significantly under_ a typical bid for a project of that time. Because Gatsby enables the team to work faster, they've still able to make standard profits on the project while growing their business and creating happy clients. - -Ben Robertson, of the 80-person Mediacurrent agency, [explains this strategy](https://www.youtube.com/watch?v=QiocnDGnKfs&feature=youtu.be&t=1145) in the context of Mediacurrent's work on the citysprings.com website for the city of Sandy Springs, GA: - -> "This was an experimental project for us. We had done decoupled Drupal before, but this was our first project as a team that was using Gatsby and it was a budget that was actually significantly under what we would charge for a full Drupal 8 build. And that was scary! - -Not only was the team able to deliver the project on time and under budget, but the client was so happy they were able to [get additional work immediately](https://www.youtube.com/watch?v=QiocnDGnKfs&feature=youtu.be&t=1531): - -> Because they saved a significant portion of the money that they had already set aside, they [told us], "Hey, you guys just saved us a bunch of money, and also we would like some new features, so can we please pay you some money to build those features for us?" diff --git a/docs/docs/using-gatsby-professionally/making-components-discoverable.md b/docs/docs/using-gatsby-professionally/making-components-discoverable.md deleted file mode 100644 index 934943f11a351..0000000000000 --- a/docs/docs/using-gatsby-professionally/making-components-discoverable.md +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: Making Components Discoverable -issue: https://github.com/gatsbyjs/gatsby/issues/14042 ---- - -Code reuse is a useful advantage of the modularity provided by components. Discoverability is a key factor for sharing reusable components between developers and websites. - -In larger organizations using Gatsby, it becomes more important for different teams to be able to browse components used by other teams, in order to avoid reinventing the wheel. Making components discoverable also helps in creating a component design system that helps keep your UX/UI consistent across websites and applications. - -Shared components can be organized and made discoverable in a [shared component hub like bit.dev](https://bit.dev/components) to search, visualize, interact with and consume. Teams can share and discover components, use them in different projects, suggest updates and stay in sync. - -If using additional repositories and libraries to share components, tools like [StoryBook](/docs/how-to/testing/visual-testing-with-storybook/) and [Styleguidist](https://github.com/styleguidist/react-styleguidist) can help develop and visualize components in isolation, creating a visual documentation portal for shared components. - ---- - -This is a stub. Help our community expand it. - -Please use the [Gatsby Style Guide](/contributing/gatsby-style-guide/) to ensure your -pull request gets accepted. diff --git a/docs/docs/using-gatsby-professionally/sanitize-your-stack.md b/docs/docs/using-gatsby-professionally/sanitize-your-stack.md deleted file mode 100644 index 67a3372935c2b..0000000000000 --- a/docs/docs/using-gatsby-professionally/sanitize-your-stack.md +++ /dev/null @@ -1,15 +0,0 @@ ---- -title: Sanitize Your Stack ---- - -Websites come in a thousand different flavors. Timeframes, budgets, interactivity requirements, and content systems can vary wildly from one project to the next. - -This variety puts agency website teams between a rock and a hard place. They often have to maintain frontends built in multiple development systems, stretching their developers’ skill sets. Implementing the same dropdown in five different frameworks can be a huge headache. But what’s the alternative — turn down good client projects? - -To add to the difficulty, when your UI development framework is coupled to your client’s CMS backend, it doesn’t just cause technical problems; it causes people problems. It makes your team’s staffing plans dependent on specific projects. It hamstrings your ability to respond to changing client requirements by shifting resources around. - -Gatsby solves this -- because Gatsby pulls your data from wherever it lives and exposes it in a uniform GraphQL interface, agency teams can build all their UIs in React — no matter where their content is coming from. - -Gatsby lets agencies stop reinventing the wheel and makes agency developers more productive. Teams can use the best tool for the job, without creating a hodgepodge of technologies to maintain. - -Sanitize your stack, with Gatsby. diff --git a/docs/docs/using-gatsby-professionally/setting-up-gatsby-without-gatsby-new.md b/docs/docs/using-gatsby-professionally/setting-up-gatsby-without-gatsby-new.md deleted file mode 100644 index fec90e4e5c421..0000000000000 --- a/docs/docs/using-gatsby-professionally/setting-up-gatsby-without-gatsby-new.md +++ /dev/null @@ -1,69 +0,0 @@ ---- -title: Setting up a Gatsby Site Without the `gatsby new` Command ---- - -There are many Enterprise level companies that maintain an internal clone of the npm registry for security purposes. If you work for such a company, you may find that you are able to successfully run `npm install -g gatsby-cli` but cannot run the `gatsby new ` as the `gatsby new` command clones a repo from a public GitHub repository. Many companies block public GitHub, which will cause the `gatsby new` command to fail. Not to worry, though, you can set up a new Gatsby site without the `gatsby new` command with a few quick steps. - -## Preparing your environment - -To get started with Gatsby, you’ll need to make sure you have the following software tools installed: - -1. [Node.js](/docs/tutorial/part-0/#install-nodejs-for-your-appropriate-operating-system) -2. [Gatsby CLI](/docs/tutorial/part-0/#using-the-gatsby-cli) - -For step-by-step installation instructions and detailed explanations of the required software, head on over to the [Gatsby tutorial](/docs/tutorial/part-0/). - -After your developer environment is set up, you'll want to set up a new project folder. - -```shell -mkdir my-new-gatsby-site -cd my-new-gatsby-site -``` - -Next, you'll need to set up npm within your project. - -```shell -npm init -``` - -Fill out the prompts for the `package.json` file that is generated. If you'd like to skip that, you can run `npm init -y` and a pre-filled `package.json` will be generated for you. - -Now, you'll need to install the necessary packages that Gatsby relies on to work its magic. - -```shell -npm install gatsby react react-dom -``` - -Next, you'll add a `src` directory and a `pages` directory inside your project. - -```shell -mkdir src -cd src -mkdir pages -``` - -Inside the pages directory, you'll make an `index.js` file that exports a React component. - -```shell -cd pages -touch index.js -``` - -Now, add some React code to your `index.js` file as a starting point for your project. - -```jsx:title=src/pages/index.js -import React from "react" - -export default function Home() { - return

Hello Gatsby!

-} -``` - -Finally, go back to the root of your project and run the `gatsby develop` command to start a development server and begin coding. - -```shell -cd ../../ -gatsby develop -``` - -And that's it! You should now have your initial page running on `http://localhost:8000` with a GraphiQL IDE running on `http://localhost:8000/___graphql`. From here, you can follow the rest of the [Gatsby tutorial](/docs/tutorial/part-0/#set-up-a-code-editor) starting with setting up a code editor to get the full experience of what Gatsby can offer. diff --git a/docs/docs/using-gatsby-professionally/sharing-components-across-websites.md b/docs/docs/using-gatsby-professionally/sharing-components-across-websites.md deleted file mode 100644 index 8ce788b48a475..0000000000000 --- a/docs/docs/using-gatsby-professionally/sharing-components-across-websites.md +++ /dev/null @@ -1,20 +0,0 @@ ---- -title: Sharing Components Across Websites -issue: https://github.com/gatsbyjs/gatsby/issues/14042 ---- - -One of the benefits of multiple teams using Gatsby within your organization is the ability to share React components across different websites. - -There are several strategies here. - -**Component libraries** are a cleaner and purer approach, but often requiring additional tooling or causing some changes to require pull requests to multiple. - -Alternately, teams can implement **systems for component discoverability**, such as [Storybook](https://github.com/storybookjs/storybook) or [Styleguidist](https://github.com/styleguidist/react-styleguidist), on a per-site basis and copy-paste desired code across repositories. - -To avoid copy-pasting and reuse components instead you can use **component-sharing tools** such as [Bit](https://github.com/teambit/bit) to reuse and sync components between websites. - - - ---- - -**Note:** do you have additional ideas on sharing components across websites? We welcome contributions to the Gatsby docs. Find out [how to contribute](/contributing/docs-contributions/). diff --git a/docs/docs/using-gatsby-professionally/using-gatsby-professionally.md b/docs/docs/using-gatsby-professionally/using-gatsby-professionally.md deleted file mode 100644 index 537a708b4f6ac..0000000000000 --- a/docs/docs/using-gatsby-professionally/using-gatsby-professionally.md +++ /dev/null @@ -1,17 +0,0 @@ ---- -title: Using Gatsby Professionally ---- - -As a Gatsby developer and enthusiast, you may be interested in how you can spend more of your time professionally building with Gatsby. - -You may see problems happen around you that you know Gatsby could solve, and want others to adopt Gatsby so they don't encounter them in the future. You may be interested in driving business goals, such as growing your organization or increasing revenue. Or, you may simply love building with Gatsby and want to do it more. - -This section of the documentation is aimed to help you spend more time as a Gatsby developer by giving you the tools to spread Gatsby within your organization or convince clients that Gatsby is the right tool for them. - -It includes resources for how to explain Gatsby to different stakeholders, such as other developers, engineering leaders, marketers, executives, and clients. - -It also includes resources that help your teams develop more effectively at scale -- when there are multiple developers on a project or multiple projects in the organization. - -Finally, it includes resources for you about how Gatsby can help you advance professionally within your career -- whatever your goals and ambitions are. - - diff --git a/docs/docs/using-gatsby-professionally/winning-over-clients.md b/docs/docs/using-gatsby-professionally/winning-over-clients.md deleted file mode 100644 index 2c82338e05a5a..0000000000000 --- a/docs/docs/using-gatsby-professionally/winning-over-clients.md +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: Winning Over Clients -issue: https://github.com/gatsbyjs/gatsby/issues/14040 ---- - -The top priority of most clients is that the website is shipped to their standard of quality, on time, and under budget. - -In addition, they usually want to be able to use familiar CMS-based workflows to create, edit, and publish content. - -Some benefits that you can use to pitch Gatsby to clients include: - -- Works with their CMS -- Fast development speed ensures project will be on time -- Ease of making development changes helps keep project under budget -- Lower hosting cost helps keep project under budget -- Fast performing websites which reduce page load and response time -- Supports creation of highly scalable and dynamic apps -- Rich plugin ecosystem which helps tackle complex code - -[This one-pager](/gatsby-one-pager.pdf) may also be useful for clients -- it explains Gatsby in their language. - --- - -This is a stub. Help our community expand it. - -Please use the [Gatsby Style Guide](/contributing/gatsby-style-guide/) to ensure your -pull request gets accepted. diff --git a/docs/docs/using-gatsby-professionally/winning-over-content-creators.md b/docs/docs/using-gatsby-professionally/winning-over-content-creators.md deleted file mode 100644 index cfe1d7eb79f96..0000000000000 --- a/docs/docs/using-gatsby-professionally/winning-over-content-creators.md +++ /dev/null @@ -1,48 +0,0 @@ ---- -title: "Winning Over Content Creators" ---- - -If you spend much time building marketing and other informational sites, you're probably used to leaving the day-to-day updates and maintenance of the site to content creators. For this reason, content creators are highly influential stakeholders in any decision around changes to content management tools and the frameworks/tech stack that interacts with those tools. The performance advantages of Gatsby and ability to pull content from any source are certainly enough to get them interested, but here are some talking points and resources to help convince them that Gatsby is right for their site. - -Some specific things that content creators care about include: - -- **Building efficient and clear workflows** Content creators often have to manage lots of different projects with lots of little deadlines. As a result, they often put a lot of work into establishing easy, repeatable patterns for completing their tasks. This frees up their time and energy for creating better content and meeting strategic goals. -- **Search engine optimization (SEO)** Content creators want people to be able to find their content! One of the best ways to do this is understanding how content is crawled by search engines and following SEO best practices. -- **Understanding their audience** Web content is meant to engage visitors, educate them, move them towards certain calls to action, and persuade them that you understand and can meet their specific needs. Understanding your visitors' specific needs and interests is critical to creating engaging content. -- **Easy site management** Publishing content to a website is generally the last step in any content project. If that step becomes a bottleneck or barrier for content creators who think they're in the home stretch, that can be extremely frustrating. It's even more frustrating if that project is a time-sensitive, last-minute product announcement or other high-stakes update. - -## Basic explanation - -Here’s an example of a basic explanation of Gatsby for content creators: - -> Gatsby is a framework for building modern websites and applications. It can pull data into your site from any and all CMSs or other sources you currently use. Gatsby sites have built-in performance optimization and other web best practices, and organizations that have moved their sites to Gatsby have seen significant improvements in organic search traffic and lead conversion. - -## Specific Benefits - -Content creators may be curious about how common content management systems can fit together with Gatsby, how it impacts user engagement, and how Gatsby's performance advantages can improve the visibility of their content. - -### Use the tools you already know and love - -> Gatsby can be configured to work with many CMS platforms and databases out of the box, including the CMS and tools you're already using. If you love using your current CMS and have carefully crafted workflows for your specific needs and tasks, great! Gatsby doesn’t decide your workflow, you do. - -### Better audience engagement and lead conversion - -> Site speed and performance has a huge impact on sales and customer engagement. A [recent Akamai study](https://www.akamai.com/uk/en/about/news/press/2017-press/akamai-releases-spring-2017-state-of-online-retail-performance-report.jsp) showed that a 100 millisecond delay in a site’s load time hurt conversion rates by 7%, and 53% of mobile users will leave pages that take more than 3 seconds to load. Gatsby sites are consistently 2-3x faster than similar sites built with different tools, and site owners have seen their [lead generation increase by up to 60% after transitioning to Gatsby](/blog/2018-11-16-youfit-case-study/). - -### Improved search traffic - -> Site speed is one of the factors Google uses in its search ranking algorithm, and slow site speeds can have a negative snowball effect on your SEO. Slower sites take longer to be crawled and indexed by search engines, they have higher bounce rates, and lower conversion rates, all of which will hurt your rankings. Gatsby sites have [built-in web and mobile performance optimizations](/blog/2018-11-07-gatsby-for-apps/#why-gatsby-for-apps). It actually takes more effort to make a Gatsby site perform badly. Learn more about [the impact of page speed on SEO on Moz](https://moz.com/learn/seo/page-speed). - -### Choose the best tools for your content and your users - -With Gatsby, you can pick whichever tools work best for your site and your content - choose the best CMS, the best e-commerce tool, the best video hosting, and build your own content stack without worrying about unreliable plugins or the politics of software partnerships. Gain full control over how your content gets delivered to your audience. - -## Conclusion - -Gatsby offers unparalleled flexibility so you can have the benefits of Gatsby without compromising the efficiency and power of your preferred content tools. Content creators can keep their existing workflows and have plenty of room to grow their site in exciting new ways, empowering them to do what they do best: create captivating content for their audience. - -## Other resources - -- If your content creator is also a marketer, the doc on [winning over marketers](/docs/using-gatsby-professionally/winning-over-marketers) could also be useful. -- If you want to read up on how to integrate Gatsby with different CMS platforms, the doc on [headless CMSs](/docs/how-to/sourcing-data/headless-cms) is a great starting point. Another relevant article is ["Building Sites with Headless CMSs"](/blog/2018-2-3-sites-with-headless-cms/) by Shannon Soper. -- Further reading could include the two-part blog by Michelle Gienow ["Delicious Simplicity ❤️ Gatsby: Building Happily Ever After"](/blog/2019-06-08-delicious-simplicity-case-study-part-1/) and ["Sharing the Gatsby Love with Content Creators"](/blog/2019-09-18-delicious-simplicity-case-study-part2/) by Linda Watkins. diff --git a/docs/docs/using-gatsby-professionally/winning-over-developers.md b/docs/docs/using-gatsby-professionally/winning-over-developers.md deleted file mode 100644 index 625ee0ddd1de0..0000000000000 --- a/docs/docs/using-gatsby-professionally/winning-over-developers.md +++ /dev/null @@ -1,76 +0,0 @@ ---- -title: Winning Over Developers ---- - -Developers are often the primary evangelists of Gatsby because they are the primary users of the framework. If you're a developer, you may find that talking to other developers about why _you_ like Gatsby is enough to get them interested. Here are some talking points to help support your conversations with developers. - -Some things that developers care about include: - -- **Site Performance** Building sites that are fast and that stay fast as new tools and technology get incorporated. -- **Working with the best tools and technologies** Getting to use new technologies and having the flexibility to pick the right tools for the job. -- **Not getting bogged down in configuration and setup** These things are often time consuming, frustrating, and prevent developers from getting to focus on the work they actually care about. -- **Developing as efficiently and effectively as possible** The more things can be streamlined, automated, and/or simplified, the better. - -## Basic explanation - -Here's an example of a basic explanation of Gatsby for developers: - -> Gatsby is a free, open-source, React-based framework for building fast websites and applications. Gatsby streamlines the setup and configuration of your build, it can pull data into your UI from any and all of your sources, and amazing performance and current web best practices are built into Gatsby sites. - -## Specific benefits - -Gatsby has many benefits that give developers the freedom to build great websites and use the skills and tools they love. Some specific talking points are listed below. - -### Site speed - -> Gatsby was built with performance in mind from its inception, and Gatsby sites are consistently 2-3x faster than similar sites built with other tools – pages load in milliseconds rather than seconds. Gatsby's automated performance optimizations include pre-fetching resources, code splitting, statically generating HTML, and Google's [PRPL Pattern](/docs/prpl-pattern/). If you want to take a deeper dive into Gatsby's performance features, check out [Web Performance 101 – also, why is Gatsby so fast?](/blog/2017-09-13-why-is-gatsby-so-fast/). - -### Modern web tools - -> Gatsby sites are built with React - currently the most popular framework for developing web apps, and data can be pulled into your React components via GraphQL. Gatsby is also built to pull data from any source so you can pick the best tool for each job and function your site needs to perform. Pull data from the best content management tools, the best e-commerce tools, whatever databases you're using, and more. - -### Plugins and features - -> Just about every feature you could want for building a state-of-the-art website or web app is available through Gatsby. If the feature isn't already built in, there's an extensive library of available plugins. There's a list of features, their availability, and comparisons with other site building options available on the [Features page](/features/). The complete list of currently available plugins can be found on the [Plugins page](/plugins/). - -### Data integration - -> Gatsby supports data integration from sources like CMSs, SaaS services, APIs, databases, and other data sources of all flavors. Gatsby can also pull unstructured data directly into pages using API calls specifically crafted for this purpose, this works great with smaller websites which can later be scaled up effortlessly if necessary. This makes Gatsby stand out from most other static site generators. - -### Community and documentation - -> You'd be hard-pressed to find a more active and welcoming open-source community than Gatsby. Documentation is thorough, detailed, and doesn't make any assumptions about your experience-level going in. The Gatsby team is committed to transparency and working in the open so the community can follow and participate in Gatsby's development and direction. Everyone is encouraged to contribute to Gatsby and every contribution is valued. - -### Brings focus to the frontend - -> A benefit that frequently comes up in discussions of Gatsby is how it helps bring more focus to frontend development and a clearer division between frontend and backend tasks. Complicated tooling and configuration can consume a lot of development time and can pull frontend developers away from doing what they do best. Because Gatsby requires minimal tooling and configuration, frontend developers can spend more time making great UI's and backend developers can focus on adding the features and integrations that make your product better. - -## Common concerns - -You may find that many of your developer friends and colleagues have some questions or concerns about Gatsby. Here are some common examples and responses you can provide to help alleviate those concerns. - -### Our site uses a lot of dynamic content and components. Isn't Gatsby a static site generator? - -> It is, but there's more to it. Gatsby statically generates HTML content using React DOM and server-side APIs – it's an important part of how Gatsby delivers exceptional speed and better security. However, this static HTML content can then be enhanced with client-side JavaScript via React hydration. You can learn more about this in Dustin Schau's blog post [Beyond Static: Building Dynamic apps with Gatsby](/blog/2018-10-15-beyond-static-intro/). - -### Do I have to learn GraphQL to use Gatsby? - -> GraphQL is used to pull the content from all your different sources into Gatsby in a consistent, unified way. You don't have to use GraphQL to do this, but learning GraphQL will equip you to create new integrations more easily (and it may not be as challenging as you think). Amberley Romo digs into some of the pros and cons in her post on [Using Gatsby without GraphQL](/blog/2018-10-25-using-gatsby-without-graphql/). - -### Our content team needs to be able to make site updates, but they're not super technical. Are they going to be able to work with a Gatsby site? - -> Gatsby can pull content from any different source, including all-in-one CMSs like WordPress and Drupal as well as the various headless CMSs out there, so your content team can work with whichever content editor suits their needs and preferences, including the CMS they're already using. - -## Case studies - -Sometimes the most effective way to get a developer's attention is to show them examples of real sites and dev teams using Gatsby. Here are some case studies you might want to share: - -- [Delicious Simplicity <3 Gatsby: Building Happily Ever After](/blog/2019-06-08-delicious-simplicity-case-study-part-1/) -- [Beyond Static: Haptic Media Uses Gatsby to Build a Dynamic Web App](/blog/2019-02-05-hapticmedia-case-study/) -- [IBM Uses Gatsby to Manage Enterprise-Level Content](/blog/2018-12-17-ibm-case-study/#big-company-big-website) - -For even more examples of Gatsby sites, [check out the Showcase](/showcase/) - -## Conclusion - -Many developers like being early adopters when exciting new tools come along, but they are just as likely to be skeptical when it seems like that new tool might be just another "flavor of the month." Luckily, Gatsby stands up to scrutiny. The information provided here is a great starting point for conversations with developers about Gatsby. From there, encourage developers to check it out for themselves. That may be all the convincing they need. diff --git a/docs/docs/using-gatsby-professionally/winning-over-engineering-leaders.md b/docs/docs/using-gatsby-professionally/winning-over-engineering-leaders.md deleted file mode 100644 index 0c15a7ea877e6..0000000000000 --- a/docs/docs/using-gatsby-professionally/winning-over-engineering-leaders.md +++ /dev/null @@ -1,74 +0,0 @@ ---- -title: Winning Over Engineering Leaders ---- - -Engineering leaders and managers typically make decisions about how to build the sites and products that fall under their ownership. These decisions are based on things like cost, complexity, team needs, business requirements, and the success metrics they are accountable for. - -These stakeholders need to be convinced that Gatsby can offer them the balance of efficiency, results, and low risk that will satisfy their team, their executives, and their users. - -Some specific things that engineering leaders and managers care about include: - -- **Performance and security** No one wants their product to be noticeably slow or the source of a major security vulnerability. Getting these two key features right can be complicated, even for experienced engineering teams. -- **Flexibility and scalability** Managers want to pick tools that can grow with their user base and with their long-term product roadmap. They do not want to choose a technology that will limit their growth or risk having to start over if (and when) that tool proves to be too rigid. -- **Not reinventing the wheel** While many managers appreciate and sympathize with their team's or colleagues' desire to try out cool new tech, they'd rather not spend valuable time and resources on a new thing when the job is already being done to their satisfaction. As the saying goes, "If it ain't broke, don't fix it." -- **Helping their team work smarter** New tech is interesting to managers when it removes obstacles for their team, helps them be more effective, and/or reduces [yak shaving](https://www.hanselman.com/blog/YakShavingDefinedIllGetThatDoneAsSoonAsIShaveThisYak.aspx). However, these benefits have to outweigh the cost of integrating a new tool and/or re-implementing an existing product. - -## Basic explanation - -Here's an example of a basic explanation of Gatsby for engineering leaders and managers: - -> Gatsby is a free, open-source framework for building websites and applications. It's extremely developer-friendly and streamlines the setup and configuration of your build. Gatsby can pull data into your UI from any and all of the sources you currently use; and exceptional performance, added security, and current web best practices are built into Gatsby so your team can focus on delivering an exceptional experience for your users and customers. - -## Specific benefits - -Gatsby has many benefits that will appeal to engineering leaders and help them meet their goals. Some specific talking points are listed below. (A lot of these benefits are also covered in Preston So's article [Enterprise Gatsby: How to Reduce Your Digital Total Cost of Ownership (TCO) with Gatsby](/blog/2019-05-15-enterprise-gatsby-how-to-reduce-your-digital-total-cost-of-ownership-with-gatsby/), which is definitely worth sending to your engineering leaders.) - -### Performance - -> From its inception, Gatsby was built to optimize performance. Gatsby sites are consistently 2-3x faster than similar sites built with other tools, with pages loading in milliseconds rather than seconds. Gatsby's automated performance optimizations include pre-fetching resources, code splitting, progressive image loading, statically generating HTML, and Google's [PRPL Pattern](/docs/prpl-pattern/). If you want to take a deeper dive into Gatsby's performance features, check out Kyle Mathews's article, [Web Performance 101 – also, why is Gatsby so fast?](/blog/2017-09-13-why-is-gatsby-so-fast/) or Dustin Schau's article, [Behind the Scenes: What makes Gatsby Great](/blog/2019-04-02-behind-the-scenes-what-makes-gatsby-great/). - -### Security - -> Gatsby is a modern site generator that outputs static HTML pages at build time. That means you don't need a database or content management system running on your public servers, both of which are common sources of security breaches. Static content is much easier to secure. This does not, by any means, eliminate _all_ security vulnerabilities for Gatsby sites, but they will be significantly reduced. Learn more about Gatsby security in Alex Moon's article on [Security for Modern Web Frameworks](/blog/2019-04-06-security-for-modern-web-frameworks/) and the Docs page on [Answering IT & Security Questions](/docs/using-gatsby-professionally/using-gatsby-professionally/answering-it-security/). - -### Scalability - -> The scalability of your traffic handling, product complexity and features, and your development process will all benefit from Gatsby. Gatsby sites can be entirely deployed to a CDN, effectively eliminating your risk of downtime due to traffic spikes. If your site or application needs to support new functionality, Gatsby can pull content from as many sources as you need. With other tools, integrations with external resources are an afterthought and a common source of frustration for developers, causing project delays and outages. Gatsby streamlines the integration process, eliminating many of these headaches and points of failure. Finally, Gatsby equips dev teams to make their own components that can be reused across projects with minimal reworking, giving them more time to work on new features. - -### Lower costs - -> CDN hosting for static sites is much, _much_ less expensive than traditional hosting costs. Read more about this here: [Enterprise Gatsby: How to Reduce Your Digital Total Cost of Ownership (TCO) with Gatsby](/blog/2019-05-15-enterprise-gatsby-how-to-reduce-your-digital-total-cost-of-ownership-with-gatsby/). You'll also save money on team resources as your developers will spend much less time working on performance optimization and configuring integrations. Many managers have also found it easier and less expensive to recruit for Gatsby projects because they don't require specialized CMS skills or the advanced expertise needed to handle complex tooling and development environments. - -### Improved development process - -> Gatsby [unifies your stack](/docs/using-gatsby-professionally/using-gatsby-professionally/sanitize-your-stack) and eliminates a lot of the complicated and time-consuming configuration steps that come with most development processes. This means happier developers and clearer division between frontend and backend tasks. Frontend developers can spend more time making great UIs and backend developers can focus on adding the features and integrations that make your product better. You can find more information on this subject in Sam Bhagwat's article [How Gatsby Changes Teams' Website Development Workflow](/blog/2018-04-25-how-gatsby-changes-teams-website-development-workflow/#architecture) - -## Common concerns - -You may find that your engineering leaders and managers have some concerns about Gatsby. Here are some common examples and responses you can provide to help alleviate those concerns. - -### Support for open source software is often unreliable and relatively few projects offer long-term viability. How is Gatsby different? - -> Gatsby has an extremely active and communicative community with over 2,000 contributors and tens of thousands of developers building Gatsby sites. The process for filing issues and [contributing to Gatsby](/contributing/) is well-documented. [Gatsby's extensive documentation](/docs/) also includes various guides, tutorials, plugin and starter libraries, troubleshooting, and additional resources. Last but not least, the Gatsby open source project is supported by [Gatsby, Inc](https://www.gatsbyjs.com/). whose team is committed, full-time, to developing and maintaining Gatsby. Gatsby, Inc. also offers support services, training, and partnership opportunities. - -### Our site uses a lot of dynamic content and components. Didn't you say Gatsby creates static sites? - -> Yes, but there's more to it. Gatsby statically generates HTML content using React DOM and server-side APIs – it's an important part of how Gatsby delivers exceptional speed and better security. However, this static HTML content can then be enhanced with client-side JavaScript via React hydration. You can learn more about this in Dustin Schau's blog post [Beyond Static: Building Dynamic apps with Gatsby](/blog/2018-10-15-beyond-static-intro/). - -### Our content team and other less-technical members of my organization need to be able to make site updates. Are they going to be able to work with a Gatsby site? - -> Gatsby can pull content from any source, including all-in-one CMSs, like WordPress and Drupal, and headless CMSs. Your content team can work with whichever content editor suits their needs and preferences, including the CMS they're already using. You can also enable more collaboration between your content and development teams with [Gatsby Preview](https://www.gatsbyjs.com/preview). - -## Case studies - -Case studies are an excellent way to build an engineering leader's confidence in Gatsby's capabilities. Here are some case studies you might want to share: - -- [Beyond Static: Haptic Media Uses Gatsby to Build a Dynamic Web App](/blog/2019-02-05-hapticmedia-case-study/) -- [IBM Uses Gatsby to Manage Enterprise-Level Content](/blog/2018-12-17-ibm-case-study/#big-company-big-website) -- [How we're migrating a government open data site to Gatsby](/blog/2019-02-08-government-open-data-site-with-gatsby/) - -For examples of Gatsby sites, [check out the Showcase](/showcase/). - -## Conclusion - -When you're trying to win over a stakeholder, your first instinct may be to focus completely on Gatsby's benefits. However, when you're speaking to engineering leaders and managers, it's important to be positive while still being honest about Gatsby's limitations. Setting expectations before they go out to do their own research will help them focus on finding solutions rather than faults. There is ample proof that Gatsby works well for many websites - don't be afraid to help your engineering leaders dig into pros and cons. (And it doesn't hurt to get a few of their team members on your side. Check out the [Winning Over Developers](/docs/using-gatsby-professionally/winning-over-developers/) page for more on that subject.) diff --git a/docs/docs/using-gatsby-professionally/winning-over-executives.md b/docs/docs/using-gatsby-professionally/winning-over-executives.md deleted file mode 100644 index 2bd3db4ec0878..0000000000000 --- a/docs/docs/using-gatsby-professionally/winning-over-executives.md +++ /dev/null @@ -1,58 +0,0 @@ ---- -title: Winning Over Executives ---- - -Before you speak to executives about Gatsby, make sure you understand their strategic goals, and align your argument for Gatsby with those specific goals. Focus on the results of Gatsby's features rather than the specifics of how they work. If some of the big ideas behind Gatsby fit in with the executive's strategic goals, don't be afraid to include them in your conversation. - -Some things executives care about include: - -- **Brand visibility** Making sure people are learning about your company by showing up in all the right places. This can be accomplished through things like SEO (search engine optimization), buying ad space, and gaining influence through content creation and/or event participation. -- **Customer experience** Do your customers like using your site and products? Can they find what they need? Do they have a positive impression of your company? -- **Innovation** Creating and adopting new technology and business models, preferably ones that will have long-term success. -- **Competitive edge** Distinguishing yourself from your competitors by delivering unique value that helps you claim a greater share of the market. -- **Growing the business** For most executives, success means gaining clients, leads, users, purchases and awareness - getting more orders moving through that sales funnel. - -## Basic explanation - -Here's an example of a basic explanation of Gatsby for executives: - -> Gatsby is a new way to build websites and applications with exceptional performance, reduced risk of downtime, fewer security vulnerabilities, and the flexibility to work with the best tools for your business. Companies that have moved their sites to Gatsby have seen significant improvements in their lead conversion, organic search traffic, and team productivity. - -## Specific benefits - -Sites built with Gatsby have experienced major sales and engagement benefits as a direct result of Gatsby's built-in features and optimizations. Here are some examples. - -### Better lead generation and customer engagement - -> Site speed and performance has a huge impact on sales and customer engagement. A [recent Akamai study](https://www.akamai.com/uk/en/about/news/press/2017-press/akamai-releases-spring-2017-state-of-online-retail-performance-report.jsp) showed that a 100 millisecond delay in a site's load time hurt conversion rates by 7%, and 53% of mobile users will leave pages that take more than 3 seconds to load. Gatsby sites are consistently 2-3x faster than similar sites built with different tools, and site owners have seen their [lead generation increase by up to 60% after transitioning to Gatsby](/blog/2018-11-16-youfit-case-study/). - -### Improved search traffic - -> Site speed is one of the factors Google uses in its search ranking algorithm, and slow site speeds can have a negative snowball effect on your SEO. Slower sites take longer to be crawled and indexed by search engines, they have higher bounce rates, and lower conversion rates, all of which will hurt your rankings. Gatsby sites have [built-in web and mobile performance optimizations](/blog/2018-11-07-gatsby-for-apps/#why-gatsby-for-apps). It actually takes _more_ effort to make a Gatsby site perform badly. Learn more about [the impact of page speed on SEO](https://moz.com/learn/seo/page-speed) on Moz. - -### Increase productivity - -> According to [Gatsby user survey results](/blog/2019-03-05-dot-org-messaging-survey/#productive-from-the-start), "Gatsby makes you productive right from the start — it takes away the overhead of time-consuming dev and build tooling setup and configuration which leads to faster iterations." Without the burden of complicated tooling, your development team is more focused, more productive, and more satisfied with their work. - -### Lower costs - -> Gatsby sites can be entirely deployed to a CDN which is much less expensive than traditional hosting costs. Plus, CDN hosting basically eliminates your risk of downtime during traffic spikes so you don't miss out on those lead-conversion opportunities. Finally, Gatsby is open source, so you're also saving on software licensing costs. - -### Keep your applications ahead of the curve - -> Gatsby is one of the technologies at the forefront of a new approach to web and application development known as the [JAMStack](https://jamstack.org/). The JAMStack represents a shift away from the limitations of CMS-centered sites and failure points of server-side code towards faster, light-weight, modular site construction. The JAMStack approach and Gatsby have been rapidly gaining popularity in the last few years with no sign of slowing down. (Check out [Gatsby and JAMStack on Google Trends](https://trends.google.com/trends/explore?date=today%205-y&geo=US&q=jamstack,gatsby%20js).) For companies that want to be leaders in technology trends and that want to differentiate themselves on important factors like site performance, this is a prime window of opportunity. Learn how you can [partner with Gatsby](/docs/partnering-with-gatsby/). - -## Case studies - -Case studies are a great way to help executives see Gatsby's potential and gain more practical insight into its benefits. Here are some case studies you might want to share: - -- [Youfit uses Gatsby to increase lead generation by 60%](/blog/2018-11-16-youfit-case-study/) -- [IBM Uses Gatsby to Manage Enterprise-Level Content](/blog/2018-12-17-ibm-case-study/#big-company-big-website) -- [Gatsby Fuels Content and Sales in Design+Code Rebuild](/blog/2019-03-15-design-code-blog-post/) -- [Growing Housecall Pro by 973% with Gatsby](/blog/2019-05-02-growing-housecall-pro-by-973-percent/) - -For even more examples of Gatsby sites, [check out the Showcase](/showcase/) - -## Conclusion - -Executives are always looking for ways to improve their business's efficiency, profits, and to grow their organization. Pointing out the financial benefits of Gatsby will help your case, but be sure to go into the many other ways Gatsby will help move your business forward. If you can show your executive(s) how the benefits of Gatsby significantly outweigh the risks and costs involved in adopting it, odds are good that they'll be very receptive to the idea. diff --git a/docs/docs/using-gatsby-professionally/winning-over-marketers.md b/docs/docs/using-gatsby-professionally/winning-over-marketers.md deleted file mode 100644 index 77bb9ad403dbe..0000000000000 --- a/docs/docs/using-gatsby-professionally/winning-over-marketers.md +++ /dev/null @@ -1,54 +0,0 @@ ---- -title: Winning Over Marketers ---- - -Some things that marketers care about include: - -- **Generating more "leads".** Leads are people who are interested in buying the product. -- **Increasing conversion rates.** This means helping more people move through a checkout funnel, or fill out an email capture form. -- **Making the website faster**. This tends to decrease the "bounce rate", which is the proportion of visitors leaving the website. -- **Generating revenue**. If the product is bought online through a checkout flow, such as e-commerce, marketers are often measured on revenue the site generates -- the dollar value of total sales. - -## Basic explanation - -A basic explanation of Gatsby to marketers is often along these lines: - -> Over 50% of people will abandon a site if it takes more than 3 seconds to load. This translates directly into lost revenue, decreased lead conversion, and a poor user experience. Get the most out of your website with a site that’s blazing fast and optimized for SEO, lead conversion, and revenue generation. Gatsby is the modern way to build reliable, lightning fast websites and apps. - -## Specific benefits - -Marketers may be curious about more information on specific topics such as SEO, site speed, lead conversion, and revenue. Some potential talking points on each topic are listed below. - -### Site speed - -> Think rocket ship vs. sea turtle. Gatsby takes fast to a whole new level with websites that are pre-built and live on the edge—right where your customers are. Pages load in milliseconds rather than seconds. Gatsby enables teams to create lightning-fast, content-driven websites without needing to become performance experts. - -### SEO optimized - -> Think of all the time a team spends on creating compelling, optimized content just to have the search ranking penalized by a slow website. A Search Engine Optimized website means a higher organic search ranking and more website traffic, which can mean more leads and revenue. Get as much out of your website as you do your content and see the impact. - -### Optimized for lead conversion - -> For every second it takes a page to load, the bounce rate increases and the lead conversion drops. For e-commerce sites, some estimates say you may lose up to 1% in revenue for every 100ms delay in page load time. The longer it takes a page to load, the more customers/leads/revenue you lose. Get greater lead conversion with a fast website that loads on even slow connections. - -### Generating revenue - -> Generating revenue with your website is especially important for e-commerce sites. If an e-commerce company doesn’t get a high enough ROI (return on investment), then they may be out of business in a few months. Even just a one second improvement in page load time can increase revenue by 7%. The less time it takes a page to load, the more money you make. - -## Case studies - -One question marketers often ask themselves when hearing new ideas, whether they vocalize them or not, is "who else is doing this?" - -In order to proactively diffuse these concerns, you might consider sharing stories of organizations that have adopted Gatsby: - -- [Flamingo, women’s body care brand from Harry’s, chooses Gatsby for critical e-commerce launch, 5X faster page loads](/blog/2019-01-30-flamingo-case-study/) -- [Youfit uses Gatsby to increase lead generation by 60%](/blog/2018-11-16-youfit-case-study/) -- [IBM Uses Gatsby to Manage Enterprise-Level Content](/blog/2018-12-17-ibm-case-study/#big-company-big-website) - -## Conclusion - -A perception marketers often have of developers is that they are not very business-savvy. Whether this perception is accurate or not, it often creates a barrier for marketers to accept developers' suggestions. - -The explanations above -- whether you use them word-for-word or restate them in your own and your organization's language -- are intended to demonstrate concern for the business as a whole, so marketers see you as a trusted partner. - -_Want to read more on this topic? Check out [How to Talk About Gatsby To Your Clients And Team](https://www.gatsbyjs.com/blog/2019-03-07-sell-gatsby-to-clients/) by [Linda Watkins](https://www.gatsbyjs.com/contributors/linda-watkins/)._ diff --git a/docs/docs/using-gatsby-professionally/winning-over-stakeholders.md b/docs/docs/using-gatsby-professionally/winning-over-stakeholders.md deleted file mode 100644 index 4f40e6c13dcbf..0000000000000 --- a/docs/docs/using-gatsby-professionally/winning-over-stakeholders.md +++ /dev/null @@ -1,15 +0,0 @@ ---- -title: Winning Over Stakeholders ---- - -Any website project has multiple stakeholders, such as developers, marketers, content creators, engineering leaders, executives, and clients. - -In smaller projects and organizations, one person may wear multiple hats. As a freelancer, you may be the developer, marketer, content creator, and engineering leader rolled into one. Working at a mid-sized agency or organization, you are likely to only wear one hat at a time. - -When working with other stakeholders, it's important to understand their motivations so you can explain the benefits of Gatsby in a way that resonates with them. - -For example, marketers typically care about increasing leads and conversion rates, executives focus on driving revenue, and clients prioritize the project shipping on time and under budget. - -This section includes guides to explaining the benefits of Gatsby to the various types of stakeholders that you may work with. - -