{"id":23532666,"url":"https://github.com/outbrain-inc/gatsby-workshop","last_synced_at":"2026-02-20T00:02:24.566Z","repository":{"id":152971932,"uuid":"293230230","full_name":"outbrain-inc/gatsby-workshop","owner":"outbrain-inc","description":"A GatsbyJS workshop by Outbrain's frontend guild","archived":false,"fork":false,"pushed_at":"2023-03-31T12:19:34.000Z","size":748,"stargazers_count":1,"open_issues_count":0,"forks_count":2,"subscribers_count":7,"default_branch":"master","last_synced_at":"2025-10-20T08:37:12.442Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"SCSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"0bsd","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/outbrain-inc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-09-06T07:59:48.000Z","updated_at":"2024-11-11T18:33:01.000Z","dependencies_parsed_at":null,"dependency_job_id":"dd927716-0d0a-456f-86cd-1d18fbe735a0","html_url":"https://github.com/outbrain-inc/gatsby-workshop","commit_stats":null,"previous_names":["outbrain-inc/gatsby-workshop"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/outbrain-inc/gatsby-workshop","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/outbrain-inc%2Fgatsby-workshop","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/outbrain-inc%2Fgatsby-workshop/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/outbrain-inc%2Fgatsby-workshop/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/outbrain-inc%2Fgatsby-workshop/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/outbrain-inc","download_url":"https://codeload.github.com/outbrain-inc/gatsby-workshop/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/outbrain-inc%2Fgatsby-workshop/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29637400,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-19T22:32:43.237Z","status":"ssl_error","status_checked_at":"2026-02-19T22:32:38.330Z","response_time":117,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-12-25T23:12:14.190Z","updated_at":"2026-02-20T00:02:24.543Z","avatar_url":"https://github.com/outbrain-inc.png","language":"SCSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# GatsbyJS Workshop\n\n\u003cp\u003e\nA workshop for learning GatsbyJS by \u003ca href=\"http://danielsternlicht.com\"\u003eDaniel Sternlicht\u003c/a\u003e.\n\nIn this workshop we’re going to create a Gatsby website, and rely on data from a Medium based blog.\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://www.youtube.com/watch?v=S632nIS2WKo\"\u003e\n    \u003cimg alt=\"Intro to GatsbyJS\" src=\"https://img.youtube.com/vi/S632nIS2WKo/0.jpg\" /\u003e\n  \u003c/a\u003e\n  \u003cbr /\u003e\n  \u003ca href=\"https://www.youtube.com/watch?v=S632nIS2WKo\"\u003eA quick intro to GatsbyJS\u003c/a\u003e\n\u003c/p\u003e\n\n## Workshop Instructions\n\n1. Clone this repository: `git clone https://github.com/outbrain/gatsby-workshop.git`\n\n2. Install project dependencies: `npm i`\n\n3. Run dev server: `npm start`\n\n4. If everything worked as expected you should be able to see the app in your browser at:\nhttp://localhost:8000\n\n5. Another url you want to open is for the graphicql tool. We’re going to use it a lot.\nhttp://localhost:8000/___graphql\n\n6. Just so you won’t have to, this repo includes 3 plugins we installed in advance - `gatsby-plugin-sass`, `gatsby-plugin-typescript`, and `gatsby-source-medium`. You may understand yourself what’s the purpose of each one.\n\n7. Now that we’re done with setups, my first task for you is to open Gatsby’s plugins library, look for the `gatsby-source-medium` plugin and add it to your `gatsby.config.js` file.\nhttps://www.gatsbyjs.com/plugins/gatsby-source-medium/\n\n8. If you set up everything correctly, try to restart the server by running `npm start`, then go to graphicql. You should see the new entities: mediumPost, mediumUser, allMediumPost, allMediumUser, etc.\n\n9. Next thing you want to do is to build up a query in graphql that loads the most recent posts from our medium blog.\n\n10. Now that we know how to build the query, my next task for you is to show all recent posts with their titles and images in the homepage.\n\n11. Next, we want that after a user clicks an article the app redirects him to another page where he may access the content of the article. There are 2 things we need to do here. \n\nFirst, to create pages dynamically in build time, and secondly, to create a generic template for blog posts that will be used to display the post.\n\nHint: To create pages dynamically we’ll go to `gatsby-node.js` file, and use the createPage api.\n\nThere we want to fetch all blog posts, and for each one of them to create a static page based on its data.\n\n12. Lastly, in the homepage, we’ll link each item to the dynamic pages we created.\n\n\n\n## For Cheaters\n\nSee solutions in the `DONT_README.md` file 😶","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foutbrain-inc%2Fgatsby-workshop","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Foutbrain-inc%2Fgatsby-workshop","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foutbrain-inc%2Fgatsby-workshop/lists"}