Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/neoito-hub/intro-to-web-development-workshop
Startup files and notes for web development intro workshop
https://github.com/neoito-hub/intro-to-web-development-workshop
Last synced: about 1 month ago
JSON representation
Startup files and notes for web development intro workshop
- Host: GitHub
- URL: https://github.com/neoito-hub/intro-to-web-development-workshop
- Owner: neoito-hub
- Created: 2019-08-19T17:41:16.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-01-04T07:54:59.000Z (almost 2 years ago)
- Last Synced: 2023-03-05T16:38:22.487Z (almost 2 years ago)
- Language: JavaScript
- Size: 2.68 MB
- Stars: 0
- Watchers: 2
- Forks: 1
- Open Issues: 33
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Introduction to Web Development
## Feedback
[link](https://docs.google.com/forms/d/e/1FAIpQLSd8quQSXMXXerZnWMHxQVjbM8oq6IcPYNRBPZ0jQ0E9tvIHBg/viewform?vc=0&c=0&w=1)
## Index
1. [Session 0](#session-0)
2. [Session 1](#session-1)
3. [Session 2](#session-2)
4. [Session 3](#session-3)
## Session 0
### Pre-requisites
- A computer with GNU\Linux - Ubuntu
- Browser - Chrome / Firefox
- [Nodejs](https://github.com/nodesource/distributions/blob/master/README.md) `> 8`
```
$ curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -
$ sudo apt-get install -y nodejs
```
- [VSCode](https://code.visualstudio.com/Download)
- [Postman](https://www.getpostman.com/downloads/)
- [SQLite](https://sqlite.org/download.html)
```
$ sudo apt-get install zlib1g:i386
$ #or
$ sudo apt-get install lib32z1
```
### An intro to the web
- Any process that runs on a port or a socket, waiting to recieve connections
can be considered a `service`.
- [How does the we work](https://www.youtube.com/watch?v=Dxcc6ycZ73M&list=PLzdnOPI1iJNfMRZm5DDxco3UdsFegvuB7)?
- IP Addresses, DNS and URLs
- All a website/webapp does is, do an `action` on a/many `resouce[s]`
### The web browser
- `F12`
- Not just `http://`
- The DOM
- HTML/CSS/JS
## Session 1
- `python -m SimpleHTTPServer`
- Node.js and Chrome
- Synchronous and Asynchronous
- JS fundamentals
- **BUILD** a vanilla JS app
## Session 2
### Client and Server
- Header and payload - `curl -i http://localhost:3030/`
- The `action`
```
C - POST
R - GET
U - PUT
D - DELETE
```
- The `resource`
```
/songs - GET
/songs - POST
/songs/1 - GET
/songs/1 - PUT
/songs/1 - DELETE
```
- The `data` for the `resource` can be in a database, a file or in memory of a server.
- Databases and Tables
- **BUILD** a server - Express.JS
## Session 3
- SSR vs SPAs
- Intro to Vue.Js
- **BUILD** REST API + VUE CLI generated app