|
|
[](https://github.com/microsoft/Web-Dev-For-Beginners/blob/master/LICENSE)
|
|
|
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/)
|
|
|
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/)
|
|
|
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/)
|
|
|
[](http://makeapullrequest.com)
|
|
|
|
|
|
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/)
|
|
|
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/)
|
|
|
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/stargazers/)
|
|
|
|
|
|
[](https://discord.gg/nTYy5BXMWG)
|
|
|
|
|
|
# Verkkokehitys aloittelijoille - Opetussuunnitelma
|
|
|
|
|
|
Opi verkkokehityksen perusteet 12 viikon kattavalla kurssillamme, jonka on kehittänyt Microsoft Cloud Advocates. Jokainen 24 oppitunnista syventyy JavaScriptiin, CSS:ään ja HTML:ään käytännön projektien kautta, kuten terrariumeihin, selaimen laajennuksiin ja avaruuspeliin. Osallistu visoihin, keskusteluihin ja käytännön tehtäviin. Kehitä taitojasi ja optimoi tiedon säilytyskykyä tehokkaan projektipohjaisen opetusmetodimme avulla. Aloita koodausmatkasi jo tänään!
|
|
|
|
|
|
Liity Azure AI Foundry Discord -yhteisöön
|
|
|
|
|
|
[](https://discord.gg/nTYy5BXMWG)
|
|
|
|
|
|
Noudata näitä vaiheita päästäksesi alkuun näiden resurssien kanssa:
|
|
|
1. **Haarauta repositorio**: Klikkaa [](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
|
|
|
2. **Kloonaa repositorio**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
|
|
|
3. [**Liity Azure AI Foundry Discordiin ja tapaa asiantuntijoita ja muita kehittäjiä**](https://discord.com/invite/ByRwuEEgH4)
|
|
|
|
|
|
### 🌐 Monikielinen tuki
|
|
|
|
|
|
#### Tuettu GitHub Actionin kautta (automaattinen ja aina ajan tasalla)
|
|
|
|
|
|
<!-- CO-OP TRANSLATOR LANGUAGES TABLE START -->
|
|
|
[Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](./README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md)
|
|
|
|
|
|
> **Haluatko kloonata paikallisesti?**
|
|
|
|
|
|
> Tässä repositoriossa on yli 50 käännöstä, mikä lisää merkittävästi latauskoon. Jos haluat kloonata ilman käännöksiä, käytä sparse checkoutia:
|
|
|
> ```bash
|
|
|
> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
|
|
|
> cd Web-Dev-For-Beginners
|
|
|
> git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'
|
|
|
> ```
|
|
|
> Tämä antaa sinulle kaiken, mitä tarvitset kurssin suorittamiseen huomattavasti nopeammalla latauksella.
|
|
|
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
|
|
|
|
|
|
**Jos haluat lisätä tuettuja käännöskieliä, ne on listattu [tässä](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
|
|
|
|
|
|
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
|
|
|
|
|
|
#### 🧑🎓 _Oletko opiskelija?_
|
|
|
|
|
|
Vieraile [**Student Hub -sivulla**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), josta löydät aloittelijan resurssit, opiskelijapaketit ja jopa tapoja saada ilmainen sertifikaattikuponki. Tämä on sivu, jonka haluat tallentaa kirjanmerkkeihin ja tarkistaa säännöllisesti, sillä sisältöä vaihdetaan kuukausittain.
|
|
|
|
|
|
### 📣 Ilmoitus – Uusia GitHub Copilot Agent -tilan haasteita suoritettavaksi!
|
|
|
|
|
|
Uusi haaste lisätty, katso "GitHub Copilot Agent Challenge 🚀" useimmista luvuista. Tämä on uusi haaste, jonka voit suorittaa käyttämällä GitHub Copilotia ja Agent-tilaa. Jos et ole aiemmin käyttänyt Agent-tilaa, se pystyy paitsi generoimaan tekstiä, myös luomaan ja muokkaamaan tiedostoja, suorittamaan komentoja ja muuta.
|
|
|
|
|
|
### 📣 Ilmoitus – _Uusi generatiiviseen tekoälyyn perustuva projekti rakennettavaksi_
|
|
|
|
|
|
Uusi AI-avustajaprojekti juuri lisätty, tutustu [projektiin](./9-chat-project/README.md)
|
|
|
|
|
|
### 📣 Ilmoitus – _Uusi Generative AI -opetussuunnitelma JavaScriptille julkaistu_
|
|
|
|
|
|
Älä jää paitsi uudesta Generative AI -opetussuunnitelmastamme!
|
|
|
|
|
|
Aloita [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)
|
|
|
|
|
|
|
|
|
|
|
|
- Oppitunteja perusteista RAG-malliin asti.
|
|
|
- Keskustele historiallisten hahmojen kanssa GenAI:n ja kumppanisovelluksemme avulla.
|
|
|
- Hauska ja mukaansatempaava tarinankerronta, matkustat ajassa!
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Jokainen oppitunti sisältää tehtävän suoritettavaksi, tietokokeen ja haasteen, jotka ohjaavat sinua oppimaan aiheita, kuten:
|
|
|
- Promptauksen ja promptinsuunnittelun perusteet
|
|
|
- Teksti- ja kuvapohjaiset sovellukset
|
|
|
- Hakusovellukset
|
|
|
|
|
|
Aloita täällä: [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course)
|
|
|
|
|
|
## 🌱 Aloittaminen
|
|
|
|
|
|
> **Opettajat**, olemme [sisällyttäneet ehdotuksia](for-teachers.md) tämän opetussuunnitelman käyttöön. Toivomme palautettasi [keskustelufoorumissamme](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
|
|
|
|
|
|
**[Oppijat](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, aloita jokainen oppitunti ennakkokyselyllä ja jatka luentomateriaalin lukemisella, suorita erilaiset aktiviteetit ja testaa ymmärryksesi jälkikyselyllä.
|
|
|
|
|
|
Paranna oppimiskokemustasi liittymällä vertaistesi seuraan projekteissa! Keskustelut ovat tervetulleita [keskustelufoorumillamme](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), jossa moderaattoritiimimme vastaa kysymyksiisi.
|
|
|
|
|
|
Syvennä osaamistasi tutustumalla myös [Microsoft Learniin](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) lisäopetusmateriaaleja varten.
|
|
|
|
|
|
### 📋 Ympäristön asennus
|
|
|
|
|
|
Tämän opetussuunnitelman kehitysympäristö on valmiina! Aloittaessasi voit valita suorittaa opetussuunnitelman [Codespacessa](https://github.com/features/codespaces/) (_selaimessa toimiva, ei asennuksia vaativa ympäristö_) tai paikallisesti tietokoneellasi tekstieditorilla, kuten [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
|
|
|
|
|
|
#### Luo oma repositoriosi
|
|
|
Jotta voit helposti tallentaa työsi, suosittelemme luomaan oman kopion tästä repositoriosta. Voit tehdä tämän painamalla sivun yläreunassa olevaa **Use this template** -painiketta. Tämä luo uuden repositorion GitHub-tilillesi, joka sisältää kopion opetussuunnitelmasta.
|
|
|
|
|
|
Noudata näitä ohjeita:
|
|
|
1. **Haarauta repositorio**: Klikkaa tämän sivun oikeassa yläkulmassa olevaa "Fork"-painiketta.
|
|
|
2. **Kloonaa repositorio**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
|
|
|
|
|
|
#### Opetussuunnitelman suorittaminen Codespacessa
|
|
|
|
|
|
Oman kopion repositoriosta luomasi jälkeen napsauta **Code**-painiketta ja valitse **Open with Codespaces**. Tämä luo sinulle uuden Codespace-ympäristön työskennellä.
|
|
|
|
|
|
|
|
|
|
|
|
#### Opetussuunnitelman suorittaminen paikallisesti tietokoneellasi
|
|
|
|
|
|
Jos haluat suorittaa opetussuunnitelman paikallisesti tietokoneellasi, tarvitset tekstieditorin, selaimen ja komentorivityökalun. Ensimmäinen oppituntimme, [Johdanto ohjelmointikieliin ja työkaluihin](../../1-getting-started-lessons/1-intro-to-programming-languages), opastaa sinut eri vaihtoehtojen pariin, jotta voit valita itsellesi sopivimmat työkalut.
|
|
|
|
|
|
Suosittelemme käyttämään tekstieditorina [Visual Studio Codea](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon), joka sisältää myös sisäänrakennetun [Komentorivin](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Voit ladata Visual Studio Coden [tästä](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
|
|
|
|
|
|
1. Kloonaa oma repositorio tietokoneellesi. Voit tehdä tämän klikkaamalla **Code**-painiketta ja kopioimalla URL-osoitteen:
|
|
|
|
|
|
[CodeSpace](./images/createcodespace.png)
|
|
|
Sitten avaa [Pääte](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) Visual Studio Codessa [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ja suorita seuraava komento korvaten `<your-repository-url>` juuri kopioimallasi URL-osoitteella:
|
|
|
|
|
|
```bash
|
|
|
git clone <your-repository-url>
|
|
|
```
|
|
|
|
|
|
2. Avaa kansio Visual Studio Codessa. Voit tehdä tämän valitsemalla **Tiedosto** > **Avaa kansio** ja valitsemalla juuri kloonaamasi kansion.
|
|
|
|
|
|
|
|
|
> Suositellut Visual Studio Code -laajennukset:
|
|
|
>
|
|
|
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - esikatsele HTML-sivuja suoraan Visual Studio Codessa
|
|
|
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - auttaaksesi sinua kirjoittamaan koodia nopeammin
|
|
|
|
|
|
## 📂 Jokainen oppitunti sisältää:
|
|
|
|
|
|
- valinnaisen luonnosmuistion
|
|
|
- valinnaisen lisävideon
|
|
|
- ennakkolämmittelykyselyn ennen oppituntia
|
|
|
- kirjallisen oppitunnin
|
|
|
- projektilähtöisissä oppitunneissa vaiheittaiset ohjeet projektin rakentamiseen
|
|
|
- tietotestin
|
|
|
- haasteen
|
|
|
- lisälukemista
|
|
|
- tehtävän
|
|
|
- [oppitunnin jälkeisen kyselyn](https://ff-quizzes.netlify.app/web/)
|
|
|
|
|
|
> **Huomio kyselyistä**: Kaikki kyselyt löytyvät Quiz-app-kansiosta, yhteensä 48 kyselyä joissa jokaisessa kolme kysymystä. Ne ovat saatavilla [tässä](https://ff-quizzes.netlify.app/web/). Kyselysovelluksen voi ajaa paikallisesti tai julkaista Azureen; noudata ohjeita `quiz-app`-kansiossa.
|
|
|
|
|
|
## 🗃️ Oppitunnit
|
|
|
|
|
|
| | Projektin nimi | Opitut käsitteet | Oppimistavoitteet | Linkitetty oppitunti | Tekijä |
|
|
|
| :-: | :-------------------------------------------------------: | :--------------------------------------------------------------------: | -------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
|
|
|
| 01 | Aloittaminen | Johdanto ohjelmointiin ja työkaluihin | Opettele lähes kaikkien ohjelmointikielten perusperiaatteet sekä ohjelmistot jotka auttavat ammattilaisia työnsä tekemisessä | [Ohjelmointikielten ja työkalujen johdanto](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
|
|
|
| 02 | Aloittaminen | GitHubin perusteet, tiimityöskentely | Miten käytät GitHubia projektissasi ja teet yhteistyötä muiden kanssa koodipohjan parissa | [GitHubin johdanto](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
|
|
|
| 03 | Aloittaminen | Esteettömyys | Opi verkkosivujen esteettömyyden perusteet | [Esteettömyyden perusteet](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
|
|
|
| 04 | JS Basics | JavaScriptin tietotyypit | JavaScriptin tietotyyppien perusteet | [Tietotyypit](./2-js-basics/1-data-types/README.md) | Jasmine |
|
|
|
| 05 | JS Basics | Funktiot ja metodit | Opettele funktioista ja metodeista sovelluksen logiikan hallintaan | [Funktiot ja metodit](./2-js-basics/2-functions-methods/README.md) | Jasmine ja Christopher |
|
|
|
| 06 | JS Basics | Päätöksenteko JavaScriptillä | Opettele luomaan ehtoja koodissa päätöksentekomenetelmien avulla | [Päätöksenteko](./2-js-basics/3-making-decisions/README.md) | Jasmine |
|
|
|
| 07 | JS Basics | Taulukot ja silmukat | Työskentele tietojen kanssa taulukkojen ja silmukoiden avulla JavaScriptissä | [Taulukot ja silmukat](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
|
|
|
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML-käytännössä | Rakenna HTML verkossa olevaa terrariota varten, keskittyen asettelun rakentamiseen | [Johdanto HTML:ään](./3-terrarium/1-intro-to-html/README.md) | Jen |
|
|
|
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS-käytännössä | Rakenna CSS tyylittämään verkossa olevaa terrariota, keskittyen CSS:n perusteisiin ja sivun responsiivisuuteen | [Johdanto CSS:ään](./3-terrarium/2-intro-to-css/README.md) | Jen |
|
|
|
| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScriptin sulkeet, DOM-käsittely | Rakenna JavaScript terrariumin vetämis- ja pudotusliittymän toiminnalle, keskittyen sulkuihin ja DOM:n käsittelyyn | [JavaScriptin sulkeet ja DOM-käsittely](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
|
|
|
| 11 | [Typing Game](./4-typing-game/solution/README.md) | Kirjoituspelin rakentaminen | Opi käyttämään näppäimistötapahtumia sovelluksen logiikan ohjaamiseen | [Tapahtumapohjainen ohjelmointi](./4-typing-game/typing-game/README.md) | Christopher |
|
|
|
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Työskentely selainten kanssa | Opi miten selaimet toimivat, niiden historia sekä miten rakentaa selaimen laajennuksen ensimmäiset elementit | [Selaimista](./5-browser-extension/1-about-browsers/README.md) | Jen |
|
|
|
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Lomakkeen rakentaminen, API-kutsu ja muuttujien tallennus paikalliseen tallennustilaan | Rakenna JavaScript-selaimen laajennuksen elementit API-kutsujen tekemiseen muuttujien avulla, jotka tallennetaan paikalliseen tallennustilaan | [API:t, lomakkeet ja paikallinen tallennus](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
|
|
|
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Taustaprosessit selaimessa, verkkotehokkuus | Hyödynnä selaimen taustaprosesseja laajennuksen kuvakkeen hallinnassa; opi verkkotehokkuudesta ja optimoinneista | [Taustatehtävät ja suorituskyky](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
|
|
|
| 15 | [Space Game](./6-space-game/solution/README.md) | Kehittyneempi pelikehitys JavaScriptillä | Opi perinnöstä luokkien ja koostumuksen avulla sekä Pub/Sub-kuviosta valmistautuaksesi pelin rakentamiseen | [Johdanto kehittyneeseen pelikehitykseen](./6-space-game/1-introduction/README.md) | Chris |
|
|
|
| 16 | [Space Game](./6-space-game/solution/README.md) | Piirtäminen canvakselle | Opi Canvas API:sta, joka on käytössä ruudulle piirtämisessä | [Piirtäminen canvakselle](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
|
|
|
| 17 | [Space Game](./6-space-game/solution/README.md) | Elementtien liikuttaminen ruudulla | Opi miten elementit liikkuvat karteesisissa koordinaateissa ja Canvas APIn avulla | [Elementtien liikuttaminen](./6-space-game/3-moving-elements-around/README.md) | Chris |
|
|
|
| 18 | [Space Game](./6-space-game/solution/README.md) | Törmäyksentunnistus | Tee elementeistä törmäileviä ja reagoivia, käytä näppäinkomentoja ja tarjoa jäähdytysfunktio pelin toiminnan varmistamiseksi | [Törmäyksentunnistus](./6-space-game/4-collision-detection/README.md) | Chris |
|
|
|
| 19 | [Space Game](./6-space-game/solution/README.md) | Pisteiden laskeminen | Suorita matemaattisia laskutoimituksia pelin tilaan ja suoritukseen perustuen | [Pisteiden laskeminen](./6-space-game/5-keeping-score/README.md) | Chris |
|
|
|
| 20 | [Space Game](./6-space-game/solution/README.md) | Pelin lopetus ja uudelleenkäynnistys | Opi pelin lopettamisesta ja uudelleenkäynnistyksestä, mukaan lukien resurssien siivous ja muuttujien arvon nollaus | [Lopetusehto](./6-space-game/6-end-condition/README.md) | Chris |
|
|
|
| 21 | [Banking App](./7-bank-project/solution/README.md) | HTML-pohjat ja reitit web-sovelluksessa | Opi luomaan monisivuisen verkkosivun arkkitehtuurin runko reitityksen ja HTML-pohjien avulla | [HTML-pohjat ja reitit](./7-bank-project/1-template-route/README.md) | Yohan |
|
|
|
| 22 | [Banking App](./7-bank-project/solution/README.md) | Kirjautumis- ja rekisteröintilomakkeen rakentaminen | Tutustu lomakkeiden rakentamiseen ja validointirutiinien käsittelyyn | [Lomakkeet](./7-bank-project/2-forms/README.md) | Yohan |
|
|
|
| 23 | [Banking App](./7-bank-project/solution/README.md) | Datan hakemisen ja käytön menetelmät | Miten data virtaa sovellukseesi, miten hakea, tallentaa ja poistaa sitä | [Data](./7-bank-project/3-data/README.md) | Yohan |
|
|
|
| 24 | [Banking App](./7-bank-project/solution/README.md) | Tilanhallinnan käsitteet | Opi miten sovelluksesi säilyttää tilansa ja hallitsee sitä ohjelmallisesti | [Tilanhallinta](./7-bank-project/4-state-management/README.md) | Yohan |
|
|
|
| 25 | [Selaimen/VScode koodi](../../8-code-editor) | Työskentely VScoden kanssa | Opi käyttämään koodieditoria| [Käytä VScode koodieditoria](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
|
|
|
| 26 | [AI-apulaiset](./9-chat-project/README.md) | Työskentely tekoälyn kanssa | Opi rakentamaan oma tekoälyavustajasi | [AI-avustajaprojekti](./9-chat-project/README.md) | Chris |
|
|
|
|
|
|
## 🏫 Pedagogiikka
|
|
|
|
|
|
Oppimäärämme on suunniteltu kahden keskeisen pedagogisen periaatteen mukaisesti:
|
|
|
* projektipohjainen oppiminen
|
|
|
* säännölliset kyselyt
|
|
|
|
|
|
Ohjelma opettaa JavaScriptin, HTML:n ja CSS:n perusteet sekä viimeisimmät työkalut ja tekniikat, joita nykyiset web-kehittäjät käyttävät. Oppilaat saavat käytännön kokemusta rakentamalla kirjoituspelin, virtuaalisen terrariumin, ekologisen selaimen laajennuksen, avaruusmuukalaisaiheisen pelin ja yrityskäyttöön tarkoitetun pankkisovelluksen. Sarjan lopussa oppilaat ovat hankkineet vahvan ymmärryksen verkkokehityksestä.
|
|
|
|
|
|
> 🎓 Voit suorittaa tämän oppimäärän ensimmäiset oppitunnit Microsoft Learnin [Oppimispolun](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) kautta!
|
|
|
|
|
|
Varmistamalla, että sisältö vastaa projekteja, prosessi tehdään opiskelijoille kiinnostavammaksi ja käsitteiden omaksuminen tehostuu. Kirjoitimme myös useita aloitusoppitunteja JavaScriptin perusteista esittelemään käsitteitä, jotka on yhdistetty videoon "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" -videokokoelmasta, joiden tekijöistä osa osallistui tähän oppimäärään.
|
|
|
|
|
|
Lisäksi kevyt kysely ennen tuntia suuntaa opiskelijan tarkoitusta oppia aihetta, ja toinen kysely tunnin jälkeen takaa lisäomaksumisen. Tämä oppimäärä on suunniteltu joustavaksi ja hauskaksi, ja sen voi suorittaa kokonaan tai osittain. Projektit alkavat pienestä ja monimutkaistuvat vähitellen 12 viikon jakson loppuun mennessä.
|
|
|
|
|
|
Vaikka olemme tarkoituksella välttäneet JavaScript-kehysten esittelyä keskittyäksemme perusosaamiseen, joka web-kehittäjällä tulee olla ennen kehysten käyttöönottoa, hyvä seuraava askel oppimäärän suorittamisen jälkeen olisi Node.js:n opiskeluun keskittyvä videokokoelma: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
|
|
|
|
|
|
> Tutustu [käyttäytymissääntöihimme](CODE_OF_CONDUCT.md) ja [osallistumisohjeisiin](CONTRIBUTING.md). Otamme mielellämme vastaan rakentavaa palautettasi!
|
|
|
|
|
|
|
|
|
## 🧭 Offline-käyttö
|
|
|
|
|
|
Voit käyttää tätä dokumentaatiota offline-tilassa käyttämällä [Docsifyä](https://docsify.js.org/#/). Forkkaa tämä repositorio, [asenna Docsify](https://docsify.js.org/#/quickstart) paikalliselle koneellesi, ja aja sitten tämän repojen juuressa komentoa `docsify serve`. Verkkosivusto palvellaan portissa 3000 osoitteessa `localhost:3000`.
|
|
|
|
|
|
## 📘 PDF
|
|
|
|
|
|
Kaikkien oppituntien PDF löytyy [täältä](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
|
|
|
|
|
|
|
|
|
## 🎒 Muut kurssit
|
|
|
Tiimimme tuottaa myös muita kursseja! Tutustu:
|
|
|
|
|
|
<!-- CO-OP TRANSLATOR OTHER COURSES START -->
|
|
|
### LangChain
|
|
|
[](https://aka.ms/langchain4j-for-beginners)
|
|
|
[](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
|
|
|
|
|
|
---
|
|
|
|
|
|
### Azure / Edge / MCP / Agentit
|
|
|
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
|
|
|
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
|
|
|
[](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
|
|
|
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
|
|
|
|
|
|
---
|
|
|
|
|
|
### Generatiivinen AI -sarja
|
|
|
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
|
|
|
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
|
|
|
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
|
|
|
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
|
|
|
|
|
|
---
|
|
|
|
|
|
### Perusopiskelu
|
|
|
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
|
|
|
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
|
|
|
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
|
|
|
[](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
|
|
|
[](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
|
|
|
[](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
|
|
|
[](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
|
|
|
|
|
|
---
|
|
|
|
|
|
### Copilot-sarja
|
|
|
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
|
|
|
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
|
|
|
[](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst)
|
|
|
<!-- CO-OP TRANSLATOR OTHER COURSES END -->
|
|
|
|
|
|
## Apua saamaan
|
|
|
|
|
|
Jos jumitut tai sinulla on kysyttävää tekoälysovellusten rakentamisesta, liity muiden oppijoiden ja kokeneiden kehittäjien keskusteluihin MCP:stä. Se on kannustava yhteisö, jossa kysymykset ovat tervetulleita ja tietoa jaetaan vapaasti.
|
|
|
|
|
|
[](https://discord.gg/nTYy5BXMWG)
|
|
|
|
|
|
Jos sinulla on tuotepalautetta tai rakentaessa ilmenee virheitä, käy:
|
|
|
|
|
|
[](https://aka.ms/foundry/forum)
|
|
|
|
|
|
## Lisenssi
|
|
|
|
|
|
Tämä arkisto on lisensoitu MIT-lisenssillä. Lisätietoja on tiedostossa [LICENSE](../../LICENSE).
|
|
|
|
|
|
---
|
|
|
|
|
|
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
|
|
|
**Vastuuvapauslauseke**:
|
|
|
Tämä asiakirja on käännetty tekoälypohjaisella käännöspalvelulla [Co-op Translator](https://github.com/Azure/co-op-translator). Vaikka pyrimme tarkkuuteen, otathan huomioon, että automaattikäännöksissä voi esiintyä virheitä tai epätarkkuuksia. Alkuperäinen asiakirja sen alkuperäiskielellä tulee pitää ensisijaisena lähteenä. Tärkeissä asioissa suositellaan ammattimaista ihmiskäännöstä. Emme ole vastuussa tämän käännöksen käytöstä aiheutuvista väärinymmärryksistä tai tulkinnoista.
|
|
|
<!-- CO-OP TRANSLATOR DISCLAIMER END --> |
