Skip to content

Commit

Permalink
Merge remote-tracking branch 'upstream/master' into muescha/fix/docs-…
Browse files Browse the repository at this point in the history
…tutorial-zero
  • Loading branch information
gatsbybot committed Mar 5, 2020
2 parents 9493879 + 08d63c5 commit c912aff
Show file tree
Hide file tree
Showing 125 changed files with 3,013 additions and 372 deletions.
1 change: 1 addition & 0 deletions .typo-ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -36,3 +36,4 @@ excluded_words:
- xxs
- agadoo
- hevc
- oss
2 changes: 1 addition & 1 deletion benchmarks/image-processing/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ by downloading and processing images.

Defaults to building a site with 100 image pages. Set the `NUM_IMAGES` environment variable to change that e.g. `NUM_IMAGES=1000 gatsby build`

The max number of images you can process is 1300.
The max number of images you can process is 65535.

# Running the benchmark

Expand Down
2 changes: 0 additions & 2 deletions docs/blog/2019-04-19-gatsby-why-we-write/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,6 @@ If you're a Gatsby community member, you may have noticed something: we write _a

Community members are often surprised by the comprehensiveness of our [documentation](/docs/). We publish new articles on this blog multiple times per week, from both the core team and the community.

https://twitter.com/mattconvente/status/1099706762897342465

Writing isn't something we just do because we love it (although we do). Writing is core to who we are as a project, a company, and a community.

