counterweight/fullstackopen-notes
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

part 0 complete

Browse source
This commit is contained in:
counterweight 2025-05-17 23:43:48 +02:00
parent 75b663d0a0
commit deb765ff5d
Signed by: counterweight
GPG key ID: 883EDBAA726BD96C
3 changed files with 110 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

0
parts/0/exercise0.4. Normal file
View file

107
parts/0/notes.md Normal file
View file

@ -0,0 +1,107 @@
> Writing HTML amid the code is of course not smart, but for old-school PHP programmers, it was a normal practice.
Lol
I need to do the exercises 0.1.-0.6. here: https://fullstackopen.com/en/part0/fundamentals_of_web_apps
* [X] 0.1
* [X] 0.2
* [X] 0.3
* [X] 0.4
* [X] 0.5
* [X] 0.6
## exercise 0.4
```mermaid
sequenceDiagram
participant browser
participant server
Note left of browser: User fills in form and clicks on submit button.
browser->>server: POST https://studies.cs.helsinki.fi/exampleapp/new_note
activate server
server->>browser: 302 Redirect to https://studies.cs.helsinki.fi/exampleapp/notes
deactivate server
browser->>server: GET https://studies.cs.helsinki.fi/exampleapp/notes
activate server
server-->>browser: HTML document
deactivate server
browser->>server: GET https://studies.cs.helsinki.fi/exampleapp/main.css
activate server
server-->>browser: the css file
deactivate server
browser->>server: GET https://studies.cs.helsinki.fi/exampleapp/main.js
activate server
server-->>browser: the JavaScript file
deactivate server
Note right of browser: The browser starts executing the JavaScript code that fetches the JSON from the server
browser->>server: GET https://studies.cs.helsinki.fi/exampleapp/data.json
activate server
server-->>browser: [{ "content": "HTML is easy", "date": "2023-1-1" }, ... ]
deactivate server
Note right of browser: The browser executes the callback function that renders the notes, including the new note.
```
## exercise 0.5
```mermaid
sequenceDiagram
participant browser
participant server
browser->>server: GET https://studies.cs.helsinki.fi/exampleapp/spa
activate server
server-->>browser: HTML document
deactivate server
browser->>server: GET https://studies.cs.helsinki.fi/exampleapp/main.css
activate server
server-->>browser: the css file
deactivate server
browser->>server: GET https://studies.cs.helsinki.fi/exampleapp/spa.js
activate server
server-->>browser: the SPA JavaScript file
deactivate server
Note right of browser: The browser starts executing the JavaScript code that fetches the JSON from the server
browser->>server: GET https://studies.cs.helsinki.fi/exampleapp/data.json
activate server
server-->>browser: [{ "content": "HTML is easy", "date": "2023-1-1" }, ... ]
deactivate server
Note right of browser: The browser executes the callback function that renders the notes.
```
## exercise 0.6
* browser fills in data and triggers form submission
* browser renders the new note without talking to the server
* browser sends POST request to `/new_note_spa`
* server returns 201 created
* browser logs the response to console
```mermaid
sequenceDiagram
participant browser
participant server
Note right of browser: Form gets filled and submission button gets triggered.
Note right of browser: The browser updates the in-memory notes array and renders again all notes, before talking to the server at all.
browser->>server: POST https://studies.cs.helsinki.fi/exampleapp/new_note_spa
activate server
server-->>browser: 201 Created with JSON success message.
deactivate server
Note right of browser: browser logs to console the server's response text.
```