Summary  
This chapter covers installing an external JavaScript library into a React project using npm and verifying the addition by inspecting the project’s dependencies in package.json.

General domain of usage  
Client-side routing in single-page web applications

## Asennus
Aloittaaksesi **React Router** -kirjaston käytön, se täytyy ensin asentaa projektiin käyttämällä pakettienhallintaa, kuten npm tai yarn. Avaa terminaali projektihakemistossa ja suorita seuraava komento:
Käyttäen npm:ää:
```bash
npm install react-router-dom
```

## Asennuksen tarkistaminen
Nyt kun `react-router-dom` -paketti on asennettu, tarkistetaan, että se on lisätty projektiin onnistuneesti. Tämä tehdään tarkastelemalla `package.json` -tiedostoa, jossa luetellaan projektin riippuvuudet.

Oletuksena `package.json`-tiedoston dependencies-objekti sisältää vain ne paketit, joita tarvitaan tavallisen React-projektin suorittamiseen ja määrittämiseen. Se voi näyttää esimerkiksi tältä:
```js
"dependencies": {
  "@testing-library/jest-dom": "^5.16.5",
  "@testing-library/react": "^13.4.0",
  "@testing-library/user-event": "^13.5.0",
  "react": "^18.2.0",
  "react-dom": "^18.2.0",
  "react-scripts": "5.0.1",
  "web-vitals": "^2.1.4"
},
```
Kun `react-router-dom` -paketti on lisätty, dependencies-objekti sisältää myös `react-router-dom` -paketin (kuten rivillä 7):
```js
"dependencies": {
  "@testing-library/jest-dom": "^5.16.5",
  "@testing-library/react": "^13.4.0",
  "@testing-library/user-event": "^13.5.0",
  "react": "^18.2.0",
  "react-dom": "^18.2.0",
  "react-router-dom": "^6.13.0",
  "react-scripts": "5.0.1",
  "web-vitals": "^2.1.4"
},
```

Mikä paketti täytyy asentaa, jotta React Router -kirjastoa voidaan käyttää?

Opi hallitsemaan navigointia React-sovelluksissa käyttämällä React Routeria. Ymmärrä URL-osoitteiden rakenne ja reitityksen merkitys verkkosovelluksissa. Ota käyttöön React Router monisivuisen sovelluksen luomiseksi, jossa dynaaminen sisältö perustuu URL-polkuun. Hyödynnä edistyneitä ominaisuuksia, kuten kyselymerkkijonoja ja URL-parametreja, sovelluksen tilan ja käyttäjän navigoinnin hallintaan.

Opi teoreettiset perusteet käsitteille kuten URL, verkkotunnus, protokolla, kyselyparametrit ja muut. Ymmärrä reitityksen merkitys verkkosovelluksissa sekä syyt React Router -kirjaston tarpeellisuudelle.

Opi luomaan kokonainen React-sovellus alusta alkaen, jossa sisällön näyttäminen mukautuu URL-osoitteen perusteella React Router -toiminnallisuuden avulla.

Perehdy kyselymerkkijonojen käyttöön sovelluksen tilan jakamisessa ja hallinnassa URL-osoitteiden kautta, työskentele erilaisten tietotyyppien kanssa kyselyparametreissa sekä hyödynnä React Routeria navigointiin ja URL-muutoksiin perustuvien vaikutusten hallintaan.

React Routerin Asentaminen

Asennus

Asennuksen tarkistaminen

Awesome!

React Routerin Asentaminen

Asennus

Asennuksen tarkistaminen