New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Translate your first component #349

Open

Dlurak wants to merge 1 commit into reactjs:main from Dlurak:your-first-component

+102 −99

Contributor

Dlurak commented Oct 6, 2023

No description provided.


          Translate your first component

48c1108

vercel bot deployed to Preview – de-react-dev

October 6, 2023 21:19

View deployment

Contributor Author

Dlurak commented Oct 11, 2023

Hello, I'd simply like to ensure my pull requests aren't overlooked. At least some kind of feedback would be nice ;)

Collaborator

ChrisB9 commented Oct 12, 2023

Hi Dlurak,
your PR isnt overlooked, and thank you for sending it in. Ill try to take care of it as soon as I have enough time - earliest this weekend

ph1p requested changes

View reviewed changes

Member

ph1p left a comment

Thank you @Dlurak :) Please have a look at my suggestions.
I have converted the code parts back to the original code (without comments etc.), because of #4 (comment)

src/content/learn/your-first-component.md

    
            @@ -51,16 +52,16 @@ Just like with HTML tags, you can compose, order and nest components to design w
          
              </PageLayout>

              ```

              As your project grows, you will notice that many of your designs can be composed by reusing components you already wrote, speeding up your development. Our table of contents above could be added to any screen with `<TableOfContents />`! You can even jumpstart your project with the thousands of components shared by the React open source community like [Chakra UI](https://chakra-ui.com/) and [Material UI.](https://material-ui.com/)

              Wenn den Projekt wächst, wirst du meken, dass viele deiner Designs durch das Wiederverwenden von Komponenten, die du bereits geschrieben hast, zusammengesetzt werden können was deinen Entwicklungsprozess beschleunigt. Unser Inhaltsverzeichnis oben könnte zu jeder Seite mit `<TableOfContents />` hinzugefügt werden! Du kannst deinem Projekt sogar mit tausenden Komponenten, die von der React Open Source Community geteilt werden, auf die Sprünge helfen, wie [Chakra UI](https://chakra-ui.com/) und [Material UI](https://material-ui.com/).

Member

ph1p Nov 21, 2023

Suggested change

      
            Wenn den Projekt wächst, wirst du meken, dass viele deiner Designs durch das Wiederverwenden von Komponenten, die du bereits geschrieben hast, zusammengesetzt werden können was deinen Entwicklungsprozess beschleunigt. Unser Inhaltsverzeichnis oben könnte zu jeder Seite mit `<TableOfContents />` hinzugefügt werden! Du kannst deinem Projekt sogar mit tausenden Komponenten, die von der React Open Source Community geteilt werden, auf die Sprünge helfen, wie [Chakra UI](https://chakra-ui.com/) und [Material UI](https://material-ui.com/).
          
            Wenn das Projekt wächst, wirst du merken, dass viele deiner Designs durch das Wiederverwenden von Komponenten, die du bereits geschrieben hast, zusammengesetzt werden können, was deinen Entwicklungsprozess beschleunigt. Unser Inhaltsverzeichnis oben könnte zu jeder Seite mit `<TableOfContents />` hinzugefügt werden! Du kannst deinem Projekt sogar mit tausenden Komponenten, die von der React Open Source Community geteilt werden, auf die Sprünge helfen, wie [Chakra UI](https://chakra-ui.com/) und [Material UI](https://material-ui.com/).

src/content/learn/your-first-component.md

@@ @@ -1,41 +1,42 @@ @@
               ---
-              title: Your First Component
+              title: Deine Erste Komponente

Member

ph1p Nov 21, 2023

Suggested change

      
            title: Deine Erste Komponente
          
            title: Deine erste Komponente

Contributor Author

Dlurak Nov 21, 2023

On English every word is capitalized.
I think it would be appropriate to also capitalize every word on German for this reason.

Member

ph1p Nov 22, 2023

You can do that in English, but it's wrong in German. I can't think of a spelling rule for it now. Do you have a link for me?

src/content/learn/your-first-component.md

    
              On the Web, HTML lets us create rich structured documents with its built-in set of tags like `<h1>` and `<li>`:

              Im Web erlaubt HTML uns strukturierte Dokumente mit den eingebauten Tags wie `<h1>` und `<li>` zu erstellen:

Member

ph1p Nov 21, 2023

Suggested change

      
            Im Web erlaubt HTML uns strukturierte Dokumente mit den eingebauten Tags wie `<h1>` und `<li>` zu erstellen:
          
            Im Web erlaubt HTML uns, strukturierte Dokumente mit den eingebauten Tags wie `<h1>` und `<li>` zu erstellen:

src/content/learn/your-first-component.md

               ```html
               <article>
-                <h1>My First Component</h1>
+                <h1>Meine Erste Komponente</h1>

Member

ph1p Nov 21, 2023

Suggested change

      
              <h1>Meine Erste Komponente</h1>
          
              <h1>Meine erste Komponente</h1>

src/content/learn/your-first-component.md

-                  <li>Defining a Component</li>
-                  <li>Using a Component</li>
+                  <li>Komponenten: UI Bausteine</li>
+                  <li>Eine Komponente Definieren</li>

Member

ph1p Nov 21, 2023

Suggested change

      
                <li>Eine Komponente Definieren</li>
          
                <li>Eine Komponente definieren</li>