Writing is core to the success we've enjoyed so far, and it's core to our strategy to become the default way to build on the web.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -68,4 +68,4 @@ There is currently a [PR](https://github.com/benjaminhoffman/gatsby-plugin-segme

## In closing

If you work on a laptop or desktop with a good internet connection, the Time to Interactive is not so noticable as "time before you see something on your screen", but it can have a big impact on your performance rating and interactivity, and because of that, your SEO. You should be extra careful when adding third party scripts to your page, and the best way to do that is to run Google Lighthouse. If you notice your Gatsby site has a bad performance score, make sure to check the Time to Interactive value. If it's very high, try loading scripts only after a user has interacted with your website.
If you work on a laptop or desktop with a good internet connection, the Time to Interactive is not so noticeable as "time before you see something on your screen", but it can have a big impact on your performance rating and interactivity, and because of that, your SEO. You should be extra careful when adding third party scripts to your page, and the best way to do that is to run Google Lighthouse. If you notice your Gatsby site has a bad performance score, make sure to check the Time to Interactive value. If it's very high, try loading scripts only after a user has interacted with your website.
2 changes: 1 addition & 1 deletion docs/blog/2019-12-11-reducing-interaction-cloud/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ In this first screenshot, the user selects a starter.
Next, the user logs into GitHub and give Gatsby Cloud permission to connect with their personal GitHub account.
![Screenshot of the Gatsby Cloud login page with a thought bubble the author drew on top of the screenshot. The thought bubble contains the text “Alright, I can sign in with Git Hub. I have an account!”](cloud-login-400.png)

### Unecessary interaction: user adds new GitHub organization
### Unnecessary interaction: user adds new GitHub organization

Then, this screen asks them to “add new organization.” This is where the software failed to learn from recent history. The user just gave the system access to their personal GitHub account, so that the last value they gave the system and we ought to stick with that value.

Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
---
title: "Faster Sites with Optimized Media Assets"
date: 2020-03-02
author: William Imoh
excerpt: "Introducing two new Gatsby-Cloudinary plugins for optimized media management in Gatsby apps"
tags: ["media", "cloudinary", "performance", "image", "video"]
---

Plugins are at the heart of developing software with Gatsby because they not only extend Gatsby’s robust features but also make available, data from multiple sources. I’m excited to introduce you to two Gatsby plugins: [gatsby-source-cloudinary](/packages/gatsby-source-cloudinary/) and [gatsby-transformer-cloudinary](/packages/gatsby-transformer-cloudinary/).

Cloudinary is a cloud-based end-to-end media management platform for many of the world's top brands. With extensive product offerings from an Image management solution, Dynamic Video Platform, and a dynamic digital asset management solution.

## The Motivation Behind the Scenes

The two open-source Gatsby-Cloudinary plugins combine the best of both worlds:

- Gatsby builds high-performance sites with data from multiple sources and fetches declarative data with GraphQL, offering a superior developer experience and a rich ecosystem for developing in ReactJS.
- Cloudinary is an advanced media-management service that offers three key features:
- Optimized media storage and delivery
- Media transformation on data query and on the fly with dynamic URLs
- Digital-asset management for high performance

For example, an image uploaded to Cloudinary can be retrieved with a dynamic URL that transforms the original image into a cropped circular image, with a fixed width and height. The final URL becomes:

https://res.cloudinary.com/demo/image/upload/w_400,h_400,c_crop,r_max/w_200/lady.jpg

Several transformation parameters can be included in the URL to modify the image on the fly. You can find more about [Cloudinary here](http://bit.ly/2GbkeT3).

Using the Gatsby-Cloudinary plugins, optimized media assets from Cloudinary are bundled with the static files built by Gatsby. Those optimized assets can either be—

- Sourced directly from Cloudinary with the source plugin.
- Uploaded from local storage to Cloudinary with the transformer plugin. The returned images are transformed into file nodes that are compatible for use with the robust `gatsby-image` component.

## gatsby-source-cloudinary Plugin

[gatsby-source-cloudinary](/packages/gatsby-source-cloudinary/) is a plugin that fetches media assets from Cloudinary. You must first specify the folder from which to query those assets. The plugin then transforms them into Cloudinary file nodes, which can be queried with GraphQL in a Gatsby project.

Before file nodes are created, Cloudinary optimizes media files queried from its platform by applying the `f_auto` and `q_auto` transformation parameters. Impressively, those parameters optimize delivery format and quality for media assets by over 70 percent.

## gatsby-transformer-cloudinary Plugin

[`gatsby-image`](/docs/using-gatsby-image/) is a React component that delivers optimized images in Gatsby apps through GraphQL queries. The gatsby-transformer-cloudinary plugin uploads local files to Cloudinary, which then creates `CloudinaryAsset` nodes that are compatible for use in `gatsby-image`. This plugin can also apply Cloudinary media transformations in the GraphQL queries for the queried media assets.

## Preliminary Steps

The plugins can be used for various JAMstack applications built with Gatsby. The core goal is to store, optimize and deliver media assets with possible transformations. To get started on using the two Gatsby-Cloudinary plugins, follow these steps:

1. [Create a free account on Cloudinary](http://bit.ly/2v3sy4N).
2. [Create a Gatsby project](/tutorial/) with any of the Gatsby starters.
3. Configure either of the plugins in the `gatsby-config.js` file.
4. Refer to the [source plugin](http://bit.ly/2NHVshC) or [transformer plugin](http://bit.ly/2sMqe1u) documentation for the procedure on how to query Cloudinary images or upload and transform them with `gatsby-image`, respectively.

## Next in the Horizon

Given the ever-growing demand for speedy and usable apps and the continual feature advancements of Cloudinary and Gatsby, maintenance and capability enhancements of the plugins are ongoing.

Fork, clone, download, and try out the two plugins yourself. If you run into problems, create an issue in the relevant repository or send us pull requests (PRs) and be sure to check out my [blog on Cloudinary](https://cloudinary.com/blog/introducing_cloudinary_s_gatsby_plugins).
44 changes: 44 additions & 0 deletions docs/blog/2020-02-17-changing-the-oss-status-quo/index.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
---
title: "Changing the Open Source Status Quo"
date: 2020-03-05
author: Aisha Blake
excerpt: "How can we increase the diversity of open source contributors? As maintainers, we need to listen to a diverse group of community members and make thoughtful changes to create a truly inclusive project."
tags:
- open-source
- community
---

In business and in our individual careers, so many of us rely heavily on open source software. We need it but open source isn't as open as it's often made out to be. Too many projects are unfriendly, even openly hostile, to new contributors. This effect, combined with the intersection of many underrepresented identities in tech, effectively shuts people out of the process. Black, indigenous, and people of color (BIPOC) and women are at some of the most visible of these intersections. There are many more. Consider _who_ contributes to open source.

The status quo is made and remade every time we as maintainers add to our documentation. Every time we, as maintainers, engage with the community via social media, issue queues, and our documentation, we help decide who contributes. We contribute to their safety and their productivity. Right now, barriers to contribution are severely limiting our industry's capacity to create and sustain open source projects.

There's an opportunity here. There are thousands of highly skilled potential contributors ready, willing, and able to contribute to open source projects but they need to know that they'll be safe in doing so. A handful of projects are intentionally focusing on this work and making incredible strides towards a more inclusive open source community.

Gatsby's most admirable quality is the company's commitment to that community. Yes, it's a great tool but what use is any tool that is too difficult to use or too obscure for most people to access?

- One of Gatsby's core values is "You Belong Here". We back it up with a clear code of conduct that we consistently reference and enforce.
- The documentation is vast, includes specifics around contributing, and provides materials that make it easy for people outside of the core team to teach as well as learn.
- New contributors who have had a PR merged in are invited to the GitHub organization and offered swag as a thank you.
- There are even a limited number of one-on-one mentorship opportunities available.

Consider your own community and adopt the strategies that are feasible for your project. Who comes back to contribute more than once? Who is heard when making decisions as a group? Who feels empowered to speak publicly about your project? When interpersonal issues arise, who is believed? Take the time to examine your project's processes and documentation. What's missing? What's out-of-date?

Tear down as many barriers to entry as you can identify. The more people are encouraged and prepared to participate, the more likely it becomes that you'll be able to share the burden of maintenance across a wider team.

At the same time, listen to people in marginalized groups. Show up, sit down, and stay quiet. Support individual contributors and affinity groups. Participate in those groups where your presence doesn't introduce a safety concern. (Ask if you have any doubts, and maybe even if you don't.) You could do this by sponsoring an event like the [Blacks in Technology Conference](https://bitcon.tech/) or attending a local Lesbians Who Tech event. Once you're there, avoid centering your own experience. Absorb as much as you can from the experiences of others and educate yourself on how to be the best ally possible. Keep in mind that you don't get to _decide_ that you are an ally. We all have to earn trust over time.

Here are some truly wonderful folks who are already sharing valuable resources and insights:

<!-- Updating as I get responses from people! -->

- [Kim Crayton](https://twitter.com/KimCrayton1) founded the #causeascene movement, which is all about disrupting the status quo throughout the industry. She speaks freely and clearly about injustice in tech and how to fight against it. If you're ready to put in the work to make your organization more inclusive, reach out about her [tech leadership coaching](https://hashtagcauseascene.com/coaching/).
- [EJ Mason](https://twitter.com/codeability) is an accessibility professional. They're a skilled web developer, writer, and speaker who also posts honestly about living and working in tech as a disabled person. You can learn about how Accessibility is a Hydra during their upcoming session at [REFACTR.TECH](https://www.refactr.tech/).
- [Coraline Ada Ehmke](https://twitter.com/CoralineAda) has worked for decades and created not only tools but entire _communities_ to help make open source (and tech in general) safer and more inclusive. Perhaps you've already adopted her [Contributor Covenant](https://www.contributor-covenant.org/). You can see her perform original music discussing online harassment at this year's [&lt;title of conf&gt;](https://www.titleofconf.org/).
- [Amy Wibowo](https://twitter.com/sailorhg) is the brilliant mind and keen eye behind [BubbleSort Zines](https://shop.bubblesort.io/). Her soft, playful aesthetic is both an expression of her own creativity and an invitation to "people who don't think computer science is for them."
- [Léonie Watson](https://twitter.com/LeonieWatson) is one of the strongest advocates of web accessibility out there. As a member of the W3C Advisory Board and co-Chair of the W3C Web Applications Working Group, she's played a huge role in guiding the way we all build for the web. Consider supporting the conference she organizes, [Inclusive Design 24](https://inclusivedesign24.org/), this year.
- [Hui Jing Chen](https://twitter.com/hj_chen) is an accomplished designer, developer, and speaker. Her passion for the web, and CSS in particular, shines through in everything she creates. Several of her talks focus on [non-English web typography](https://www.youtube.com/watch?v=yLQHDGRLOwQ&feature=youtu.be) and she regularly shares her unique perspective on everything from internationalization to web specifications via [her blog](https://www.chenhuijing.com).
<!-- - [Tatiana Mac](https://twitter.com/TatianaTMac) -->
<!-- - [Brianna Wu](https://twitter.com/BriannaWu) -->
<!-- - [Fen Slattery](https://twitter.com/sublimemarch) -->

Follow them, listen to what they have to say, and use your privilege as a maintainer to amplify their messages. Keep an open mind and you'll discover challenges you never knew existed, refine your vocabulary around diversity and inclusion, and establish a resilient community of open source contributors.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit c912aff

Please sign in to comment.