From 76df984fef4273f7528ca48cea8e47800a6cdf5e Mon Sep 17 00:00:00 2001 From: KiranAkadas Date: Thu, 14 Nov 2019 20:42:51 +0530 Subject: [PATCH 1/8] first-commit --- docs/tutorial/part-three/index.md | 110 +++++++++++++++--------------- 1 file changed, 55 insertions(+), 55 deletions(-) diff --git a/docs/tutorial/part-three/index.md b/docs/tutorial/part-three/index.md index 1a296fb..df84f29 100644 --- a/docs/tutorial/part-three/index.md +++ b/docs/tutorial/part-three/index.md @@ -1,57 +1,57 @@ --- -title: Creating Nested Layout Components +शीर्षक: नेस्टेड लेआउट कम्पोनेंट्स बनाना typora-copy-images-to: ./ disableTableOfContents: true --- -Welcome to part three! +भाग तीन में आपका स्वागत है! -## What's in this tutorial? +## इस ट्यूटोरियल में क्या है? -In this part, you'll learn about Gatsby plugins and creating "layout" components. +इस भाग में, आप गैट्सबी प्लगइन्स और "लेआउट" घटक बनाने के बारे में जानेंगे। -Gatsby plugins are JavaScript packages that help add functionality to a Gatsby site. Gatsby is designed to be extensible, which means plugins are able to extend and modify just about everything Gatsby does. +Gatsby plugins जावास्क्रिप्ट पैकेज हैं जो एक Gatsby साइट में कार्यक्षमता जोड़ने में मदद करते हैं। Gatsby को एक्स्टेंसिबल के लिए डिज़ाइन किया गया है, जिसका अर्थ है कि प्लगइन्स Gatsby जो भी करता है उसके बारे में सिर्फ विस्तार और संशोधन करने में सक्षम है। -Layout components are for sections of your site that you want to share across multiple pages. For example, sites will commonly have a layout component with a shared header and footer. Other common things to add to layouts are a sidebar and/or navigation menu. On this page for example, the header at the top is part of gatsbyjs.org's layout component. +लेआउट घटक आपकी साइट के उन हिस्सों के लिए हैं जिन्हें आप कई पृष्ठों में साझा करना चाहते हैं। उदाहरण के लिए, साइटों में आमतौर पर एक साझा हेडर और पाद लेख के साथ एक लेआउट घटक होगा। लेआउट में जोड़ने के लिए अन्य सामान्य चीजें एक साइडबार और / या नेविगेशन मेनू हैं। उदाहरण के लिए इस पृष्ठ पर, शीर्ष पर शीर्ष लेख gatsbyjs.org के लेआउट घटक का हिस्सा है। -Let's dive into part three. +चलो भाग तीन शुरू करते हैं। -## Using plugins +## प्लगइन्स का उपयोग करना -You’re probably familiar with the idea of plugins. Many software systems support adding custom plugins to add new functionality or even modify the core workings of the software. Gatsby plugins work the same way. +आप शायद प्लगइन्स के विचार से परिचित हैं। कई सॉफ्टवेयर सिस्टम नई कार्यक्षमता जोड़ने या सॉफ़्टवेयर के मुख्य कामकाज को संशोधित करने के लिए कस्टम प्लगइन्स को जोड़ने का समर्थन करते हैं। Gatsby plugins उसी तरह काम करते हैं। -Community members (like you!) can contribute plugins (small amounts of JavaScript code) that others can then use when building Gatsby sites. +समुदाय के सदस्य (आप की तरह!) प्लगइन्स (जावास्क्रिप्ट कोड की छोटी मात्रा) का योगदान कर सकते हैं जो अन्य लोग तब उपयोग कर सकते हैं जब Gatsby साइटों का निर्माण करते हैं। -> There are already hundreds of plugins! Explore the Gatsby [Plugin Library](/plugins/). +> पहले से ही सैकड़ों प्लगइन्स हैं! गैट्सबी [प्लगइन लाइब्रेरी] (/pluginw/) का अन्वेषण करें। -Our goal with plugins is to make them straightforward to install and use. You will likely be using plugins in almost every Gatsby site you build. While working through the rest of the tutorial you’ll have many opportunities to practice installing and using plugins. +प्लगइन्स के साथ हमारा लक्ष्य उन्हें स्थापित करने और उपयोग करने के लिए सीधा करना है। आप संभवतः आपके द्वारा बनाए गए लगभग हर गैट्सबी साइट में प्लगइन्स का उपयोग कर रहे होंगे। बाकी ट्यूटोरियल के माध्यम से काम करते समय आपके पास प्लगइन्स को स्थापित करने और उपयोग करने के कई अवसर हैं। -For an initial introduction to using plugins, we'll install and implement the Gatsby plugin for Typography.js. +प्लगइन्स का उपयोग करने के लिए प्रारंभिक परिचय के लिए, हम टाइपोग्राफी के लिए Gatsby प्लगइन को स्थापित और कार्यान्वित करेंगे। -[Typography.js](https://kyleamathews.github.io/typography.js/) is a JavaScript library which generates global base styles for your site's typography. The library has a [corresponding Gatsby plugin](/packages/gatsby-plugin-typography/) to streamline using it in a Gatsby site. +[टाइपोग्राफी.जेएस] (https://kyleamathews.github.io/typography.js/) एक जावास्क्रिप्ट लाइब्रेरी है जो आपकी साइट की टाइपोग्राफी के लिए वैश्विक आधार शैली उत्पन्न करती है। लाइब्रेरी में एक Gatsby साइट का उपयोग करके इसे स्ट्रीमलाइन करने के लिए [संबंधित गैट्सबी प्लगइन] (/ संकुल / gatsby- प्लगइन-टाइपोग्राफी /) है। -### ✋ Create a new Gatsby site +### ✋ एक नई गैट्सबी साइट बनाएँ -As we mentioned in [part two](/tutorial/part-two/), at this point it's probably a good idea to close the terminal window(s) and project files from previous parts of the tutorial, to keep things clean on your desktop. Then open a new terminal window and run the following commands to create a new Gatsby site in a directory called `tutorial-part-three` and then move to this new directory: +जैसा कि हमने उल्लेख किया है [भाग दो] (/ ट्यूटोरियल / भाग-दो /) में, इस बिंदु पर टर्मिनल विंडो (एस) को बंद करना और ट्यूटोरियल के पिछले हिस्सों से परियोजना फाइलों को अपने काम पर रखने के लिए शायद एक अच्छा विचार है। डेस्कटॉप। फिर एक नई टर्मिनल विंडो खोलें और `ट्यूटोरियल-पार्ट-थ्री` नामक एक निर्देशिका में एक नई गैट्सबी साइट बनाने के लिए निम्न कमांड चलाएं और फिर इस नई निर्देशिका में जाएं: ```shell gatsby new tutorial-part-three https://github.com/gatsbyjs/gatsby-starter-hello-world cd tutorial-part-three ``` -### ✋ Install and configure `gatsby-plugin-typography` +### `gatsby-plugin-typography` इनस्टॉल करें और कॉन्फ़िगर करें -There are two main steps to using a plugin: Installing and configuring. +प्लगइन का उपयोग करने के दो मुख्य चरण हैं: इंस्टॉल करना और कॉन्फ़िगर करना। -1. Install the `gatsby-plugin-typography` NPM package. +1. `gatsby-plugin-typography` एनपीएम पैकेज इंस्टॉल करें. ```shell npm install --save gatsby-plugin-typography react-typography typography typography-theme-fairy-gates ``` -> Note: Typography.js requires a few additional packages, so those are included in the instructions. Additional requirements like this will be listed in the "install" instructions of each plugin. +> नोट: Typography.js को कुछ अतिरिक्त पैकेजों की आवश्यकता होती है, इसलिए उन्हें निर्देशों में शामिल किया जाता है। इस तरह की अतिरिक्त आवश्यकताएं प्रत्येक प्लगइन के "इंस्टॉल" निर्देशों में सूचीबद्ध होंगी। -2. Edit the file `gatsby-config.js` at the root of your project to the following: +2. निम्नलिखित के लिए अपनी परियोजना के मूल में फ़ाइल `gatsby-config.js` संपादित करें: ```javascript:title=gatsby-config.js module.exports = { @@ -66,11 +66,11 @@ module.exports = { } ``` -The `gatsby-config.js` is another special file that Gatsby will automatically recognize. This is where you add plugins and other site configuration. +`Gatsby-config.js` एक और विशेष फ़ाइल है जिसे Gatsby अपने आप पहचान लेगा। यह वह जगह है जहां आप प्लगइन्स और अन्य साइट कॉन्फ़िगरेशन जोड़ते हैं। -> Check out the [doc on gatsby-config.js](/docs/gatsby-config/) to read more, if you wish. +> यदि आप चाहें, तो [doc on gatsby-config.js](/docs/gatsby-config/) को पढ़े। -3. Typography.js needs a configuration file. Create a new directory called `utils` in the `src` directory. Then add a new file called `typography.js` to `utils` and copy the following into the file: +3. Typography.js को कॉन्फ़िगरेशन फ़ाइल की आवश्यकता होती है। `Src` निर्देशिका में` utils` नामक एक नई निर्देशिका बनाएँ। फिर `typography.js` नामक एक नई फ़ाइल को `utils` में जोड़ें और फ़ाइल में निम्नलिखित को कॉपी करें: ```javascript:title=src/utils/typography.js import Typography from "typography" @@ -82,20 +82,20 @@ export const { scale, rhythm, options } = typography export default typography ``` -4. Start the development server. +4. डेवलपमेंट सर्वर शुरू करें। ```shell gatsby develop ``` -Once you load the site, if you inspect the generated HTML using the Chrome developer tools, you’ll see that the typography plugin added a `