src/content/learn/your-first-component.md

    
            @@ -286,25 +289,25 @@ img { height: 181px; }
          
              </Sandpack>

              You might be wondering why writing `export` alone is not enough to fix this example. You can learn the difference between `export` and `export default` in [Importing and Exporting Components.](/learn/importing-and-exporting-components)

              Vielleicht fragst du dich, warum es nicht reicht nur `export` zu schreiben. Den Unterschied zwischen `export` und `export default` lernst du in [Importieren und Exportieren von Komponenten.](/learn/importing-and-exporting-components)

Member

ph1p Nov 21, 2023

Suggested change

      
            Vielleicht fragst du dich, warum es nicht reicht nur `export` zu schreiben. Den Unterschied zwischen `export` und `export default` lernst du in [Importieren und Exportieren von Komponenten.](/learn/importing-and-exporting-components)
          
            Vielleicht fragst du dich, warum es nicht reicht, nur `export` zu schreiben. Den Unterschied zwischen `export` und `export default` lernst du im [Importieren und Exportieren von Komponenten.](/learn/importing-and-exporting-components)

src/content/learn/your-first-component.md

    
              <Hint>

              You may get an "Unexpected token" error while trying to fix this. In that case, check that the semicolon appears *after* the closing parenthesis. Leaving a semicolon inside `return ( )` will cause an error.

              Eventuell bekommst du einen "Unexpected token" Fehler während du versuchst das zu korrigieren. In diesem Fall, überprüfe, dass das Semikolon *nach* der schließenden Klammer steht. Ein Semikolon innerhalb von `return ( )` zu lassen wird einen Fehler verursachen.

Member

ph1p Nov 21, 2023

Suggested change

      
            Eventuell bekommst du einen "Unexpected token" Fehler während du versuchst das zu korrigieren. In diesem Fall, überprüfe, dass das Semikolon *nach* der schließenden Klammer steht. Ein Semikolon innerhalb von `return ( )` zu lassen wird einen Fehler verursachen.
          
            Eventuell bekommst du einen "Unexpected token" Fehler, während du versuchst, das zu korrigieren. In diesem Fall überprüfe, dass das Semikolon *nach* der schließenden Klammer steht. Ein Semikolon innerhalb von `return ( )` zu lassen, wird einen Fehler verursachen.

src/content/learn/your-first-component.md

    
              Something's wrong with how the `Profile` component is declared and used. Can you spot the mistake? (Try to remember how React distinguishes components from the regular HTML tags!)

              Irgendetwas stimmt mit der Deklaration und Nutzung der `Profil` Komponente nicht. Kannst du den Fehler finden? (Versuche dich daran zu erinnern, wie sich React Komponenten von regulären HTML Tags unterscheidet!)

Member

ph1p Nov 21, 2023

Suggested change

      
            Irgendetwas stimmt mit der Deklaration und Nutzung der `Profil` Komponente nicht. Kannst du den Fehler finden? (Versuche dich daran zu erinnern, wie sich React Komponenten von regulären HTML Tags unterscheidet!)
          
            Irgendetwas stimmt mit der Deklaration und Nutzung der `Profile` Komponente nicht. Kannst du den Fehler finden? (Versuche dich daran zu erinnern, wie sich React Komponenten von regulären HTML-Tags unterscheiden!)

src/content/learn/your-first-component.md

@@ @@ -393,14 +396,14 @@ img { margin: 0 10px 10px 0; height: 90px; } @@
               <Solution>
-              React component names must start with a capital letter.
+              React Komponenten müssen mit einem Großbuchstaben beginnen.

Member

ph1p Nov 21, 2023

Suggested change

      
            React Komponenten müssen mit einem Großbuchstaben beginnen.
          
            React-Komponenten müssen mit einem Großbuchstaben beginnen.

src/content/learn/your-first-component.md

    
              Write a component from scratch. You can give it any valid name and return any markup. If you're out of ideas, you can write a `Congratulations` component that shows `<h1>Good job!</h1>`. Don't forget to export it!

              Schreibe deine eigene Komponente von Grund auf. Du kannst ihr irgendeinen zulässigen Namen geben und irgendwelches Markup zurückgeben. Wenn du keine Idee hast, kannst du eine `Gratulation` Kompontente schreiben, die `<h1>Gute Arbeit!</h1>` anzeigt. Vergiss nicht sie zu exportieren!

Member

ph1p Nov 21, 2023

Suggested change

      
            Schreibe deine eigene Komponente von Grund auf. Du kannst ihr irgendeinen zulässigen Namen geben und irgendwelches Markup zurückgeben. Wenn du keine Idee hast, kannst du eine `Gratulation` Kompontente schreiben, die `<h1>Gute Arbeit!</h1>` anzeigt. Vergiss nicht sie zu exportieren!
          
            Schreibe deine eigene Komponente von Grund auf. Du kannst ihr irgendeinen zulässigen Namen geben und irgendwelches Markup zurückgeben. Wenn du keine Idee hast, kannst du eine `Gratulation` Komponente schreiben, die `<h1>Gute Arbeit!</h1>` anzeigt. Vergiss nicht, sie zu exportieren!

ph1p self-assigned this

ph1p added the needs review from author label

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

needs review from author