---
# System prepended metadata

title: Web kehittäjän blogi // Nikolai Poutanen

---

# Web kehittäjän blogi // Nikolai Poutanen
## Web-ohjelmointi, syksy 2021
### Tekijä: [2006238]

##### Alkusanat

Seuraan tässä blogissa edistymistäni web-ohjelmointi kurssilla.
Blogin lopussa on kurssin itsearvointi.

## Viikko 1 & 2(1.9.- 10.9.2021)


Sain hyvää kertausta web-ohjelmoinnin perusteista.

Rekisteröidyin Slackiin.
Asensin tarvittavat ohjelmistot.
##### -Git
##### -VScode
##### -Slack
##### -NodeJs


#### Harjoitus 1
-Kopioin projektin pohjan ja tutkin koodia.
-Asensin laajennukset VSCodeen.
###### -Bracket Pair Colorizer 2
###### -Prettier-Code formatter
-Tein pyydetyt asetusmuutokset ja asensin Live-Serverin.
-Muokkasin pohjaprojektin koodia hieman:
###### Lisäsin opintojaksot.html näkymään linkit kahdelle -opintojaksolle. Web.html & Tra.html



***



### Mitä harjoituksia tein
##### JavaScript tehtävä 1.
Kirjoitin javascriptillä ohjelman joka pyytää käyttäjältä syötteen jonka, ohjelma tarkistaa onko syötetty merkkijono palidromi.

Algoritmi kävi läpi syötetyn merkkijonon molemmista suunnista ja testasi ovatko arvot samoja. 


## Viikko 3 & 4 

### Mitä opin 
JavaScriptin perusteita.
Sain hyvää kertausta web-ohjelmoinnin perusteista. 
Opettelin lisää Javascriptin syntaksia ja perusteita.

### Mitä harjoituksia tein
Opettelin lisää Javascriptin syntaksia ja perusteita.
Tein javascript tehtävän #2 ja #3 ja lisäsin ohjelmakoodit git repositoryyn.

Tein tehtävän 3. Jossa tehtiin luokkamäärittelyä ja perityimistä javascriptillä.

## Viikko 5 & 6

### Mitä opin 
Opin käyttämään web ohjelmoinnissa HTTP protokollaa.
Pääsin myös jyvälle Express frameworkin toiminnasta.

### Mitä harjoituksia tein
Opettelin lisää Javascriptin syntaksia ja perusteita.
Tein tehtävän #4a jossa luotiin sanakirja rest api joka käytti tietokantana .txt tiedostoa. 

Tein tehtävän #4b eli loin käyttöliitymän edelliessä tehtävässä tehdyllä api:lle.

## Viikko 7 & 8

### Mitä opin 
Opin testaamaan post,get,put,delete etc. kutsuja hyödyntämällä Postman ohjelmaa.
Harjoittelin myös hyödyntämään front-end ohjelmoinnissa DOM:ia ja jQueryä.

### Mitä harjoituksia tein

Tein tehtävän 5 jossa, loin Node.js joka käyttää express:iä ja mysql:ää.
Onnistuin tehtävässä kohtuullisesti. Jouduin käyttämään aikaa että sain sql aliohjelmien kutsut kuntoon. Tämä oli tähän mennessä haastavin ja samalla opettavaisin harjoitus. 


## Viikko 9

### Mitä opin 
Reactin perusteita.

### Mitä harjoituksia tein

Tein harjoitustehtävän jossa käytettiin reactia ja hookkeja.
Onnistuin tehtävässä hyvin. 

## Viikko 10

### Mitä opin 

- Opin hitaasti mutta varmasti reactin logiikkaa.
- Opin hyödyntämään Axiosta 


### Mitä harjoituksia tein

Aloitin tekemään tehtävää 6.

