diff --git a/1-getting-started-lessons/1-intro-to-programming-languages/translations/README.es.md b/1-getting-started-lessons/1-intro-to-programming-languages/translations/README.es.md index e882d21c..e613f7b4 100644 --- a/1-getting-started-lessons/1-intro-to-programming-languages/translations/README.es.md +++ b/1-getting-started-lessons/1-intro-to-programming-languages/translations/README.es.md @@ -3,9 +3,9 @@ Esta lección cubre los conceptos básicos de los lenguajes de programación. Los temas que aprenderemos aquí se aplican a la mayoría de los lenguajes de programación modernos en la actualidad. En la sección 'Herramientas del oficio', aprenderás sobre software y herramientas que te ayudarán como desarrollador. ![Intro Programming](/sketchnotes/webdev101-programming.png) -> Sketchnote by [Tomomi Imura](https://twitter.com/girlie_mac) +> Dibujo por [Tomomi Imura](https://twitter.com/girlie_mac) -## [Pre-lecture quiz](https://nice-beach-0fe9e9d0f.azurestaticapps.net/quiz/1) +## [Cuestionario](https://nice-beach-0fe9e9d0f.azurestaticapps.net/quiz/1) ### Introducción En esta lección, cubriremos: @@ -17,21 +17,22 @@ En esta lección, cubriremos: ## ¿Qué es la programación? -La programación (también conocida como codificación) es el proceso de escribir instrucciones en un dispositivo, como una computadora o un celular. Escribimos estas instrucciones con un lenguaje de programación, que luego es interpretado por el dispositivo. Estos conjuntos de instrucciones pueden tener varios nombres, pero *programa*, *programa de computadora*, *aplicación (app)* y *ejecutable* son algunos nombres populares. +La programación (también conocida como codificación) es el proceso de escribir instrucciones en un dispositivo, como una computadora o un celular. Escribimos estas instrucciones con un lenguaje de programación, que luego es interpretado por el dispositivo. Este conjuntos de instrucciones pueden tener varios nombres, como *programa*, *programa de computadora*, *aplicación (app)* o *ejecutable* son algunos de los mas populares. -Un *programa* puede ser cualquier cosa que esté escrita con código; los sitios web, los video juegos y las aplicaciones de teléfono son programas. Si bien es posible crear un programa sin escribir código, la lógica subyacente se interpreta al dispositivo y esa lógica probablemente se escribió con código. Un programa que está *ejecutándose* o *ejecutando código* está ejecutando instrucciones. El dispositivo con el que estás leyendo esta lección está ejecutando un programa para imprimirlo en tu pantalla. -✅ Investigua un poco: ¿quién se considera el primer programador(a) de computadoras del mundo? +Un *programa* puede ser cualquier cosa que esté escrita con código; los sitios web, los videojuegos y las aplicaciones de teléfono son programas. Si bien es posible crear un programa sin escribir código, la lógica subyacente se interpreta al dispositivo y esa lógica probablemente se escribió con código. Un programa que está *ejecutándose* o *ejecutando código* está ejecutando una serie de instrucciones. El dispositivo con el que estás leyendo esta lección está ejecutando un programa para imprimirlo en tu pantalla. + +✅ Investigue un poco: ¿quién se considera el primer programador(a) de computadoras del mundo? ## Lenguajes de programación -Los lenguajes de programación tienen un propósito principal: que los desarrolladores crear instrucciones para enviarlas a un dispositivo. Los dispositivos solo pueden entender binarios (1 y 0), y para *la mayoría* de los desarrolladores, esa no es una forma muy eficiente de comunicarse. Los lenguajes de programación son un vehículo para la comunicación entre humanos y computadoras. +Los lenguajes de programación tienen un propósito principal: que los desarrolladores creen instrucciones para enviarlas a un dispositivo. Los dispositivos solo pueden entender codigo binario (1 y 0), y para *la mayoría* de los desarrolladores, esa no es una forma muy amigable de comunicarse. Los lenguajes de programación son un vehículo para la comunicación entre los humanos y las computadoras. Los lenguajes de programación vienen en diferentes formatos y tienen diferentes propósitos. Por ejemplo, JavaScript se usa principalmente para aplicaciones web, mientras que Bash se usa principalmente para sistemas operativos. -*Los idiomas de bajo nivel* normalmente requieren menos pasos que los *idiomas de alto nivel* para que un dispositivo interprete las instrucciones. Sin embargo, lo que hace que los lenguajes de alto nivel sean populares es su legibilidad y soporte. JavaScript se considera un lenguaje de alto nivel. +*Los idiomas de bajo nivel* normalmente requieren menos pasos que los *idiomas de alto nivel* para que un dispositivo interprete las instrucciones. Sin embargo, lo que hace que los lenguajes de alto nivel sean populares es su legibilidad y soporte. JavaScript es considerado un lenguaje de alto nivel. -El siguiente código ilustra la diferencia entre un lenguaje de alto nivel con JavaScript y un lenguaje de bajo nivel con código ensamblador ARM. +El siguiente código ilustra la diferencia entre un lenguaje de alto nivel con JavaScript y un lenguaje de bajo nivel con código Assembly ARM. ```javascript let number = 10 @@ -76,7 +77,7 @@ Lo creas o no, *ambos hacen lo mismo*: imprimir una secuencia de Fibonacci hasta ## Elementos de un programa -Una sola instrucción en un programa se llama *instrucción* y generalmente tendrá un carácter o un espacio entre líneas que marca dónde termina la instrucción, o *termina*. La forma en que termina un programa varía con cada idioma. +Una sola instrucción en un programa se llama *instrucción* y generalmente tendrá un carácter o un espacio entre líneas que marca dónde termina esta. La forma en que termina un programa varía con cada idioma. La mayoría de los programas se basan en el uso de datos de un usuario o de otros lugares, donde las declaraciones pueden basarse en datos para llevar a cabo instrucciones. Los datos pueden cambiar la forma en que se comporta un programa, por lo que los lenguajes de programación vienen con una forma de almacenar temporalmente datos que se pueden usar más adelante. Estos datos se denominan *variables*. Las variables son declaraciones que indican a un dispositivo que guarde datos en su memoria. Las variables en los programas son similares a las del álgebra, donde tienen un nombre único y su valor puede cambiar con el tiempo. @@ -90,15 +91,15 @@ Existe la posibilidad de que un dispositivo no ejecute algunas declaraciones. Es En esta sección, aprenderás sobre software que puede ayudarte comenzar tu viaje de desarrollo profesional. -Un **entorno de desarrollo** es un conjunto único de herramientas y características que un desarrollador utilizará a menudo al escribir software. Algunas de estas herramientas se han personalizado para las necesidades específicas de un desarrollador y pueden cambiar con el tiempo si un desarrollador cambia las prioridades en el trabajo o proyectos personales, o cuando usa un lenguaje de programación diferente. Los entornos de desarrollo son tan únicos como los desarrolladores que los utilizan. +Un **entorno de desarrollo** es un conjunto único de herramientas y características que un desarrollador utilizará a menudo para escribir software. Algunas de estas herramientas se han personalizado para las necesidades específicas de un desarrollador y pueden cambiar con el tiempo si un desarrollador cambia las prioridades en el trabajo o proyectos personales, o cuando usa un lenguaje de programación diferente. Los entornos de desarrollo son tan únicos como los desarrolladores que los utilizan. ### Editores -Una de las herramientas más importantes para el desarrollo de software es el editor. Los editores son el lugar donde escribes su código y, a veces, donde ejecutarás tu código. +Una de las herramientas más importantes para el desarrollo de software es el editor. Los editores son el lugar donde escribes tu código y, a veces, donde lo ejecutaras. Los desarrolladores confían en los editores por algunas razones adicionales: -- *Depuración* - Descubrimiento de errores y errores al recorrer el código, línea por línea. Algunos editores tienen capacidades de depuración o se pueden personalizar y agregar para lenguajes de programación específicos. +- *Depuración* - Descubrimiento de errores al recorrer el código, línea por línea. Algunos editores tienen capacidades de depuración o se pueden personalizar y agregar para lenguajes de programación específicos. - *Resaltado de sintaxis* - Agrega colores y formato de texto al código, lo hace más fácil de leer. La mayoría de los editores permiten el resaltado de sintaxis personalizado. - *Extensiones e integraciones del navegador* - Adiciones especializadas para desarrolladores, por desarrolladores, para acceder a herramientas adicionales que no están integradas en el editor base. Por ejemplo, muchos desarrolladores también necesitan una forma de documentar su código y explicar cómo funciona, e instalarán una extensión de revisión ortográfica para verificar si hay errores. La mayoría de estas adiciones están diseñadas para usarse dentro de un editor específico, y la mayoría de los editores vienen con una forma de buscar extensiones disponibles. - *Personalización* - La mayoría de los editores son extremadamente personalizables, y cada desarrollador tendrá su propio entorno de desarrollo único que se adapta a sus necesidades. Muchos también permiten a los desarrolladores crear su propia extensión. @@ -106,20 +107,22 @@ Los desarrolladores confían en los editores por algunas razones adicionales: #### Editores populares y extensiones de desarrollo web -- [Código de Visual Studio](https://code.visualstudio.com/) - - [Corrector ortográfico de código](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) +- [Visual Studio Code](https://code.visualstudio.com/) + - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare-pack) - [Prettier - Formateador de código](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) -- [Átom](https://atom.io/) - - [revisión ortográfica](https://atom.io/packages/spell-check) - - [teletipo](https://atom.io/packages/teletype) +- [Editor de codigo Átom](https://atom.io/) + - [Code Spell Checker para Atom](https://atom.io/packages/spell-check) + - [Teletype](https://atom.io/packages/teletype) - [atom-beautify](https://atom.io/packages/atom-beautify) +* Teletype: Es una extension que nos permite colaborar en un mismo espacio de trabajo entre muchas personas. + ### Navegadores -Otra herramienta fundamental es el navegador. Los desarrolladores de web confían en el navegador para observar cómo se ejecuta su código en la web. También se usa para ver elementos visuales de una página web que están escritos en el editor, como HTML. +Otra herramienta esencial es el navegador. Los desarrolladores Web confían en el navegador para observar cómo se ejecuta su código. También se usa para ver elementos visuales de una página web que están escritos en el editor, como HTML. -Muchos navegadores vienen con *herramientas para desarrolladores* (DevTools) que contienen un conjunto de características e información útiles para ayudar a los desarrolladores a recopilar y capturar información importante sobre su aplicación. Por ejemplo: si una página web tiene errores, a veces es útil saber cuándo ocurrieron. Se puede configurar DevTools en un navegador para capturar esta información. +Muchos navegadores vienen con *herramientas para desarrolladores* (DevTools) que contienen un conjunto de características e información útil para ayudar a los desarrolladores a recopilar y capturar información importante sobre su aplicación. Por ejemplo: si una página web tiene errores, a veces es útil saber cuándo ocurrieron. Se puede configurar DevTools en un navegador para capturar esta información. #### Navegadores y herramientas de desarrollo populares @@ -129,7 +132,7 @@ Muchos navegadores vienen con *herramientas para desarrolladores* (DevTools) que ### Herramientas de línea de comandos (CLI) -Algunos desarrolladores prefieren una vista menos gráfica para sus tareas diarias y confían en la línea de comandos **(CLI)** para lograrlo. El desarrollo de código requiere una gran cantidad de escritura, y algunos desarrolladores prefieren no interrumpir su flujo en el teclado y usarán atajos (shortcut) de teclado para cambiar entre ventanas de escritorio, trabajar en diferentes archivos y usar herramientas. La mayoría de las tareas se pueden completar con un mouse, pero una de las ventajas de utilizar la línea de comandos es que se pueden hacer muchas cosas con las herramientas de la línea de comandos, sin necesidad de cambiar entre el mouse y el teclado. Otro beneficio de la línea de comandos es que son configurables y puedes guardar tu configuración personalizada, cambiarla más tarde y también importarla a nuevas máquinas de desarrollo. Debido a que los entornos de desarrollo son tan exclusivos para cada desarrollador, algunos evitarán usar la línea de comandos, algunos dependerán de ella por completo y algunos prefieren una combinación de ambos. +Algunos desarrolladores prefieren una vista menos gráfica para sus tareas diarias y confían en la línea de comandos **(CLI)** para lograrlo. El desarrollo de código requiere una gran cantidad de escritura, y algunos desarrolladores prefieren no interrumpir su flujo de trabajo con el teclado es por eso que usan atajos(shortcuts) para cambiar entre ventanas de escritorio, trabajar en diferentes archivos y usar herramientas. La mayoría de las tareas se pueden completar con un mouse, pero una de las ventajas de utilizar la línea de comandos es que se pueden hacer muchas cosas sin la necesidad de cambiar entre el mouse y el teclado. Otro beneficio de esta es que son configurables, puedes guardar tu configuración personalizada, asi como tambien cambiarla más tarde o importarla a nueva máquina. Debido a que los entornos son tan exclusivos para cada desarrollador, algunos evitarán usar la línea de comandos, algunos dependerán de ella por completo asi como tambien otros pueden preferir una combinación de ambos. ### Opciones de línea de comandos (CLI) populares @@ -142,7 +145,7 @@ Las opciones para la línea de comando varian según el sistema operativo que ut - [Powershell](https://docs.microsoft.com/powershell/scripting/overview?view=powershell-7?WT.mc_id=academic-13441-cxa) 💻 - [Command Line](https://docs.microsoft.com/windows-server/administration/windows-commands/windows-commands?WT.mc_id=academic-13441-cxa) (also known as CMD) 💻 - [Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-13441-cxa) -- [mintty](https://mintty.github.io/) +- [Mintty](https://mintty.github.io/) #### MacOS @@ -164,7 +167,7 @@ Las opciones para la línea de comando varian según el sistema operativo que ut ### Documentación -Cuando un desarrollador quiere aprender algo nuevo, lo más probable es que recurras a la documentación para aprender a usarla. Los desarrolladores a menudo confían en la documentación para guiarlos a través de cómo usar las herramientas y los lenguajes correctamente, y también para obtener un conocimiento más profundo de cómo funciona. +Cuando un desarrollador quiere aprender algo nuevo, lo más probable es que recurras a la documentación para aprender a usarla. Los desarrolladores a menudo confían en esta para guiarlos a través de cómo usar ciertas herramientas asi como tambien para entender como funcionan los lenguajes. #### Documentación popular sobre desarrollo de web @@ -181,6 +184,6 @@ Compara algunos lenguajes de programación. ¿Cuáles son algunos de los rasgos ## Revisión y autoestudio -Estudia un poco sobre los diferentes lenguajes disponibles para el programador. Intenta escribir una línea en un idioma y luego vuelve a hacerlo en otros dos. ¿Qué aprendiste? +Estudia un poco sobre los diferentes lenguajes disponibles para programar. Intenta escribir una línea en un lenguaje y luego vuelve a hacerlo en otros dos. ¿Qué aprendiste? **Tarea**: [Tarea](../assignment.md) \ No newline at end of file diff --git a/1-getting-started-lessons/1-intro-to-programming-languages/translations/README.hi.md b/1-getting-started-lessons/1-intro-to-programming-languages/translations/README.hi.md new file mode 100644 index 00000000..c637c1c8 --- /dev/null +++ b/1-getting-started-lessons/1-intro-to-programming-languages/translations/README.hi.md @@ -0,0 +1,192 @@ +# प्रोग्रामिंग भाषाओं और व्यापार के उपकरण का परिचय + +यह पाठ प्रोग्रामिंग भाषाओं की मूल बातें शामिल करता है। यहां शामिल विषय आज की अधिकांश आधुनिक प्रोग्रामिंग भाषाओं पर लागू होते हैं। 'टूल ऑफ़ ट्रेड' सेक्शन में, आप उपयोगी सॉफ़्टवेयर के बारे में जानेंगे जो आपको डेवलपर के रूप में मदद करता है। + +![इंट्रो प्रोग्रामिंग](/sketchnotes//webdev101-programming.png) +>[टोमोमी इमुरा](https://twitter.com/girlie_mac) द्वारा स्केचनेट + +## पूर्व व्याख्यान प्रश्नोत्तरी +[पूर्व व्याख्यान प्रश्नोत्तरी](https://nice-beach-0fe9e9d0f.azurestaticapps.net/quiz/1?loc=hi) + +## परिचय + +इस पाठ में, हम कवर करेंगे: + +- प्रोग्रामिंग क्या है? +- प्रोग्रामिंग भाषाओं के प्रकार +- एक प्रोग्राम के बुनियादी तत्व +- पेशेवर डेवलपर के लिए उपयोगी सॉफ्टवेयर और टूलिंग + +## प्रोग्रामिंग क्या है? + +प्रोग्रामिंग (कोडिंग के रूप में भी जाना जाता है) एक डिवाइस, जैसे कि कंप्यूटर या मोबाइल डिवाइस, को निर्देश लिखने की प्रक्रिया है। हम इन निर्देशों को एक प्रोग्रामिंग भाषा के साथ लिखते हैं, जो तब डिवाइस द्वारा व्याख्या की जाती है। निर्देशों के इन सेटों को विभिन्न नामों से संदर्भित किया जा सकता है, लेकिन *प्रोग्राम*, *कंप्यूटर प्रोग्राम*, *एप्लिकेशन(ऐप)*, और *निष्पादन योग्य* कुछ लोकप्रिय नाम हैं. + +एक *प्रोग्राम* कुछ भी हो सकता है जो कोड के साथ लिखा गया है; वेबसाइट, गेम और फ़ोन ऐप प्रोग्राम हैं। हालांकि, कोड लिखे बिना प्रोग्राम बनाना संभव है, अंतर्निहित तर्क की व्याख्या डिवाइस से की जाती है और उस तर्क को कोड के साथ लिखे जाने की सबसे अधिक संभावना है। एक प्रोग्राम जो *रनिंग* या *एक्जीक्यूटिंग कोड* निर्देश कर रहा है। जिस उपकरण के साथ आप वर्तमान में इस पाठ को पढ़ रहे हैं, वह आपकी स्क्रीन पर प्रिंट करने के लिए एक प्रोग्राम चला रहा है। + +✅ थोड़ा अनुसंधान करें: कौन दुनिया का पहला कंप्यूटर प्रोग्रामर माना जाता है ? + +## प्रोग्रामिंग भाषाएँ + +प्रोग्रामिंग भाषाओं का एक मुख्य उद्देश्य है: डेवलपर्स को डिवाइस पर भेजने के लिए निर्देशों का निर्माण करना। डिवाइस केवल बाइनरी (1s और 0s) को समझ सकते हैं, और *सबसे अधिक* डेवलपर्स के लिए जो संवाद करने का एक बहुत ही कुशल तरीका नहीं है। प्रोग्रामिंग भाषाएं मनुष्य और कंप्यूटर के बीच संचार के लिए एक वाहन हैं। + +प्रोग्रामिंग भाषाएँ विभिन्न स्वरूपों में आती हैं और विभिन्न उद्देश्यों की पूर्ति कर सकती हैं। उदाहरण के लिए, जावास्क्रिप्ट का उपयोग मुख्य रूप से वेब अनुप्रयोगों के लिए किया जाता है, जबकि बैश मुख्य रूप से ऑपरेटिंग सिस्टम के लिए उपयोग किया जाता है। + +*निम्न स्तर की भाषाएं* आमतौर पर निर्देशों की व्याख्या करने के लिए एक उपकरण के लिए * उच्च स्तरीय भाषाओं की तुलना में कम चरणों की आवश्यकता होती है। हालांकि, उच्च स्तरीय भाषाओं को लोकप्रिय बनाने वाली इसकी पठनीयता और समर्थन है। जावास्क्रिप्ट को एक उच्च स्तरीय भाषा माना जाता है. + +निम्न कोड जावास्क्रिप्ट के साथ एक उच्च स्तर की भाषा और एआरएम विधानसभा कोड के साथ निम्न स्तर की भाषा के बीच अंतर को दर्शाता है। + +```javascript +let number = 10 +let n1 = 0, n2 = 1, nextTerm; + +for (let i = 1; i <= number; i++) { + console.log(n1); + nextTerm = n1 + n2; + n1 = n2; + n2 = nextTerm; +} +``` + +```c + area ascen,code,readonly + entry + code32 + adr r0,thumb+1 + bx r0 + code16 +thumb + mov r0,#00 + sub r0,r0,#01 + mov r1,#01 + mov r4,#10 + ldr r2,=0x40000000 +back add r0,r1 + str r0,[r2] + add r2,#04 + mov r3,r0 + mov r0,r1 + mov r1,r3 + sub r4,#01 + cmp r4,#00 + bne back + end +``` + +मानो या न मानो, *वे दोनों एक ही काम कर रहे हैं*: 10 तक एक फाइबोनैचि अनुक्रम मुद्रित करना। + +✅ एक फाइबोनैचि अनुक्रम को संख्याओं के एक सेट के रूप में [परिभाषित](https://en.wikipedia.org/wiki/Fibonacci_number) किया जाता है जैसे कि प्रत्येक संख्या दो पूर्ववर्ती का योग है, जिसकी शुरुआत 0 और 1 से होती है। + +## एक प्रोग्राम के तत्व + +किसी प्रोग्राम में एक निर्देश को एक *स्टेटमेंट* कहा जाता है और इसमें आमतौर पर एक कैरेक्टर या लाइन स्पेस होता है, जो उन सिरों को चिह्नित करता है, जहां से निर्देश समाप्त होता है, या *टर्मिनेट* होता है। कैसे एक कार्यक्रम समाप्त होता है प्रत्येक भाषा के साथ बदलता रहता है। + +अधिकांश प्रोग्राम उपयोगकर्ता या कहीं और से डेटा का उपयोग करने पर निर्भर करते हैं, जहां कथन निर्देशों को पूरा करने के लिए डेटा पर भरोसा कर सकते हैं। डेटा बदल सकता है कि कोई प्रोग्राम कैसे व्यवहार करता है, इसलिए प्रोग्रामिंग भाषाएँ अस्थायी रूप से डेटा को संग्रहीत करने का एक तरीका है जो बाद में उपयोग किया जा सकता है। इस डेटा को *वैरिएबल* कहा जाता है। चर ऐसे कथन हैं जो किसी डिवाइस को उसकी मेमोरी में डेटा को बचाने का निर्देश देते हैं। कार्यक्रमों में विविधताएं बीजगणित में लोगों के समान हैं, जहां उनका एक अनूठा नाम है और समय के साथ उनका मूल्य बदल सकता है। + +एक मौका है कि कुछ बयानों को डिवाइस द्वारा निष्पादित नहीं किया जाएगा। यह आमतौर पर डिज़ाइनर द्वारा लिखा जाता है जब डेवलपर द्वारा लिखा जाता है या जब कोई अप्रत्याशित त्रुटि होती है तो दुर्घटना से। किसी एप्लिकेशन का इस प्रकार का नियंत्रण उसे अधिक मजबूत और बनाए रखने योग्य बनाता है। आमतौर पर नियंत्रण में ये परिवर्तन तब होते हैं जब कुछ निर्णय मिलते हैं। `if..else` स्टेटमेंट आधुनिक प्रोग्रामिंग भाषाओं में एक सामान्य विवरण यह नियंत्रित करने के लिए कि प्रोग्राम कैसे चलाया जाता है। + +✅ आप बाद के पाठों में इस प्रकार के कथन के बारे में अधिक जानेंगे + +## व्यापार के उपकरण + +[![व्यापार के उपकरण](https://img.youtube.com/vi/69WJeXGBdxg/0.jpg)](https://youtube.com/watch?v=69WJeXGBdxg "व्यापार के उपकरण") + +इस अनुभाग में, आप कुछ सॉफ़्टवेयर के बारे में जानेंगे जो आपको अपने व्यावसायिक विकास की यात्रा शुरू करने के दौरान बहुत उपयोगी लग सकते हैं . + +एक **विकास पर्यावरण** उपकरण और सुविधाओं का एक अनूठा सेट है जो एक डेवलपर सॉफ्टवेयर लिखते समय अक्सर उपयोग करेगा। इन उपकरणों में से कुछ को एक डेवलपर विशिष्ट आवश्यकताओं के लिए अनुकूलित किया गया है, और समय के साथ बदल सकता है यदि कोई डेवलपर काम या व्यक्तिगत परियोजनाओं में प्राथमिकताएं बदलता है, या जब वे एक अलग प्रोग्रामिंग भाषा का उपयोग करते हैं। विकास का वातावरण डेवलपर्स के रूप में अद्वितीय है जो उनका उपयोग करते हैं। + +### एडिटर्स + +सॉफ्टवेयर विकास के लिए सबसे महत्वपूर्ण उपकरणों में से एक एडिटर्स है। एडिटर्स वे होते हैं जहाँ आप अपना कोड लिखते हैं और कभी-कभी जहाँ आप अपना कोड चलाते हैं। + +डेवलपर्स कुछ अतिरिक्त कारणों से एडिटर्स पर भरोसा करते हैं: + +- *डिबगिंग* कोड के माध्यम से कदम से, लाइन के द्वारा बग और त्रुटियों की खोज करना। कुछ एडिटर्स में डिबगिंग क्षमताएं होती हैं, या उन्हें विशिष्ट प्रोग्रामिंग भाषाओं के लिए अनुकूलित और जोड़ा जा सकता है।. +- *सिंटेक्स हाइलाइटिंग* कोड के लिए रंगों और पाठ स्वरूपण को जोड़ता है, यह पढ़ना आसान बनाता है। अधिकांश एडिटर अनुकूलित सिंटैक्स हाइलाइटिंग की अनुमति देते हैं. +- *एक्सटेंशन और एकीकरण* डेवलपर्स के लिए जो अतिरिक्त हैं, डेवलपर्स के लिए, अतिरिक्त टूल तक पहुंच के लिए जो कि आधार एडिटर में निर्मित नहीं हैं। उदाहरण के लिए, कई डेवलपर्स को अपने कोड को दस्तावेज करने और यह समझाने का तरीका भी चाहिए कि यह कैसे काम करता है और टाइपोस की जांच के लिए वर्तनी जांच एक्सटेंशन स्थापित करेगा। इनमें से अधिकांश परिवर्धन एक विशिष्ट एडिटर के भीतर उपयोग के लिए हैं, और अधिकांश एडिटर उपलब्ध एक्सटेंशन की खोज करने का एक तरीका है। +- *अनुकूलन* अधिकांश एडिटर अत्यंत अनुकूलन योग्य हैं, और प्रत्येक डेवलपर का अपना विशिष्ट विकास वातावरण होगा जो उनकी आवश्यकताओं के अनुरूप होगा। कई भी डेवलपर्स को अपना विस्तार बनाने की अनुमति देते हैं। + +#### लोकप्रिय एडिटर्स और वेब डेवलपमेंटका एक्सटेंशन + +- [Visual Studio Code](https://code.visualstudio.com/) + - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) + - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare-pack) + - [Prettier - Code formatter](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) +- [Atom](https://atom.io/) + - [spell-check](https://atom.io/packages/spell-check) + - [teletype](https://atom.io/packages/teletype) + - [atom-beautify](https://atom.io/packages/atom-beautify) + +### ब्राउज़र्स + +एक अन्य महत्वपूर्ण उपकरण ब्राउज़र है। वेब डेवलपर ब्राउज़र पर भरोसा करते हैं कि यह देखने के लिए कि उनका कोड वेब पर कैसे चलता है, इसका उपयोग वेब पेज के दृश्य तत्वों को देखने के लिए किया जाता है जो एडिटर में लिखे गए हैं, जैसे की HTML। + +कई ब्राउज़र *डेवलपर टूल*(DevTools) के साथ आते हैं, जिसमें डेवलपर्स को अपने एप्लिकेशन के बारे में महत्वपूर्ण अंतर्दृष्टि एकत्र करने और कैप्चर करने में मदद करने के लिए उपयोगी सुविधाओं और जानकारी का एक सेट होता है। उदाहरण के लिए: यदि किसी वेब पेज में त्रुटियां हैं, तो कभी-कभी यह जानना उपयोगी होता है कि वे कब हुए। एक ब्राउज़र में DevTools इस जानकारी को पकड़ने के लिए कॉन्फ़िगर किया जा सकता है। + +#### लोकप्रिय ब्राउज़रों और DevTools + +- [Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium?WT.mc_id=academic-13441-cxa) +- [Chrome](https://developers.google.com/web/tools/chrome-devtools/) +- [Firefox](https://developer.mozilla.org/docs/Tools) + +### कमांड लाइन टूल्स + +कुछ डेवलपर्स अपने दैनिक कार्यों के लिए कम ग्राफ़िकल दृश्य पसंद करते हैं और इसे प्राप्त करने के लिए कमांड लाइन पर भरोसा करते हैं। विकासशील कोड के लिए महत्वपूर्ण मात्रा में टाइपिंग की आवश्यकता होती है, और कुछ डेवलपर्स कीबोर्ड पर अपने प्रवाह को बाधित नहीं करना पसंद करते हैं और डेस्कटॉप विंडो के बीच स्वैप करने के लिए कीबोर्ड शॉर्टकट का उपयोग करेंगे, विभिन्न फ़ाइलों पर काम करेंगे, और टूल का उपयोग करेंगे। अधिकांश कार्यों को एक माउस के साथ पूरा किया जा सकता है, लेकिन कमांड लाइन का उपयोग करने का एक लाभ यह है कि माउस और कीबोर्ड के बीच स्वैपिंग की आवश्यकता के बिना कमांड लाइन टूल के साथ बहुत कुछ किया जा सकता है। कमांड लाइन का एक और लाभ यह है कि वे कॉन्फ़िगर करने योग्य हैं और आप अपने कस्टम कॉन्फ़िगरेशन को सहेज सकते हैं, इसे बाद में बदल सकते हैं और इसे नई विकास मशीनों में भी आयात कर सकते हैं। क्योंकि विकास वातावरण प्रत्येक डेवलपर के लिए बहुत अनूठा है, कुछ कमांड लाइन का उपयोग करने से बचेंगे, कुछ इस पर पूरी तरह से भरोसा करेंगे, और कुछ दोनों का मिश्रण पसंद करते हैं। + +### लोकप्रिय कमांड लाइन विकल्प + +आपके द्वारा उपयोग किए जाने वाले ऑपरेटिंग सिस्टम के आधार पर कमांड लाइन के विकल्प अलग-अलग होंगे. + +*💻 = ऑपरेटिंग सिस्टम पर प्रीइंस्टॉल्ड आता है.* + +#### विंडोज + +- [Powershell](https://docs.microsoft.com/powershell/scripting/overview?view=powershell-7?WT.mc_id=academic-13441-cxa) 💻 +- [Command Line](https://docs.microsoft.com/windows-server/administration/windows-commands/windows-commands?WT.mc_id=academic-13441-cxa) (also known as CMD) 💻 +- [Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-13441-cxa) +- [mintty](https://mintty.github.io/) + +#### मैक ओएस + +- [Terminal](https://support.apple.com/guide/terminal/open-or-quit-terminal-apd5265185d-f365-44cb-8b09-71a064a42125/mac) 💻 +- [iTerm](https://iterm2.com/) +- [Powershell](https://docs.microsoft.com/powershell/scripting/install/installing-powershell-core-on-macos?view=powershell-7?WT.mc_id=academic-13441-cxa) + +#### लिनक्स + +- [Bash](https://www.gnu.org/software/bash/manual/html_node/index.html) 💻 +- [KDE Konsole](https://docs.kde.org/trunk5/en/applications/konsole/index.html) +- [Powershell](https://docs.microsoft.com/powershell/scripting/install/installing-powershell-core-on-linux?view=powershell-7?WT.mc_id=academic-13441-cxa) + +#### लोकप्रिय कमांड लाइन टूल्स + +- [Git](https://git-scm.com/) (💻 अधिकांश ऑपरेटिंग साइटम पर) +- [NPM](https://www.npmjs.com/) +- [Yarn](https://classic.yarnpkg.com/en/docs/cli/) + +### प्रलेखन + +जब कोई डेवलपर कुछ नया सीखना चाहता है, तो वे इसका उपयोग करने के तरीके जानने के लिए प्रलेखन की ओर रुख करेंगे। डेवलपर्स अक्सर टूल और भाषाओं का सही तरीके से उपयोग करने के लिए, और यह भी कि यह कैसे काम करता है के गहन ज्ञान प्राप्त करने के लिए मार्गदर्शन के लिए प्रलेखन पर भरोसा करते हैं। + +#### वेब विकास पर लोकप्रिय प्रलेखन + +- [Mozilla Developer Network](https://developer.mozilla.org/docs/Web) +- [Frontend Masters](https://frontendmasters.com/learn/) + +✅ कुछ शोध करें: अब जब आप एक वेब डेवलपर के वातावरण की मूल बातें जानते हैं, तो इसकी तुलना करें और वेब डिजाइनर के वातावरण के साथ इसके विपरीत करें। + +--- + +## 🚀 चुनौती + +कुछ प्रोग्रामिंग भाषाओं की तुलना करें। जावास्क्रिप्ट बनाम जावा के कुछ विशिष्ट लक्षण क्या हैं? COBOL बनाम GO के बारे मे? + +## व्याख्यान उपरांत प्रश्नोत्तरी +[व्याख्यान उपरांत प्रश्नोत्तरी](https://nice-beach-0fe9e9d0f.azurestaticapps.net/quiz/2?loc=hi) + +## समीक्षा और स्व अध्ययन + +प्रोग्रामर के लिए उपलब्ध विभिन्न भाषाओं पर थोड़ा अध्ययन करें। एक भाषा में एक पंक्ति लिखने का प्रयास करें, और फिर इसे दो अन्य में फिर से लिखें। आप क्या सीखते हैं? + +## असाइनमेंट + +[डॉक्स पढ़ना](assignment.hi.md) diff --git a/1-getting-started-lessons/1-intro-to-programming-languages/translations/assignment.zh-cn.md b/1-getting-started-lessons/1-intro-to-programming-languages/translations/assignment.zh-cn.md index cba5ab16..e29de1c8 100644 --- a/1-getting-started-lessons/1-intro-to-programming-languages/translations/assignment.zh-cn.md +++ b/1-getting-started-lessons/1-intro-to-programming-languages/translations/assignment.zh-cn.md @@ -7,5 +7,5 @@ ## 评价表 | 优秀 | 良好 | 尚可进步 | -| --- | --- | -- | +| --- | --- | --- | | 解释了 Web 开发者为什么需要这些工具 | 解释了开发者如何使用这些工具，但却没有解释为什么需要它们 | 既没有解释为什么使用这些工具，也没有给出使用它们的方法 | diff --git a/1-getting-started-lessons/2-github-basics/translations/README.hi.md b/1-getting-started-lessons/2-github-basics/translations/README.hi.md new file mode 100644 index 00000000..d0c387f9 --- /dev/null +++ b/1-getting-started-lessons/2-github-basics/translations/README.hi.md @@ -0,0 +1,315 @@ +# गिटहब का परिचय + +इस पाठ में GitHub की मूल बातें शामिल हैं, जो आपके कोड में परिवर्तनों को होस्ट और प्रबंधित करने के लिए एक मंच है। + +![GitHub का परिचय](/sketchnotes//webdev101-github.png) +> [टोमोमी इमुरा](https://twitter.com/girlie_mac) द्वारा स्केचनेट + +## पूर्व व्याख्यान प्रश्नोत्तरी +[पूर्व व्याख्यान प्रश्नोत्तरी](https://nice-beach-0fe9e9d0f.azurestaticapps.net/quiz/3?loc=hi) + +## परिचय + +इस पाठ में, हम कवर करेंगे: + +- आपके द्वारा मशीन पर किए गए कार्य को ट्रैक करना +- दूसरों के साथ परियोजनाओं पर काम करना +- खुला स्त्रोत सॉफ़्टवेयर खोलने में योगदान कैसे करें + +### आवश्यक शर्तें + + शुरू करने से पहले, आपको जांचना होगा कि क्या Git स्थापित है। टर्मिनल में लिखे: +`git --version` + +यदि गिट स्थापित नहीं है तो , [गिट डाउनलोड करे](https://git-scm.com/downloads). फिर, टर्मिनल में अपनी स्थानीय Git प्रोफ़ाइल सेट करें: +* `git config --global user.name "your-name"` +* `git config --global user.email "your-email"` + +यह जाँचने के लिए कि क्या Git पहले से कॉन्फ़िगर है आप टाइप कर सकते हैं: +`git config --list` + +आपको एक GitHub खाते, एक कोड एडिटर (जैसे Visual Studio कोड) की आवश्यकता होगी, और आपको अपना टर्मिनल (या: कमांड प्रॉम्प्ट) खोलने की आवश्यकता होगी। + +[Github.com](https://github.com/) पर नेविगेट करें और यदि आप पहले से नहीं हैं, तो एक खाता बनाएं या लॉग इन करें और अपना प्रोफ़ाइल भरें। + +✅ GitHub दुनिया में एकमात्र कोड भंडार नहीं है; अन्य हैं, लेकिन GitHub सबसे अच्छा ज्ञात है + +### तैयारी + +आपको अपने स्थानीय मशीन (लैपटॉप या पीसी) पर एक कोड परियोजना के साथ एक फ़ोल्डर की आवश्यकता होगी, और GitHub पर एक सार्वजनिक भंडार, जो दूसरों की परियोजनाओं में योगदान करने के लिए एक उदाहरण के रूप में काम करेगा। + +--- + +## कोड प्रबंधन + +मान लें कि आपके पास कुछ कोड प्रोजेक्ट के साथ स्थानीय रूप से एक फ़ोल्डर है और आप संस्करण नियंत्रण प्रणाली - git का उपयोग करके अपनी प्रगति को ट्रैक करना शुरू करना चाहते हैं। कुछ लोग आपके भविष्य के लिए एक प्रेम पत्र लिखने के लिए git का उपयोग करने की तुलना करते हैं। अपने प्रतिबद्ध संदेशों को दिनों या हफ्तों या महीनों के बाद पढ़कर आप याद कर पाएंगे कि आपने निर्णय क्यों लिया, या "रोलबैक" में बदलाव किया - यानी जब आप अच्छा "कमिट मैसेज" लिखते हैं। + +### कार्य: एक रीपाज़टॉरी और कमिट कोड बनाएं +1. **GitHub पर रीपाज़टॉरी बनाएँ**. GitHub.com पर, रिपॉजिटरी टैब में, या नेविगेशन बार टॉप-राइट से, **नया रेपो** बटन ढूंढें। + + 1. अपने रिपॉजिटरी (फ़ोल्डर) को एक नाम दें + 1. **रिपॉजिटरी बनाएं** चुनें। + +1. **अपने कार्यशील फ़ोल्डर में नेविगेट करें**. अपने टर्मिनल में, उस फ़ोल्डर पर स्विच करें (जिसे निर्देशिका के रूप में भी जाना जाता है) जिसे आप ट्रैक करना चाहते हैं, लिखे : + + ```bash + cd [फ़ोल्डरका नाम] + ``` + +1. **एक गिट रिपॉजिटरी को प्रारंभ करें**. आपके प्रोजेक्ट मे लिखे: + ```bash + git init + ``` + +1. **अवस्था जांच**. अपने भंडार प्रकार की स्थिति की जांच करने के लिए लिखे: + + ```bash + git status + ``` + + आउटपुट कुछ इस तरह दिख सकता है: + + ```output + Changes not staged for commit: + (use "git add ..." to update what will be committed) + (use "git checkout -- ..." to discard changes in working directory) + + modified: file.txt + modified: file2.txt + ``` + +आमतौर पर एक `git status` कमांड आपको ऐसी चीजें बताती है जैसे रेपो में _saved_ होने के लिए कौन सी फाइलें तैयार हैं या इस पर ऐसे बदलाव हैं जिन्हें आप जारी रखना चाहते हैं। + +1. **ट्रैकिंग के लिए सभी फाइलें जोड़ें** + इसे स्टेजिंग फाइल / फाइल को स्टेजिंग एरिया में जोड़ना भी कहा जाता है। + + ```bash + git add . + ``` + + `Git add` और `.` तर्क इंगित करता है कि आपकी सभी फाइलें और ट्रैकिंग के लिए परिवर्तन होगया है। + +1. **ट्रैकिंग के लिए चयनित फ़ाइलें जोड़ें** + + ```bash + git add [फ़ाइल या फ़ोल्डर का नाम] + ``` + + जब हम एक बार में सभी फ़ाइलों को कमिट नहीं करना चाहते हैं, तो यह हमें केवल स्टेजिंग क्षेत्र में चयनित फ़ाइलों को जोड़ने में मदद करता है। + +1. **सभी फाइलों को अनस्टेज करें** + + ```bash + git reset + ``` + + यह कमांड हमें एक ही बार में सभी फ़ाइलों को अस्थिर करने में मदद करता है। + +1. **किसी विशेष फ़ाइल को अनस्टेज करें** + + ```bash + git reset [फ़ाइल या फ़ोल्डर का नाम] + ``` + +यह कमांड हमें केवल एक विशेष फ़ाइल को एक बार में अनस्टेज करने में मदद करती है जिसे हम अगले कमिट के लिए शामिल नहीं करना चाहते हैं। + +1. **अपना काम जारी रखना**. इस बिंदु पर आपने फ़ाइलों को तथाकथित _स्टैजिंग एरिया_ में जोड़ा है।एक जगह जहां Git आपकी फ़ाइलों को ट्रैक कर रही है। परिवर्तन को स्थायी करने के लिए आपको फ़ाइलों को _कॉमित_ की आवश्यकता होती है। ऐसा करने के लिए आप `git commit` कमांड के साथ एक _कमिट _ बनाते हैं। एक _कमिट_ आपके रेपो के इतिहास में एक बचत बिंदु का प्रतिनिधित्व करता है। _कमिट_ बनाने के लिए निम्नलिखित टाइप करें: + + ```bash + git commit -m "पहला कमिट" + ``` + + यह आपकी सभी फ़ाइलों को "पहला कमिट" संदेश को जोड़ता है। भविष्य के कमिट संदेशों के लिए आप अपने विवरण में यह बताना चाहेंगे कि आपने किस प्रकार का परिवर्तन किया है। + +1. **अपने स्थानीय Git रेपो को GitHub से कनेक्ट करें**. आपके मशीन पर एक Git रेपो अच्छा है, लेकिन कुछ बिंदु पर आप अपनी फ़ाइलों का बैकअप कहीं और रखना चाहते हैं और अन्य लोगों को भी अपने रेपो पर आपके साथ काम करने के लिए आमंत्रित करते हैं। ऐसा करने के लिए एक महान जगह GitHub है। याद रखें कि हमने पहले ही GitHub पर एक रेपो बना लिया है, इसलिए हमें केवल अपने Git रेपो को GitHub के साथ जोड़ना है। कमांड `git remote add` बस यही करेगा। निम्न कमांड टाइप करें: + + > ध्यान दें, इससे पहले कि आप कमांड टाइप करें अपने रिपॉजिटरी URL को खोजने के लिए अपने GitHub रेपो पेज पर जाएं। आप इसे नीचे दिए गए कमांड में उपयोग करेंगे। अपने GitHub URL से `repository_name` बदलें। + + ```bash + git remote add origin https://github.com/username/repository_name.git + ``` + + यह आपके द्वारा पहले बनाए गए GitHub रिपॉजिटरी को इंगित करते हुए "origin" नाम का एक _remote_, या कनेक्शन बनाता है। + +1. **GitHub पर स्थानीय फ़ाइलें भेजें**. अब तक आपने स्थानीय रेपो और गिटहब रेपो के बीच एक _कनेक्शन_ बनाया है। चलो निम्न कमांड `git push` के साथ इन फाइलों को गिटहब को भेजें, जैसे: + + ```bash + git push -u origin main + ``` + + यह आपकी "मैन" शाखा में GitHub को आपके कमिट भेजता है। + +1. **अधिक परिवर्तन जोड़ने के लिए**. यदि आप परिवर्तन करना जारी रखना चाहते हैं और उन्हें GitHub पर धकेलना चाहते हैं, तो आपको निम्नलिखित तीन आदेशों का उपयोग करने की आवश्यकता होगी: + + ```bash + git add . + git commit -m "अपना संदेश यहाँ लिखें" + git push + ``` + + > टिप, आप उन फ़ाइलों को रोकने के लिए एक `.gitignore` फ़ाइल भी अपनाना चाह सकते हैं जिन्हें आप GitHub पर दिखाने से रोकना चाहते हैं - जैसे नोट्स आप उसी फ़ोल्डर में संग्रहीत करते हैं, लेकिन सार्वजनिक रिपॉजिटरी में कोई स्थान नहीं है। आप `.gitignore` फाइल के लिए टेम्प्लेट में [.gitignore टेम्प्लेट](https://github.com/github/gitignore) पे पा सकते हैं +#### कमिट संदेश + +एक महान Git कमिट विषय पंक्ति निम्नलिखित वाक्य को पूरा करती है: +यदि लागू किया जाता है, तो यह प्रतिबद्ध होगा <आपकी विषय पंक्ति यहां> + +विषय के लिए अनिवार्य, वर्तमान काल का उपयोग करें: "परिवर्तन" न "बदला गया" और न ही "परिवर्तने"। +विषय के रूप में, शरीर में (वैकल्पिक) भी अनिवार्य, वर्तमान काल का उपयोग करते हैं। शरीर में परिवर्तन के लिए प्रेरणा शामिल होनी चाहिए और पिछले व्यवहार के साथ इसके विपरीत होना चाहिए। आप `क्यों` को समझा रहे हैं,` कैसे` को नहीं। + +✅ GitHub के आसपास सर्फ करने के लिए कुछ मिनट लें। क्या आप वास्तव में महान कमिट संदेश पा सकते हैं? क्या आप वास्तव में न्यूनतम पा सकते हैं? आपको क्या संदेश लगता है कि एक कमिट संदेश देने के लिए सबसे महत्वपूर्ण और उपयोगी है? + +### कार्य: सहयोग करें + +गिटहब पर चीजें डालने का मुख्य कारण अन्य डेवलपर्स के साथ सहयोग करना संभव बनाना था। + +## दूसरों के साथ परियोजनाओं पर काम करना + +अपनी रिपॉजिटरी में, यह देखने के लिए कि आपकी परियोजना अनुशंसित सामुदायिक मानकों की तुलना कैसे करती है, `इनसाइट्स > कम्यूनिटी` पर जाएँ। + + यहाँ कुछ चीजें हैं जो आपके GitHub रेपो में सुधार कर सकती हैं: + - **विवरण**. क्या आपने अपनी परियोजना के लिए एक विवरण जोड़ा? + - **README**. क्या आपने एक README जोड़ा? GitHub एक [README](https://docs.github.com/articles/about-readmes/) लिखने के लिए मार्गदर्शन प्रदान करता है। + - **योगदान दिशानिर्देश**. आपके प्रोजेक्टका [योगदान दिशानिर्देश](https://docs.github.com/articles/setting-guidelines-for-repository-contributors/) है, + - **आचार संहिता**. एक [आचार संहिता](https://docs.github.com/articles/adding-a-code-of-conduct-to-your-project/), + - **लाइसेंस**. शायद सबसे महत्वपूर्ण बात, एक [लाइसेंस](https://docs.github.com/articles/adding-a-license-to-a-repository/)? + + +इन सभी संसाधनों से टीम के नए सदस्यों को लाभ मिलेगा। और वे आम तौर पर इस तरह की चीजें हैं जो आपके कोड को देखने से पहले भी नए योगदानकर्ताओं को देखते हैं, यह पता लगाने के लिए कि क्या आपका प्रोजेक्ट उनके लिए अपना समय बिताने के लिए सही जगह है। + +✅ README फाइलें, हालांकि उन्हें तैयार करने में समय लगता है, अक्सर व्यस्त रखवाले द्वारा उपेक्षित कर दिए जाते हैं। क्या आप एक विशेष रूप से वर्णनात्मक का एक उदाहरण पा सकते हैं? नोट: कुछ अच्छे [READMEs बनाने में मदद करने के लिए कुछ उपकरण हैं](https://www.makeareadme.com/) जिन्हें आप आज़माना चाहते हैं। + +### कार्य: कुछ कोड मर्ज करें + +डॉक्स में योगदान करने से लोगों को परियोजना में योगदान करने में मदद मिलती है। यह बताता है कि आप किस प्रकार के योगदान की तलाश कर रहे हैं और प्रक्रिया कैसे काम करती है। योगदानकर्ताओं को GitHub पर आपके रेपो में योगदान करने में सक्षम होने के लिए कई चरणों से गुजरना होगा: + + +1. **अपने रेपो को फोर्क करना** आप शायद लोगों को अपनी परियोजना को _fork_ करना चाहेंगे। फोर्किंग का अर्थ है उनके GitHub प्रोफाइल पर अपनी रिपॉजिटरी की प्रतिकृति बनाना। +1. **क्लोन**.वहां से वे इस परियोजना को अपनी स्थानीय मशीन से जोड़ देंगे। +1. **एक शाखा बनाएँ**. आप उन्हें अपने काम के लिए एक _शाखा_ बनाने के लिए कहना चाहेंगे। +1. **एक क्षेत्र पर उनके परिवर्तन पर ध्यान दें**.योगदानकर्ताओं से एक समय में एक चीज़ पर उनके योगदान पर ध्यान केंद्रित करने के लिए कहें - इस तरह से संभावना है कि आप उनके काम में विलय कर सकते हैं। कल्पना कीजिए कि वे एक बग फिक्स लिखते हैं, एक नई सुविधा जोड़ते हैं, और कई परीक्षण अपडेट करते हैं - क्या होगा यदि आप चाहते हैं, या केवल 3 में से 2, या 3 में से 1 परिवर्तन लागू कर सकते हैं? + +✅ ऐसी स्थिति की कल्पना करें जहां शाखाएं विशेष रूप से अच्छे कोड लिखने और शिपिंग करने के लिए महत्वपूर्ण हैं। आप किन मामलों का उपयोग कर सकते हैं? + +> ध्यान दें, वह परिवर्तन हो जो आप दुनिया में देखना चाहते हैं, और अपने काम के लिए भी शाखाएँ बनाएँ। आपके द्वारा किया गया कोई भी शाखा उस शाखा पर बना दी जाएगी जिसे आप वर्तमान में "चेक आउट" कर रहे हैं। कौन सी शाखा है यह देखने के लिए `git status` का प्रयोग करें। + +चलो एक योगदानकर्ता वर्कफ़्लो के माध्यम से चलते हैं। मान लें कि योगदानकर्ता पहले से ही रेपो को _फोर्क_ और _क्लोन_ कर चुका है, इसलिए उनके पास अपने स्थानीय मशीन पर काम करने के लिए तैयार गिट रेपो है: + +1. **एक शाखा बनाएँ**.एक शाखा बनाने के लिए कमांड `git branch` का उपयोग करें जिसमें वे परिवर्तन होंगे जो उनके योगदान के लिए हैं: + + ```bash + git branch [शाखाका-नाम] + ``` + +1. **कार्यशील शाखा पर स्विच करें**. निर्दिष्ट शाखा में स्विच करें और `git checkout` के साथ कार्य निर्देशिका को अपडेट करें: + + ```bash + git checkout [शाखाका-नाम] + ``` + +1. **काम करो**. इस बिंदु पर आप अपने परिवर्तन जोड़ना चाहते हैं। निम्नलिखित आदेशों के बारे में Git को बताना न भूलें: + + ```bash + git add . + git commit -m "मेरे परिवर्तन" + ``` + + यह सुनिश्चित करें कि आप अपनी खातिर एक अच्छा नाम दें, साथ ही साथ आप जिस रेपो में मदद कर रहे हैं उसका रखवालाका भी। + +1. **`main` शाखा के साथ अपने काम को मिलाएं**. कुछ बिंदु पर आप काम कर रहे हैं और आप `main` शाखा के साथ अपने काम को जोड़ना चाहते हैं। `main` शाखा इस बीच बदल सकती है, इसलिए सुनिश्चित करें कि आपने इसे निम्न कमांड के साथ नवीनतम में अपडेट किया है: + + ```bash + git checkout main + git pull + ``` + + इस बिंदु पर आप यह सुनिश्चित करना चाहते हैं कि कोई भी _टकराव_, परिस्थितियां जहां Git आसानी से आपके कामकाजी शाखा में होने वाले परिवर्तनों को _संयोजित_ नहीं कर सकती है। इसलिए निम्न आदेश चलाएँ: + + ```bash + git checkout [शाखाका-नाम] + git merge main + ``` + + यह आपकी शाखा में `main` से सभी बदलाव लाएगा और उम्मीद है कि आप अभी भी जारी रख सकते हैं। यदि नहीं, तो VS कोड आपको बताएगा कि गिट कहां _उलझन_ में है और आप यह कहने के लिए प्रभावित फाइलों को बदल देते हैं कि कौन सी सामग्री सबसे सटीक है। + +1. **अपना काम GitHub को भेजें**. अपने काम को GitHub में भेजने का मतलब है दो चीजें। अपनी शाखा को अपने रेपो में धकेलना और फिर एक पीआर, पुल अनुरोध को खोलें। + + ```bash + git push --set-upstream origin [शाखाका-नाम] + ``` + + उपरोक्त कमांड आपके फोर्क्ड रेपो पर शाखा बनाता है। + +1. **एक पीआर खोलें**. अगला, आप एक पीआर खोलना चाहते हैं। आप GitHub पर फोर्केड रेपो में नेविगेट करके ऐसा करते हैं। आपको GitHub पर एक संकेत दिखाई देगा जहां यह पूछता है कि क्या आप एक नया PR बनाना चाहते हैं, आप उस पर क्लिक करते हैं और आपको एक इंटरफ़ेस पर ले जाया जाता है जहाँ आप प्रतिबद्ध संदेश शीर्षक बदल सकते हैं, इसे अधिक उपयुक्त विवरण दे सकते हैं। अब रेपो के अनुरक्षक आप इस पीआर को देखेंगे और _उँगलियाँ पार_ कर जाएँगे जो आपके पीआर को सराहेंगे और _मर्ज_ करेंगे। अब आप एक योगदानकर्ता हैं, याय :) + +1. **साफ - सफाई**. अपने को सफलतापूर्वक मर्ज करने के बाद _सफाई करना_ अच्छा माना जाता है। आप अपनी स्थानीय शाखा और उस शाखा को साफ़ करना चाहते हैं जिसे आपने GitHub में धकेल दिया है। पहले इसे निम्नलिखित कमांड के साथ स्थानीय रूप से हटा दें: + + ```bash + git branch -d [शाखाका-नाम] + ``` + + सुनिश्चित करें कि आप अगले फोर्केड रेपो के लिए GitHub पृष्ठ पर जाएं और उस दूरस्थ शाखा को हटा दें जिसे आपने अभी पुश किया था। + +`पुल अनुरोध` एक मूर्खतापूर्ण शब्द की तरह लगता है क्योंकि वास्तव में आप परियोजना में अपने परिवर्तनों को आगे बढ़ाना चाहते हैं। लेकिन अनुरक्षक (परियोजना स्वामी) या कोर टीम को परियोजना की "main" शाखा के साथ विलय करने से पहले आपके परिवर्तनों पर विचार करने की आवश्यकता है, इसलिए आप वास्तव में एक अनुचर से परिवर्तन के निर्णय का अनुरोध कर रहे हैं। + +एक पुल अनुरोध समीक्षा, टिप्पणियों, एकीकृत परीक्षणों और अधिक के साथ एक शाखा पर पेश किए गए मतभेदों की तुलना और चर्चा करने का स्थान है। एक अच्छा पुल अनुरोध एक प्रतिबद्ध संदेश के समान नियमों का पालन करता है। आप समस्या ट्रैकर में किसी समस्या के संदर्भ को जोड़ सकते हैं, जब उदाहरण के लिए आपका कार्य किसी समस्या को हल करता है। यह आपके अंक की संख्या के बाद एक `#` का उपयोग करके किया जाता है। उदाहरण के लिए `# 97`। + +🤞उंगलियों ने पार कर दिया कि सभी चेक पास हो गए और परियोजना के मालिकों ने परियोजना में आपके बदलावों को मर्ज कर दिया🤞 + +GitHub पर संबंधित दूरस्थ शाखा से सभी नए कमिट के साथ अपनी वर्तमान स्थानीय कार्य शाखा को अपडेट करें: + +`git pull` + +## कैसे खुला स्रोत में योगदान करे + +सबसे पहले, आप के हित के GitHub पर एक रिपॉजिटरी (या **रेपो**) ढूंढें और जिसमें आप बदलाव में योगदान करना चाहते हैं। आप इसकी सामग्री को अपनी मशीन पर कॉपी करना चाहेंगे। + +✅'शुरुआती-अनुकूल' रेपो को खोजने का एक अच्छा तरीका है, ['good-first-issue' द्वारा खोज करना](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/). + +![एक रेपो को स्थानीय रूप से कॉपी करें](../images/clone_repo.png) + +कोड को कॉपी करने के कई तरीके हैं। एक तरीका है रिपॉजिटरी की सामग्री को "क्लोन" करना, HTTPS, SSH का उपयोग करना, या GitHub CLI (कमांड लाइन इंटरफ़ेस) का उपयोग करना। + +अपना टर्मिनल खोलें और रिपॉजिटरी को क्लोन करें जैसे: +`git clone https://github.com/ProjectURL` + +प्रोजेक्ट पर काम करने के लिए, सही फ़ोल्डर पर जाएँ: +`cd ProjectURL` + +आप [Codespaces](https://github.com/features/codespaces), GitHub के एम्बेडेड कोड एडिटर / क्लाउड डेवलपमेंट एन्वायरमेंट, या [GitHub Desktop](https://desktop.github.com/) का उपयोग करके पूरी परियोजना भी खोल सकते हैं ) का है। + +अंत में, आप ज़िप फ़ोल्डर में कोड डाउनलोड कर सकते हैं। + +### GitHub के बारे में कुछ और दिलचस्प बातें + +आप GitHub पर किसी भी पब्लिक रिपॉजिटरी को स्टार, पहरा और/या "फोर्क" कर सकते हैं। आप शीर्ष-दाएँ ड्रॉप-डाउन मेनू में अपने तारांकित रिपॉजिटरी पा सकते हैं। यह बुकमार्क करने जैसा है, लेकिन कोड के लिए। + +परियोजनाओं में एक मुद्दा ट्रैकर है, ज्यादातर "इश्यू" टैब में गिटहब पर जब तक कि अन्यथा इंगित नहीं किया जाता है, जहां लोग परियोजना से संबंधित मुद्दों पर चर्चा करते हैं। और पुल अनुरोध टैब वह है जहां लोग उन परिवर्तनों की चर्चा और समीक्षा करते हैं जो प्रगति पर हैं। + +परियोजनाओं की चर्चा फ़ोरम, मेलिंग सूचियों, या चैट चैनलों जैसे स्लैक, डिस्कोर्ड या आईआरसी में भी हो सकती है। + +✅ अपने नए GitHub रेपो के चारों ओर एक नज़र डालें और कुछ चीजों को आज़माएं, जैसे कि सेटिंग्स को संपादित करना, अपने रेपो में जानकारी जोड़ना और एक प्रोजेक्ट बनाना (जैसे कंबन बोर्ड)। बहुत कुछ है जो आप कर सकते हैं! + +--- + +## 🚀 चुनौती + +एक दूसरे के कोड पर काम करने के लिए एक दोस्त के साथ जोडे। सहयोगी रूप से एक परियोजना बनाएँ, कोड बनाएँ, शाखाएँ बनाएँ, और परिवर्तनों को मर्ज करें। + +## व्याख्यान उपरांत प्रश्नोत्तरी +[व्याख्यान उपरांत प्रश्नोत्तरी](https://nice-beach-0fe9e9d0f.azurestaticapps.net/quiz/4?loc=hi) + +## समीक्षा और स्व अध्ययन + +[ओपन सोर्स सॉफ्टवेयर में योगदान](https://opensource.guide/how-to-contribute/#how-to-submit-a-contribution) के बारे में और पढ़ें। + +[गिट चिटशीट](https://training.github.com/downloads/github-git-cheat-sheet/). + +अभ्यास, अभ्यास, अभ्यास। GitHub में [lab.github.com](https://lab.github.com/) के माध्यम से सीखने के शानदार रास्ते उपलब्ध हैं: + +- [GitHub पर पहला सप्ताह](https://lab.github.com/githubtraining/first-week-on-github) + +आपको और भी उन्नत प्रयोगशालाएँ मिलेंगी। + +## असाइनमेंट + +[GitHub प्रशिक्षण प्रयोगशाला पर पहला सप्ताह](https://lab.github.com/githubtraining/first-week-on-github) पूरा करे diff --git a/1-getting-started-lessons/3-accessibility/translations/README.hi.md b/1-getting-started-lessons/3-accessibility/translations/README.hi.md new file mode 100644 index 00000000..6f827312 --- /dev/null +++ b/1-getting-started-lessons/3-accessibility/translations/README.hi.md @@ -0,0 +1,227 @@ +# सुलभ वेबपृष्ठ बनाना + +![पहुँच के बारे में सब कुछ](/sketchnotes/webdev101-a11y.png) +> [टोमोमी इमुरा](https://twitter.com/girlie_mac) द्वारा स्केचनेट + +## पूर्व व्याख्यान प्रश्नोत्तरी +[पूर्व व्याख्यान प्रश्नोत्तरी](https://nice-beach-0fe9e9d0f.azurestaticapps.net/quiz/5?loc=hi) + +> वेब की शक्ति अपनी सार्वभौमिकता में है। विकलांगता की परवाह किए बिना सभी तक पहुंच एक आवश्यक पहलू है। +> +> \- सर टिमोथी बर्नर्स-ली, W3C निदेशक और वर्ल्ड वाइड वेब के आविष्कारक + +यह उद्धरण सुलभ वेबसाइट बनाने के महत्व पर पूरी तरह से प्रकाश डालता है। एक एप्लिकेशन जिसे सभी द्वारा एक्सेस नहीं किया जा सकता है वह परिभाषा बहिष्करण द्वारा है। वेब डेवलपर्स के रूप में हमें हमेशा ध्यान में रखना चाहिए। शुरू से इस पर ध्यान केंद्रित करने से आप अपने तरीके से अच्छी तरह से सुनिश्चित कर पाएंगे कि हर कोई आपके द्वारा बनाए गए पृष्ठों तक पहुंच बना सके। इस पाठ में, आप उन टूल्स के बारे में जानेंगे जो यह सुनिश्चित करने में आपकी मदद कर सकते हैं कि आपकी वेब एसेट्स सुलभ हैं और एक्सेसिबिलिटी को ध्यान में रखते हुए कैसे बनाया जाए। + +## उपयोग करने के उपकरण + +### स्क्रीन रीडर + +सबसे प्रसिद्ध पहुँच उपकरणों में से एक स्क्रीन रीडर हैं। + +[स्क्रीन रीडर](https://en.wikipedia.org/wiki/Screen_reader) आमतौर पर दृष्टि हानि वाले लोगों के लिए उपयोग किए जाते हैं। जैसा कि हम एक ब्राउज़र सुनिश्चित करने में समय बिताते हैं, हम जो जानकारी साझा करना चाहते हैं, उसे ठीक से बता देते हैं, हमें यह भी सुनिश्चित करना चाहिए कि स्क्रीन रीडर भी ऐसा ही करे। + +इसके सबसे मूल में, एक स्क्रीन रीडर ऊपर से नीचे तक एक पृष्ठ को श्रव्य रूप से पढ़ेगा। यदि आपका पृष्ठ सभी पाठ है, तो पाठक एक ब्राउज़र में इसी तरह से जानकारी को बताएगा। बेशक, वेब पेज शायद ही कभी विशुद्ध रूप से टेक्स्ट होते हैं; वे लिंक, ग्राफिक्स, रंग, और अन्य दृश्य घटक शामिल होंगे। यह सुनिश्चित करने के लिए ध्यान रखा जाना चाहिए कि यह जानकारी स्क्रीन रीडर द्वारा सही ढंग से पढ़ी जाए। + +प्रत्येक वेब डेवलपर को स्क्रीन रीडर के साथ खुद को परिचित करना चाहिए। जैसा कि ऊपर प्रकाश डाला गया है, यह वह क्लाइंट है जिसे आपके उपयोगकर्ता उपयोग करेंगे। बहुत कुछ उसी तरह से जिससे आप परिचित हैं कि ब्राउज़र कैसे संचालित होता है, आपको यह सीखना चाहिए कि स्क्रीन रीडर कैसे संचालित होता है। सौभाग्य से, स्क्रीन रीडर अधिकांश ऑपरेटिंग सिस्टम में निर्मित होते हैं। + +कुछ ब्राउज़रों में अंतर्निहित टूल और एक्सटेंशन भी होते हैं, जो टेक्स्ट को जोर से पढ़ सकते हैं या कुछ बुनियादी नौवहन सुविधाएँ भी प्रदान कर सकते हैं, जैसे कि [ये एक्सेसिबिलिटी-केंद्रित एज ब्राउज़र टूल](https://support.microsoft.com/en-us/help/4000734/microsoft-edge-accessibility-features)। ये महत्वपूर्ण एक्सेसिबिलिटी टूल भी हैं, लेकिन स्क्रीन रीडर्स से बहुत अलग तरीके से काम करते हैं और स्क्रीन रीडर टेस्टिंग टूल्स के लिए इनसे गलती नहीं होनी चाहिए। + +✅ स्क्रीन रीडर और ब्राउज़र टेक्स्ट रीडर आज़माएं। विंडोज पर [नैरेटर](https://support.microsoft.com/en-us/windows/complete-guide-to-narrator-e4397a0d-ef4f-b386-d8ae-c17bf109bdb1) डिफ़ॉल्ट रूप से शामिल है, और [JAWS](https://webaim.org/articles/jaws/) और [NVDA](https://www.nvaccess.org/about-nvda/) भी इंस्टॉल किए जा सकते हैं। MacOS और iOS पर, [VoiceOver](https://support.apple.com/guide/voiceover/welcome/10) डिफ़ॉल्ट रूप से स्थापित है। + +### ज़ूम + +आमतौर पर दृष्टि दोष वाले लोगों द्वारा उपयोग किया जाने वाला एक अन्य उपकरण जूमिंग है। जूमिंग का सबसे मूल प्रकार स्थिर ज़ूम है, जिसे 'कंट्रोल + प्लस साइन (+)' या स्क्रीन रिज़ॉल्यूशन कम करके नियंत्रित किया जाता है। इस प्रकार का ज़ूम पूरे पृष्ठ को आकार देने का कारण बनता है, इसलिए एक अच्छा उपयोगकर्ता अनुभव प्रदान करने के लिए [उत्तरदायी डिज़ाइन](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design) का उपयोग करना महत्वपूर्ण है बढ़े हुए ज़ूम स्तर पर। + +एक अन्य प्रकार का ज़ूम स्क्रीन और पैन के एक क्षेत्र को बढ़ाने के लिए विशेष सॉफ़्टवेयर पर निर्भर करता है, बहुत कुछ वास्तविक आवर्धक कांच का उपयोग करने जैसा। विंडोज पर, [Magnifier](https://support.microsoft.com/en-us/windows/use-magnifier-to-make-things-on-the-screen-easier-to-see-414948ba-8b1bc-d3bd-8615-0e5e32204198) में बनाया गया है और [ZoomText](https://www.freedomscientific.com/training/zoomtext/getting-started/) अधिक सुविधाओं और एक बड़ा उपयोगकर्ता आधार के लिए एक तृतीय-पक्ष आवर्धन सॉफ्टवेयर है। दोनों macOS और iOS में एक अंतर्निहित आवर्धन सॉफ्टवेयर होता है जिसे [ज़ूम](https://www.apple.com/accessibility/mac/vision/) कहा जाता है। +### कंट्रास्ट चेकर्स + +कलर-ब्लाइंड यूजर्स या ऐसे लोग जिन्हें कम कंट्रास्ट कलर देखने में दिक्कत होती है, उनकी जरूरतों का जवाब देने के लिए वेब साइट्स पर रंगों को सावधानी से चुना जाना चाहिए। + +✅ ब्राउज़र एक्सटेंशन के साथ रंग उपयोग के लिए उपयोग की जाने वाली वेब साइट का परीक्षण करें, जैसे कि [WCAG का कलर चेकर](https://microsoftedge.microsoft.com/addons/detail/wcag-color-contrast-check/idahaggnlnekelhgplklhfpchbfdmkjp?hl=en-US)। आप क्या सीखते हैं? + +### लाइटहाउस + +अपने ब्राउज़र के डेवलपर टूल क्षेत्र में, आपको लाइटहाउस टूल मिलेगा। वेब साइट की पहुंच (साथ ही अन्य विश्लेषण) का पहला दृश्य प्राप्त करने के लिए यह उपकरण महत्वपूर्ण है। हालांकि यह विशेष रूप से लाइटहाउस पर भरोसा नहीं करना महत्वपूर्ण है, एक आधार रेखा के रूप में 100% स्कोर बहुत मददगार है। + +✅ अपने ब्राउज़र के डेवलपर टूल पैनल में लाइटहाउस ढूंढें और किसी भी साइट पर विश्लेषण चलाएं। आपको क्या मिला ? + +## पहुंच के लिए डिजाइनिंग + +पहुँच एक अपेक्षाकृत बड़ा विषय है। आपकी सहायता करने के लिए, कई संसाधन उपलब्ध हैं। + +- [सुलभ यू - मिनेसोटा विश्वविद्यालय](https://accessibility.umn.edu/your-role/web-wevelopmentation) + +हालांकि हम सुलभ साइटों को बनाने के हर पहलू को कवर नहीं कर पाएंगे, नीचे कुछ मुख्य सिद्धांत हैं जिन्हें आप लागू करना चाहते हैं। प्रारंभ से एक सुलभ पृष्ठ डिजाइन करना **हमेशा** सुलभ है और इसे सुलभ बनाने के लिए मौजूदा पृष्ठ पर वापस जाना आसान है। + +## अच्छे प्रदर्शन के सिद्धांत + +### रंग सुरक्षित पट्टियाँ + +लोग दुनिया को विभिन्न तरीकों से देखते हैं, और इसमें रंग शामिल हैं। अपनी साइट के लिए एक रंग योजना का चयन करते समय, आपको यह सुनिश्चित करना चाहिए कि यह सभी के लिए सुलभ हो। रंग पट्टियाँ बनाने के लिए एक महान [टूल कलर सेफ है](http://colorsafe.co/)। + +✅ एक वेब साइट की पहचान करें जो रंग के उपयोग में बहुत समस्याग्रस्त है। क्यों? + +### सही HTML का उपयोग करें + +सीएसएस और जावास्क्रिप्ट के साथ किसी भी तत्व को किसी भी प्रकार के नियंत्रण की तरह बनाना संभव है। `` का उपयोग एक `