Sally Ride's Packing List
+Sally Ride lista za pakovanje
{person.name}: {' ' + person.profession + ' '} - known for {person.accomplishment} + poznat je zbog {person.accomplishment}
); @@ -402,31 +402,31 @@ export const people = [{ id: 0, name: 'Creola Katherine Johnson', profession: 'mathematician', - accomplishment: 'spaceflight calculations', + accomplishment: 'formula za svemirske letove', imageId: 'MK3eW3A' }, { id: 1, name: 'Mario José Molina-Pasquel Henríquez', profession: 'chemist', - accomplishment: 'discovery of Arctic ozone hole', + accomplishment: 'otkriće Arktičke rupe u ozonu', imageId: 'mynHUSa' }, { id: 2, name: 'Mohammad Abdus Salam', profession: 'physicist', - accomplishment: 'electromagnetism theory', + accomplishment: 'teorija o elektromagnetizmu', imageId: 'bE7W1ji' }, { id: 3, name: 'Percy Lavon Julian', profession: 'chemist', - accomplishment: 'pioneering cortisone drugs, steroids and birth control pills', + accomplishment: 'pionirski kortizon, steroide i pilule za kontrolu rađanja', imageId: 'IOjWm71' }, { id: 4, name: 'Subrahmanyan Chandrasekhar', profession: 'astrophysicist', - accomplishment: 'white dwarf star mass calculations', + accomplishment: 'računanje mase belog patuljka', imageId: 'lrWQx8l' }]; ``` @@ -458,18 +458,19 @@ h2 { font-size: 20px; }Tea cup for guest #{guest}
; + returnŠolja čaja za gosta #{guest}
; } export default function TeaSet() { @@ -495,13 +496,13 @@ export default function TeaSet() {Tea cup for guest #{guest}
; + returnŠolja čaja za gosta #{guest}
; } export default function TeaSet() { @@ -519,12 +520,13 @@ export default function TeaSet() {
-
);
}
```
-Notice that `Welcome to my app
+Dobrodošli u moj app
-
);
@@ -73,49 +73,49 @@ export default function MyApp() {
Welcome to my app
+Dobrodošli u moj app
`. Your component also can't return multiple JSX tags. You have to wrap them into a shared parent, like a `
...
` or an empty `<>...` wrapper:
+JSX je striktniji od HTML-a. Morate zatvoriti tagove poput ``. Vaša komponenta takođe ne može vraćati više JSX tagova. Morate ih obuhvatiti zajedničkim parent-om, poput `
...
` ili praznog `<>...` omotača:
```js {3,6}
function AboutPage() {
return (
<>
- About
-Hello there.
How do you do?
O nama
+Zdravo
Kako se ste?
@@ -209,7 +209,7 @@ If you prefer more compact code, you can use the [conditional `?` operator.](htt
```
-When you don't need the `else` branch, you can also use a shorter [logical `&&` syntax](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_AND#short-circuit_evaluation):
+Kada vam nije potrebna `else` grana, možete koristiti i kraću [logičku `&&` sintaksu](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_AND#short-circuit_evaluation):
```js
@@ -217,23 +217,23 @@ When you don't need the `else` branch, you can also use a shorter [logical `&&`
```
-All of these approaches also work for conditionally specifying attributes. If you're unfamiliar with some of this JavaScript syntax, you can start by always using `if...else`.
+Svi ovi pristupi takođe rade i za kondicionalno specificiranje atributa. Ako niste upoznati sa oovim delovima JavaScript sintakse, možete početi tako što ćete uvek koristiti `if...else`.
-## Rendering lists {/*rendering-lists*/}
+## Renderovanje listi {/*rendering-lists*/}
-You will rely on JavaScript features like [`for` loop](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for) and the [array `map()` function](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map) to render lists of components.
+Oslanjaćete se na JavaScript funkcionalnosti poput [`for` loop-a](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for) i [array `map()` funkcije](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map) za renderovanje listi komponenata.
-For example, let's say you have an array of products:
+Na primer, pretpostavimo da imate niz proizvoda:
```js
const products = [
- { title: 'Cabbage', id: 1 },
- { title: 'Garlic', id: 2 },
- { title: 'Apple', id: 3 },
+ { title: 'Kupus', id: 1 },
+ { title: 'Luk', id: 2 },
+ { title: 'Jabuka', id: 3 },
];
```
-Inside your component, use the `map()` function to transform an array of products into an array of `
-
@@ -364,7 +364,7 @@ function MyButton() {
return (
);
}
@@ -379,59 +379,59 @@ button {
Counters that update separately
+Brojači koji se ažuriraju nezavisno
-
@@ -451,12 +451,12 @@ export default function MyApp() {
}
function MyButton() {
- // ... we're moving code from here ...
+ // ... premestamo kod odavde ...
}
```
-Then, *pass the state down* from `MyApp` to each `MyButton`, together with the shared click handler. You can pass information to `MyButton` using the JSX curly braces, just like you previously did with built-in tags like `Counters that update separately
+Brojači koji se ažuriraju odvojeno
-
@@ -476,21 +476,21 @@ export default function MyApp() {
}
```
-The information you pass down like this is called _props_. Now the `MyApp` component contains the `count` state and the `handleClick` event handler, and *passes both of them down as props* to each of the buttons.
+Informacije koje na ovaj način prosleđujete nazivaju se *props*. Sada `MyApp` komponenta sadrži `count` state i `handleClick` event handler, i *prosleđuje obe nadole kao props* svakom od dugmeta.
-Finally, change `MyButton` to *read* the props you have passed from its parent component:
+Konačno, promenite `MyButton` da *čita* props koje ste prosledili iz njegove parent komponente:
```js {1,3}
function MyButton({ count, onClick }) {
return (
);
}
```
-When you click the button, the `onClick` handler fires. Each button's `onClick` prop was set to the `handleClick` function inside `MyApp`, so the code inside of it runs. That code calls `setCount(count + 1)`, incrementing the `count` state variable. The new `count` value is passed as a prop to each button, so they all show the new value. This is called "lifting state up". By moving state up, you've shared it between components.
+Kada kliknete na dugme, `onClick` handler se aktivira.`onClick` prop svakog dugmeta postavljen je na funkciju `handleClick` unutar `MyApp` pa se kod unutar nje izvršava. Taj kod poziva `setCount(count + 1)`, inkrementira `count` state varijablu. Nova `count` vrednost se prosleđuje kao prop svakom dugmetu, pa svi prikazuju novu vrednost. Ovo se naziva "podizanje state-a nagore". Pomeranjema state-a nagore, podelili ste ga između komponenata.
Counters that update together
+Brojači koji se ažuriraju zajedno
-
@@ -516,7 +516,7 @@ export default function MyApp() {
function MyButton({ count, onClick }) {
return (
);
}
@@ -531,8 +531,8 @@ button {