- Loin kaksi kansiota johon toiseen tuli serverin puoli ja toiseen frontend eli client. 
- Loin client kansioon react sovelluksen ja asensin Axios kirjaston.
- Loin frontendiin kentät tekstille ja kentille eventit niin että kenttiin kirjoitettu data on saatavilla.
- Loin kaksi painiketta tiedon tallentamiseen ja näyttämiseen sekä onClick eventit näille painikkeille.
- Tein MySql Workbenchillä dummy tietokannan.
- Aloitin serverin koodaamisen ottamalla yhteyden mySQL tietokantaan. ![](https://i.imgur.com/rPpNyfH.png)

## Viikko 11

### Mitä opin 

- Menin vain enemmän sekaisin reactista :S
- Aloitin opiskelemaan enemmän bootstrapista
- Opin että en voi lyhyessä ajassa ja kiireessä tehdä hyvää jälkeä.

### Mitä harjoituksia tein

Jatkoin tehtävää 6. 

- Tein serverin loppuun
    - Lisästin post,get,put ja delete metodit 
- Tein käyttöliittymän loppuun
![](https://i.imgur.com/4ewv4I8.png)

## Viikko 12

Tein portfolion josta voi tarkastella päällisin puolin mitä olen tehnyt web ohjelmointi kurssilla. 
Käytin portfoliossa:
    - Bootstrap
    - HTML
    - CSS
    - JavaScript
### Kuva portfoliosta:
![](https://i.imgur.com/HElzTOE.png)

Tein runsaasti web-ohjelmointia liittyen ketteräkehitysprojektiin. Pääsin tutustumaan
azuren työkaluihin ja pääsin pintaraapaisun verran käsiksi koneoppimiseen ja "tekoälyyn". Projekti oli mielenkiintoinen erityisesti ohjelmoinnin osalta ja sain käyttää runsaasti web-ohjelmointi kurssilla saamiani asioita hyödyksi työskentelyssä projektin parissa. 
Teimme ketteräkehitysprojektin tuotteen web-sovelluksena, jossa käytimme toteutukseen
- ReactJS
- CSS
- HTML
- Lyhyt video sovelluksen käytöstä: https://youtu.be/rlQJrkvPdcQ


## Viikko 13-14

Tutkin kirjoittamiani koodeja ja jatkoin ketteräkehitysprojektin ohjelmoinnin parissa. 

### Huomioita koodista: 
- löysin useita bugeja, jotka vaikuttavat ohjelmakoodien toimintaan
- osa virheistä oli huolimattomutta ja osa selkeitä virheitä ymmärryksessä siitä miten jotkin esim. reactin ydinasioista toimii.
    

# ARVIOINTI

## Itsearviointi:

Opin tämän kurssin aikana valtavasti web-ohjelmoinnista. En tullut kurssille täysin ilman pohjatietoa, sillä olin ohjelmoinut aiemmin hieman php:llä, mutta ymmärrykseni webin kiemuroista hahmottui entistä selkeämmäksi. Opiskeltavat teknologiat ovat nykyaikaisia ja taidoista on taatusti hyötyä mikäli aikoo työskennellä web- ja ohjelmistokehityksen parissa kuten itse toivon tulevaisuudessa tekeväni.
#### Huomioita:
- Onnistuin tehtävissä kohtalaisesti.
- Sain ohjelmakoodit toimimaan.
- Opin soveltamaan oppimiani ohjelmointitaitoja(ketteräkehitysprojekti).
- Kurssin kohokohta oli ehdottomasti React johon aion tutustua jatkossa itsenäisesti.
- Tein paljon töitä kurssin eteen.

Opittavaa kuitenkin vielä jäi ja tämä kurssi antoi hyvät eväät opiskella aiheesta lisää. Minun olisi tullut myös olla hieman huolellisempi tehtäviä tehdessä.
#### Huomioita:

- Unohdin miltei kokonaan ohjelmakoodien kommentoinnin.
- Ohjelmissa oli bugeja.
- Ohjelmakoodeissa oli huolimattomuusvirheitä.
- Olisin voinut kysyä enemmän apua ja hakata päätä seinään vähemmän.
- Priorisoin blogin ylläpidon väärin ja siitä syystä päivitysvälit venyivät ja blogi ei ole niin hyvä kun tahtoisin.

#### Antaisin itselleni kurssista arvosanan: 3 tai 4
