Skip to content

Installation + Start a New React Project translation #7

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.

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

Merged
merged 1 commit into from
May 24, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/components/MDX/ExpandableCallout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ const variantMap = {
'linear-gradient(rgba(249, 247, 243, 0), rgba(249, 247, 243, 1)',
},
note: {
title: 'Note',
title: 'Napomena',
Icon: IconNote,
containerClasses:
'bg-green-5 dark:bg-green-60 dark:bg-opacity-20 text-primary dark:text-primary-dark text-lg',
Expand Down
6 changes: 3 additions & 3 deletions src/components/MDX/ExpandableExample.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -71,13 +71,13 @@ function ExpandableExample({children, excerpt, type}: ExpandableExampleProps) {
{isDeepDive && (
<>
<IconDeepDive className="inline mr-2 dark:text-purple-30 text-purple-40" />
Deep Dive
Istražite dublje
</>
)}
{isExample && (
<>
<IconCodeBlock className="inline mr-2 dark:text-yellow-30 text-yellow-50" />
Example
Primer
</>
)}
</h5>
Expand All @@ -101,7 +101,7 @@ function ExpandableExample({children, excerpt, type}: ExpandableExampleProps) {
<span className="mr-1">
<IconChevron displayDirection={isExpanded ? 'up' : 'down'} />
</span>
{isExpanded ? 'Hide Details' : 'Show Details'}
{isExpanded ? 'Sakrij Detaljnije' : 'Prikaži detaljnije'}
</Button>
</summary>
<div
Expand Down
2 changes: 1 addition & 1 deletion src/components/MDX/MDXComponents.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -173,7 +173,7 @@ function YouWillLearn({
children: any;
isChapter?: boolean;
}) {
let title = isChapter ? 'In this chapter' : 'You will learn';
let title = isChapter ? 'U ovom poglavlju:' : 'Naučićete:';
return <SimpleCallout title={title}>{children}</SimpleCallout>;
}

Expand Down
41 changes: 21 additions & 20 deletions src/content/learn/installation.md
Original file line number Diff line number Diff line change
@@ -1,57 +1,58 @@
---
title: Installation
title: Instalacija
---

<Intro>

React has been designed from the start for gradual adoption. You can use as little or as much React as you need. Whether you want to get a taste of React, add some interactivity to an HTML page, or start a complex React-powered app, this section will help you get started.
React je dizajniran od početka za postepeno usvajanje. Možete koristiti koliko god React-a želite. Bez obzira da li želite da probate React, dodate neku interaktivnost na HTML stranicu, ili da započnete kompleksnu React aplikaciju, ova sekcija će vam pomoći da počnete.


</Intro>

<YouWillLearn isChapter={true}>

* [How to start a new React project](/learn/start-a-new-react-project)
* [How to add React to an existing project](/learn/add-react-to-an-existing-project)
* [How to set up your editor](/learn/editor-setup)
* [How to install React Developer Tools](/learn/react-developer-tools)
* [Kako započeti novi React projekat](/learn/start-a-new-react-project)
* [Kako dodati React na postojeći projekat](/learn/add-react-to-an-existing-project)
* [Kako da konfigurišete vaš editor](/learn/editor-setup)
* [Kako da instalirate React Developer tools](/learn/react-developer-tools)

</YouWillLearn>

## Try React {/*try-react*/}
## Isprobajte React {/*try-react*/}

You don't need to install anything to play with React. Try editing this sandbox!
Ne morate ništa instalirati da bi ste se igrali sa React-om. Probajte da izmenite ovaj sandbox!

<Sandpack>

```js
function Greeting({ name }) {
return <h1>Hello, {name}</h1>;
return <h1>Zdravo, {name}</h1>;
}

export default function App() {
return <Greeting name="world" />
return <Greeting name="svet" />
}
```

</Sandpack>

You can edit it directly or open it in a new tab by pressing the "Fork" button in the upper right corner.
Možete ga direktno menjati ili otvoriti u novom tabu pritiskom na "Fork" dugme u gornjem desnom uglu.

Most pages in the React documentation contain sandboxes like this. Outside of the React documentation, there are many online sandboxes that support React: for example, [CodeSandbox](https://codesandbox.io/s/new), [StackBlitz](https://stackblitz.com/fork/react), or [CodePen.](https://codepen.io/pen?&editors=0010&layout=left&prefill_data_id=3f4569d1-1b11-4bce-bd46-89090eed5ddb)
Većina stranica u React dokumentaciji sadrži sandbokse kao ovaj. Van React dokumentacije, postoje mnogi online sandboksi koji podržavaju React: na primer, [CodeSandbox](https://codesandbox.io/s/new), [StackBlitz](https://stackblitz.com/fork/react), ili [CodePen.](https://codepen.io/pen?&editors=0010&layout=left&prefill_data_id=3f4569d1-1b11-4bce-bd46-89090eed5ddb)

### Try React locally {/*try-react-locally*/}
### Isprobajte React lokalno {/*try-react-locally*/}

To try React locally on your computer, [download this HTML page.](https://gist.githubusercontent.com/gaearon/0275b1e1518599bbeafcde4722e79ed1/raw/db72dcbf3384ee1708c4a07d3be79860db04bff0/example.html) Open it in your editor and in your browser!
Da isprobate React lokalno na vašem računaru, [preuzmite ovu HTML stranicu.](https://gist.githubusercontent.com/gaearon/0275b1e1518599bbeafcde4722e79ed1/raw/db72dcbf3384ee1708c4a07d3be79860db04bff0/example.html) Otvorite je u vašem editoru i u vašem pretraživaču!

## Start a new React project {/*start-a-new-react-project*/}
## Započnite novi React projekat {/*start-a-new-react-project*/}

If you want to build an app or a website fully with React, [start a new React project.](/learn/start-a-new-react-project)
Ako želite da napravite aplikaciju ili sajt koristeći samo React, [zapocnite novi React projekat.](/learn/start-a-new-react-project)

## Add React to an existing project {/*add-react-to-an-existing-project*/}
## Dodajte React u postojeći projekat {/*add-react-to-an-existing-project*/}

If want to try using React in your existing app or a website, [add React to an existing project.](/learn/add-react-to-an-existing-project)
Ako žeite da isprobate React u vašem postojećem sajtu ili aplikaciji, [dodajte React u postojeći projekat.](/learn/add-react-to-an-existing-project)

## Next steps {/*next-steps*/}
## Sledeći koraci {/*next-steps*/}

Head to the [Quick Start](/learn) guide for a tour of the most important React concepts you will encounter every day.
Idite na [Brzi Start](/learn) vodič za turu najvažnijih React koncepta sa kojima ćete se susretati svakodnevno.

Loading