{"id":10160,"date":"2024-04-28T19:28:29","date_gmt":"2024-04-28T17:28:29","guid":{"rendered":"https:\/\/via-internet.de\/blog\/?p=10160"},"modified":"2024-04-28T19:28:33","modified_gmt":"2024-04-28T17:28:33","slug":"gatsby-getting-started-with-gatsby","status":"publish","type":"post","link":"https:\/\/via-internet.de\/blog\/2024\/04\/28\/gatsby-getting-started-with-gatsby\/","title":{"rendered":"Gatsby | Getting started with Gatsby"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Installation<\/h2>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">npm init gatsby<\/pre>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">pnpm create gatsby<\/pre>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\u276f npm create gatsby\n...\/21.6.2\/pnpm\/store\/v3\/tmp\/dlx-42253   |   +3 +\n...\/21.6.2\/pnpm\/store\/v3\/tmp\/dlx-42253   | Progress: resolved 3, reused 1, downloaded 2, added 3, done\ncreate-gatsby version 3.13.1\n\n                                                                            Welcome to Gatsby!\nWhat would you like to call your site?\n\u2714 Getting-Started-with-Gatsby\/ site\n\u2714 Will you be using JavaScript or TypeScript?\n\u00b7 TypeScript\n\u2714 Will you be using a CMS?\n\u00b7 No (or I'll add it later)\n\u2714 Would you like to install a styling system?\n\u00b7 Tailwind CSS\n\u2714 Would you like to install additional features with other plugins?\n\u00b7 Add responsive images\n\u00b7 Add an automatic sitemap\n\u00b7 Generate a manifest file\n\u00b7 Add Markdown and MDX support\n\n\nThanks! Here's what we'll now do:\n\n    \ud83d\udee0  Create a new Gatsby site in the folder site\n    \ud83c\udfa8 Get you set up to use Tailwind CSS for styling your site\n    \ud83d\udd0c Install gatsby-plugin-image, gatsby-plugin-sitemap, gatsby-plugin-manifest, gatsby-plugin-mdx\n\n\u2714 Shall we do this? (Y\/n) \u00b7 Yes\n\u2714 Created site from template\n\u2714 Installed Gatsby\n\u2714 Installed plugins\n\u2714 Created site in site\n\ud83d\udd0c Setting-up plugins...\ninfo Adding gatsby-plugin-postcss\ninfo Adding gatsby-plugin-image\ninfo Adding gatsby-plugin-sitemap\ninfo Adding gatsby-plugin-manifest\ninfo Adding gatsby-plugin-mdx\ninfo Adding gatsby-plugin-sharp\ninfo Adding gatsby-transformer-sharp\ninfo Adding gatsby-source-filesystem\ninfo Adding gatsby-source-filesystem\ninfo Installed gatsby-plugin-postcss in gatsby-config\nsuccess Adding gatsby-plugin-postcss to gatsby-config - 0.224s\ninfo Installed gatsby-plugin-image in gatsby-config\nsuccess Adding gatsby-plugin-image to gatsby-config - 0.221s\ninfo Installed gatsby-plugin-sitemap in gatsby-config\nsuccess Adding gatsby-plugin-sitemap to gatsby-config - 0.230s\ninfo Installed gatsby-plugin-manifest in gatsby-config\nsuccess Adding gatsby-plugin-manifest to gatsby-config - 0.258s\ninfo Installed gatsby-plugin-mdx in gatsby-config\nsuccess Adding gatsby-plugin-mdx to gatsby-config - 0.264s\ninfo Installed gatsby-plugin-sharp in gatsby-config\nsuccess Adding gatsby-plugin-sharp to gatsby-config - 0.265s\ninfo Installed gatsby-transformer-sharp in gatsby-config\nsuccess Adding gatsby-transformer-sharp to gatsby-config - 0.269s\ninfo Installed gatsby-source-filesystem in gatsby-config\nsuccess Adding gatsby-source-filesystem (images) to gatsby-config - 0.279s\ninfo Installed gatsby-source-filesystem in gatsby-config\nsuccess Adding gatsby-source-filesystem (pages) to gatsby-config - 0.286s\n\ud83c\udfa8 Adding necessary styling files...\n\ud83c\udf89  Your new Gatsby site Getting Started with Gatsby has been successfully created\nat \/Users\/Shared\/CLOUD\/Programmier-Workshops\/Kurse\/Gatsby\/Einsteiger\/Getting-Started-with-Gatsby\/site.\nStart by going to the directory with\n\n  cd site\n\nStart the local development server with\n\n  npm run develop\n\nSee all commands at\n\n  https:\/\/www.gatsbyjs.com\/docs\/reference\/gatsby-cli\/\n<\/pre>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\u276f cd site\n\u276f npm install\n\u276f npm run develop<\/pre>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"714\" src=\"https:\/\/via-internet.de\/blog\/wp-content\/uploads\/2024\/04\/Bildschirmfoto-2024-04-28-um-18.01.02-1024x714.png\" alt=\"\" class=\"wp-image-10161\" srcset=\"https:\/\/via-internet.de\/blog\/wp-content\/uploads\/2024\/04\/Bildschirmfoto-2024-04-28-um-18.01.02-1024x714.png 1024w, https:\/\/via-internet.de\/blog\/wp-content\/uploads\/2024\/04\/Bildschirmfoto-2024-04-28-um-18.01.02-300x209.png 300w, https:\/\/via-internet.de\/blog\/wp-content\/uploads\/2024\/04\/Bildschirmfoto-2024-04-28-um-18.01.02-768x536.png 768w, https:\/\/via-internet.de\/blog\/wp-content\/uploads\/2024\/04\/Bildschirmfoto-2024-04-28-um-18.01.02-1536x1072.png 1536w, https:\/\/via-internet.de\/blog\/wp-content\/uploads\/2024\/04\/Bildschirmfoto-2024-04-28-um-18.01.02-2048x1429.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Installation<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_crdt_document":"","_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-10160","post","type-post","status-publish","format-standard","hentry","category-allgemein"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/posts\/10160","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/comments?post=10160"}],"version-history":[{"count":1,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/posts\/10160\/revisions"}],"predecessor-version":[{"id":10162,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/posts\/10160\/revisions\/10162"}],"wp:attachment":[{"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/media?parent=10160"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/categories?post=10160"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/via-internet.de\/blog\/wp-json\/wp\/v2\/tags?post=10160"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}